赞
踩
前言:习惯了使用ArcGIS JS API,它里面的Graphic和GraphicsLayer很方便,其中
Graphic = geometry+symbol+attribute+infotemplate,往地图上添加带属性信息Graphic,在单击Graphic的时候可以“取出”
之前存在Graphic里的属性信息。最近使用leaflet作为开发技术,我并没有在leaflet里找到和arcgis的Graphic类似的机制,不过
可以使用 Leaflet 的类扩展机制增加属性信息。该笔记 以Marker为例,扩展Marker使其像arcgis js api的graphic类似,带有自
定义的属性信息。。。
1、创建自定义类 L.MarkerEx
- L.MarkerEx = L.Marker.extend({
- _customAttr:{},
- setAttr(options){
- Object.assign(this._customAttr,options)
- },
- getAttr(){
- return this._customAttr;
- }
- });
2、创建L.MarkerEx类对应的函数L.markerEx (类名首字母大写,方法名首字母小写)
- L.markerEx=function(latlon){
- return new L.MarkerEx(latlon);
- }
3、 验证 自定义的扩展自L.Marker的类L.MarkerEx
- //创建 L.MarkerEx类对象,添加到map
- var marker = L.markerEx(L.latLng(-37.82, 175.24)).addTo(map);
- // 给marker添加属性信息
- marker.setAttr({name:"张三",sex:"未知",age:"18"});
- //单击marker,输出自定义的属性信息
- marker.on('click',function (evt) {console.log(evt.target.getAttr())})
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。