leaflet 的基础使用

目录

一、创建dom节点

二、创建地图

三、添加底图（天地图），在地图创建完成后添加底图

本章主要讲述leaflet在vue中的使用：

leaflet 详情总目录：传送

一、创建dom节点

<div class="map" id="map_container"></div>

这里要注意，添加的节点必须设置宽高，否则不显示

二、创建地图

data() {
    return {
      map: null,//地图实例
      clickTimers: [],//存储区分点击地图双击和单击的定时器
      isShowUavBaseLayer: false, //是否显示卫星图层
      baseMapLayerGroup: null, //地图图层组
      tdtMapKey: '', //天地图key，需要到天地图申请
    }
  },
  methods: {
    initMap() {
      let that = this
      that.map = L.map('map_container', {
        crs: L.CRS.EPSG4326, //坐标系,在未知坐标系情况下，不要修改这里
        center: [29.4785541, 119.55847441], //地图中心
        maxNativeZoom: 16, //地图瓦片放大最大级别
        minNativeZoom: 5, //地图瓦片缩小最小级别