向 openlayers 地图添加文本的最简单示例？

Question

我想在特定经纬度的 OpenLayers 地图上添加文本标签。

我一直在努力寻找一个不涉及从文件等中提取数据的简洁示例。我已经能够将多边形、图标和各种鼠标事件添加到我的地图和内容中；但出于某种原因，我似乎无法仅添加一些简单的文本。

有人可以把我的星期五设为 post 一个简单的例子吗？

Answer 1

您可以使用仅包含文本（不包含几何图形）的样式创建特征。

var labelFeature = new Feature({
  geometry: new Point([0, 0]),
});

var labelonly = new Style({
    text: new Text({
        font: '14px sans-serif',
        text: 'hello',
        fill: new Fill({
            color: 'black'
        }),
    })
});


labelFeature.setStyle(labelonly);

var vectorSource = new VectorSource({
  features: [labelFeature]
});

var vectorLayer = new VectorLayer({
  source: vectorSource
});


var map = new Map({
  layers: [vectorLayer],
  target: document.getElementById('map'),
  view: new View({
    center: [0, 0],
    zoom: 3
  })
});

向 openlayers 地图添加文本的最简单示例？

Simplest example of adding text to an openlayers map?

javascript

openlayers