光之使者 发表于 2023-3-2 01:57:12

vue+leaflet示例:在线地图切换显示(附源码下载)

demo源码运行环境以及配置


[*]运行环境:依赖Node安装环境,demo本地Node版本:14.19.1。
[*]运行工具:vscode或者其他工具。
[*]配置方式:下载demo源码,vscode打开,然后顺序执行以下命令:
(1)下载demo环境依赖包命令:npm i
(2)启动demo命令:npm run dev
(3)打包demo命令: npm run build:release
示例效果

在线地图分别是 OSM 地图、ArcGIS 地图、天地图、高德地图以及百度地图,由于加载百度地图比较特殊,它采用的投影坐标系方案定义跟其他在线地图不一致,需要自定义 L.Proj.CRS,所以,为了简单化测试,加载百度地图是在另一个地图页面来的。
效果图如下:
https://images.xiaozhuanlan.com/photo/2023/6bb29cddb084771194d6184b1fab4fc1.jpg
https://images.xiaozhuanlan.com/photo/2023/d506ad6726061c66afa314ec5af55755.jpg
https://images.xiaozhuanlan.com/photo/2023/d3106d7e9f4d5ca0865f823844b5a34c.jpg
https://images.xiaozhuanlan.com/photo/2023/28e9143e342166524e196ee86a950a0b.jpg
完整文章以及源码下载跳转到小专栏


免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: vue+leaflet示例:在线地图切换显示(附源码下载)