首先是定义一个layer:
///点图
function createTmpVector() {
vectorSource = new ol.source.Vector({
format: new ol.format.GeoJSON()
});
toolVector = self.options.vector = new ol.layer.Vector({
id: 'toolQueryVector',
type: 'mainVector',
source: vectorSource,
zIndex: 99
})
mapHelper.map.addLayer(toolVector);
}
然后就是给要数添加样式:
方法一,是在定义图层时添加有个style的返回函数:
style: function (feat) {
var imageSrc = feat.get('info').Values.img;
return new ol.style.Style({
image: new ol.style.Icon({
src: imageSrc,
})
})
},
方法二,使用ol.styleFunction:
for (var i in datas) {
var point = new ol.geom.Point([datas[i].X, datas[i].Y]);
var feature = new ol.Feature({
geometry: point,
});
feature.setId(datas[i].ID);
feature.setStyle(getStyle(datas[i]));
toolVector.getSource().addFeature(feature);
}
//这里添加不同名字的标注
function getStyle(feature) {
var imageSrc = "../../image/map/label.png";
return new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255, 255, 255, 0.2)'
}),
stroke: new ol.style.Stroke({
color: '#ffcc33',
width: 2
}),
image: new ol.style.Icon({
src: imageSrc,
imgSize: [10, 22],
//scale: 0.5
offsetX: 0,
offsetY: 11
}),
text: new ol.style.Text({
textAlign: 'center',
text: feature.NAME,//!
offsetX: 15,
offsetY: -10
})
})
}
如果是在定义feature时在ol.Feature下定义style是无效的。
new ol.Feature({
geometry: point,
style:getStyle(datas[i])
});