首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用偏移-OpenLayers将标签/文本指定给图标

使用偏移-OpenLayers将标签/文本指定给图标
EN

Stack Overflow用户
提问于 2020-08-14 16:18:49
回答 1查看 90关注 0票数 0

我想使用OpenLayers给图标分配文本或标签。我可以将标签分配给图标,但它会将文本放在图标.but上,我要在偏移位置显示标签,以便图标和标签都能正确显示。我试过使用offsetY,但它不工作,也没有改变位置。

代码语言:javascript
运行
复制
var styleToponimiFunction = function(feature,resolution) {
      console.log(feature);
      var iconName;
     
      if (feature.get("remark")=='Daerah Istimewa') {
        iconName='daerah_istimewa2.png';  
      }
      else if (feature.get("remark")=='Kecamatan'){
        iconName='kecamatan.png';  
      }
      iconStyle = [new ol.style.Style({
        
          image: new ol.style.Icon(({
              anchor: [0.5, 46], 
              anchorXUnits: "fraction",
              anchorYUnits: "pixel",              
              scale:0.03,
              opacity:1,
              src: "icons/" + iconName,
             })),
          text: new ol.style.Text({
                text: feature.get('namobj'),
                font: '12px Calibri,sans-serif',
                fill: new ol.style.Fill({ color: 'black' }),
                stroke: new ol.style.Stroke({
                color: '#fff', 
                width: 2,
                textAlign: 'center',
                Baseline: 'hanging',               
                offsetX : 0,
                offsetY : -12,           
                          
                }),
                declutter: true,
                overflow: true
             }),           
             })
             ]
      return iconStyle;
    }      
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-08-15 21:05:51

文本选项不应位于Stroke构造函数内,而且Baseline应为textBaseline

代码语言:javascript
运行
复制
            stroke: new ol.style.Stroke({
              color: '#fff', 
              width: 2,
            }),
            textAlign: 'center',
            textBaseline: 'hanging',               
            offsetX : 0,
            offsetY : -12,           
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63409084

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档