我在OL地图上有几个图层,包含相同大小的特征的轮廓,背景颜色和标签,因此您可以显示或隐藏一个或多个图层。其中两个图层只是标签...样式不包含填充或描边。一张标签应该坐在上面的其他的功能中心为中心,但OL似乎它们分散垂直进一步远离或靠近在一起,在相对于特征多边形的高度,这样的:Openlayers 3相对于特征大小的特征标签位置?
我曾尝试在较低标签的文本样式块中设置offsetY: 15
,在较低标签前添加一个换行符,并在较低标签上设置textBaseline:'top'
,并在顶部设置textBaseline:'bottom'
(这是最后一次尝试!),但它们总是以不同的方式传播!
下面是我对上标签样式块:
function fields_label_style() {
return [
new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255,255,255,0)'
}),
stroke: new ol.style.Stroke({
color: 'rgba(255,255,255,0)',
width: 1
}),
text: new ol.style.Text({
font: '13px Calibri,sans-serif',
fill: new ol.style.Fill({ color: '#ffffff' }),
stroke: new ol.style.Stroke({
color: '#000000', width: 2
}),
// get the text from the feature - `this` is ol.Feature
// and show only under certain resolution
text: map.getView().getZoom() > 14 ? this.get('description') : ''
})
})
];
}
而对于较低的标签:
function cropping_label_style() {
return [
new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255,255,255,0)'
}),
stroke: new ol.style.Stroke({
color: 'rgba(255,255,255,0)',
width: 1
}),
text: new ol.style.Text({
font: '13px Calibri,sans-serif',
fill: new ol.style.Fill({ color: '#ffffff' }),
stroke: new ol.style.Stroke({
color: '#000000', width: 2
}),
// get the text from the feature - `this` is ol.Feature
// and show only under certain resolution
text: map.getView().getZoom() > 14 ? this.get('description') : '',
offsetY: 15
})
})
];
}
两个肯定有相同的多边形轮廓。没有问题。我只能想,也许的OpenLayers被处理偏移量为一个百分比,而不是如文档中陈述像素:
看起来像它是从我可以告诉的像素:tinyurl.com/hxpj6hn显示一个示例,适用于像素。 尝试在每个数组中使用一种文本样式返回样式数组。同样的结果? –