使用offset -OpenLayers将标签/文本分配给图标

问题描述

我想使用OpenLayers将文本或标签分配给图标。我可以将标签分配给图标，但是它将文本放置在图标上。但是我想在偏移处显示标签，因此图标和标签都可以正确显示。我已经尝试过使用offsetY，但是它不起作用，并且不会更改放置位置。

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;
    }      

解决方法

文本选项不应位于Stroke构造函数之内，Baseline也应为textBaseline

            stroke: new ol.style.Stroke({
              color: '#fff',width: 2,}),textAlign: 'center',textBaseline: 'hanging',offsetX : 0,offsetY : -12,