Vue框架如何搭建这就不赘述了,重点在于瓦片数据的加载
在vue中引用leaflet需要先通过npm install leaflet --save安装
然后在mian.js中引入leaflet的css样式
![](https://img.haomeiwen.com/i24337195/51cb43eb450c3d62.png)
接下来就是在你需要使用leaflet的文件中引入leaflet
这里天地图中的key需要你去自己去申请
定义一个容器用来绑定leaflet的地图
![](https://img.haomeiwen.com/i24337195/908ee08b30f0ef7c.png)
绑定之后接下来就是通过L.tileyaer去加载需要展示的底图与文件
重点
在定义leaflet的map时crs属性十分关键,缺少改属性瓦片图层就无法进行展示,原因是该属性是leaflet计算瓦片数据的关键
是这么一个简单的属性,却是整个leaflet瓦片加载的核心算法必然依赖项。当然,对于leaflet官档,自然而然的给出了一句忠告:
可以参考:https://blog.csdn.net/qq_29722281/article/details/102635604
![](https://img.haomeiwen.com/i24337195/0d806b96a9931cc8.png)
最后附上代码
![](https://img.haomeiwen.com/i24337195/dabb872a81b1dc8b.png)
网友评论