您好我需要在OpenLayers地图中的GeoJson图层的每个点下方显示一些文本。我有一个GeoJson源,我可以在地图上的右坐标处绘制点。我想在Point下方绘制一些文本,文本来自一个属性。
我的GeoJson是这样的:
{ "type": "FeatureCollection",
"features": [
{ "type": "Feature",
"geometry": {"type": "Point", "coordinates": [102.0, 0.5]},
"properties": {"name": "example text"}
},
{... other features ... }
]
}
我需要在Point下面显示文本“example text”。怎么做?
答案 0 :(得分:1)
我修改了http://openlayers.org/en/latest/examples/geojson.html?q=GeoJSOn示例以演示如何执行此操作。
我修改了GeoJSON
数据以添加一些属性。
由于您希望在功能属性中声明文本,因此需要根据功能处理样式。
相关代码:
var styleFunction = function(feature) {
var text = new ol.style.Style({
text :new ol.style.Text({
text: feature.getProperties().name,**//this is where the property value used**
font: '12px Calibri,sans-serif',
weight:'Bold',
fill: new ol.style.Fill({ color: '#000' }),
stroke: new ol.style.Stroke({
color: '#D3D3D3', width: 10
}),
offsetX: 30,
offsetY: -25,
rotation: 0
})
});
return [styles[feature.getGeometry().getType()],text];
};
创建一个ol.style.Text
对象,并将该对象追加到ol.Feature
样式属性(一个用于特征样式,另一个用于标签)
我在plunker中创建了一个工作代码。完成此link。