leaflet-webpack 入门开发系列三地图分屏对比(附源码下载)
前言 leaflet-webpack 入门开发系列环境知识点了解: node 安装包下载 webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载地址 webpack 配置介绍文档 详细的 webpack 文档配置介绍,适合新手查看,我也是边看边学 vscode 安装包下载 ,我这边用 vscode工具编译开发前端项目,个人觉的这款工具还不错 leaflet api文档介绍 ,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件 ,leaflet 的插件库,非常有用 内容概览 leaflet 地图分屏对比 源代码 demo 下载 效果图 实现思路:创建左右并排的两个 div,各种渲染左右两个不同地图对象,然后同时监听左右两个地图的 drag 以及 mousemove 事件,在事件里面设置两个地图的当前范围一致 map. setView(_this.getCenter(),_this.getZoom()); html 地图界面 <html> <head> <title>Leaflet入门开发系列地图分屏</title> <style> html, body{ height: 100% ; margin: 0 ; padding: 0 ; } .left{ width: 50% ;