我想使用 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,
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句