从事leaflet开发的同学或多或少应该都接触过leaflet的插件,因为leaflet的框架理念是只封装最基础最核心的部分,因此优点在于代码体积非常小,使用起来简单轻便。同时缺点就是功能组件没那么丰富,有很多开发需求都必须借助第三方插件来完成。因此你可以看到leaflet的插件市场也是非常丰富。
本文我们分享给大家如何使用leaflet官方提供的方式,来封装一些自定义的插件。
首先官方也做了声明,想要学会封装插件必须先对js、面向对象编程、有一个深入的了解。另外要知道js的特性,比如如何在js中实现类的实例,继承,原型链等知识。
在leaflet中。封装插件的方式主要有3种,我们一一来介绍。
首先第一种是使用L.Class.extend( )方法来实现自定义方法的封装,什么意思呢?就是你如果想写一些自己定义的方法,比如你想写一个符合你的业务需求的方法,并且以后希望在各个地方都能够调用这个方法,并且最好是通过leaflet的核心类L来调用这个方法。那么官方为你提供了extend方法让你将自己的属性和方法融合到leaflet当中。
现在假设我们要自定义一个方法叫做addColorfulLayer(),意思是加载一个五彩缤纷的图层,参数设计呢是传入一个geojson数据即可,通过调用此方法生成一个图层对象layer,最后通过layer.addTo()方法将图层添加在地图上。
L.Class.extend( )的使用流程是,先建立一个自定义的类,然后使用L.Class.extend( )将L身上的方法和属性都传递给你自己建立的类,然后使用自定义类的实例去调用你自己封装的方法。具体代码如下: