openlayers3中polygon上添加icon
2016-06-18 09:45
399 查看
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(); } }), new ol.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' }) }) ] } });
效果如下:
相关文章推荐
- openlayers加载天地图代码
- 使用OpenLayers实现一个在鼠标点击处添加标记的效果
- openlayers 加载googlemap v3 遭遇弹出copyright 异常的解决
- openlayers 例子分类
- 使用Openlayers 3 在地图增加天气预报
- Openlayers2调用ArcGis的WMTS服务,restful和kvp两种模式
- OpenLayers根据两点连线
- openlayers2中selectcontrol用法
- openlayers限制地图拖动区域
- openlayers中设置地图缩放级别
- 电子地图中要素旋转功能实现
- Ol3中Map事件全解析
- 图解OpenLayers-2.13.1入门实例
- openlayers 初步认识
- OpenLayers项目分析——(一)项目介绍
- OpenLayers 项目完整分析(二)源代码总体结构分析
- OpenLayers 项目分析(三)BaseTypes
- OpenLayers 项目分析(三)-OpenLayers中定制JavaScript内置类
- OpenLayers项目分析(四)空间数据的组织与实现
- OpenLayers项目分析(五) 数据解析以GML为例