我们可以使用html标签和CSS在openlayers中设置样式吗?

时间:2019-03-22 12:29:36

标签: javascript openlayers openlayers-3 openlayers-5

我在OpenLayers 5中具有多边形功能。它具有一些随机ID,我需要将其显示在多边形的中心,并稍微右对齐。

我已经使用ol.style.Text()样式在多边形上显示ID。我可以使用类的offsetXoffsetY选项来管理对齐方式,但是由于ol.style.Text()仅接受文本数据,因此如何显示html元素中的文本或模仿文本。

openlayers中的叠加层一定会解决问题,我可以在几何上使用getInteriorPoint()来获得多边形的中点,但是我不想使用叠加层,因为地图上可能有大量的多边形并添加重叠会降低性能和内存利用率。

这是预期的输出/我正在尝试实现:

Expected output

这是我的代码:

Current code

还要检查我为切换ID的开启和关闭所做的操作,并提及是否可以更好地进行操作。可以根据缩放级别打开和关闭ID。

1 个答案:

答案 0 :(得分:1)

代替使用CSS,您可以在canvas元素中绘制背景,并以图标样式使用背景。并使用样式功能为多边形的内部点设置样式,而无需创建更多特征:

COUNT(DISTINCT)