Openlayers 3 特征标签位置相对于特征大小？

Question

我在 OL 地图上有多个图层，其中包含相同大小要素的轮廓、背景颜色和标签，因此您可以显示或隐藏一个或多个图层。其中两层只是标签……样式不包含填充或描边。一个标签应位于要素中心的另一个标签上方，但 OL 似乎将它们垂直分布得相对于要素多边形的高度更远或更近，如下所示：

我试过在下标签的文本样式块中设置一个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 可能将偏移量视为百分比而不是文档中所述的像素：

Answer 1

更多的是解决方法而不是答案，因为我认为您的方法没有任何问题，但这会产生相同的结果吗？

[
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
    })
}),

new ol.style.Style({
    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') : ''
    })
}),

new ol.style.Style({
    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
    })
})]

Answer 2

由于我的代码中存在一些复杂的循环，我忽略了某些字段的多边形边界之间存在细微差异，这意味着它们的标签显示在略有不同的位置。现在，我已将所有多边形边界设置为与标签确实正确对齐的所有多边形边界，offsetY 的行为符合预期。抱歉。

Openlayers 3 特征标签位置相对于特征大小？

Openlayers 3 feature label position relative to size of feature?

openlayers-3