openlayers3中polygon上新增icon
阿新 • • 發佈:2019-01-01
var vectorSource = new ol.source.Vector();
var polygon = new ol.geom.Polygon([[[120.97, 23.1],[115.97, 15.1],[118.97, 13.1],[120.97, 20.1]]]).transform('EPSG:4326', 'EPSG:3857'); vectorSource.addFeature( new ol.Feature({ geometry: polygon, name : '面', index : '1'})
);//新增面
/*
*style可以一個數組型別的ol.style.Style,如下所示
*/ var vectorLayer = new ol.layer.Vector({ source: vectorSource, style: function(feature){ return [ new ol.style.Style({ image: new ol.style.Icon( anchorXUnits: 'fraction', anchorYUnits: 'pixels', src: './images/4.png' })), geometry: function (feature) { var coordinates = feature.getGeometry().getCoordinates()[0]; return feature.getGeometry().getInteriorPoint(); } }), newol.style.Style({ text: new ol.style.Text({ text: feature.get('name'), fill: new ol.style.Fill({ color: '#ff0000' }) }), fill: new ol.style.Fill({ color: '#ff0000' }), stroke: new ol.style.Stroke({ color: '#ff0000' }) }) ] } });
效果如下: