高德地图离线版 使用高德地图api的方法

高德离线包我已经存至Gitee（自行下载即可）：高德地图离线解决方案: 高德地图离线解决方案

然因为高德地图的瓦片地图太大，所以要让后端部署下 前端直接调用 如果本地 直接找到瓦片图路径就可以

  initMap () {
      const base_url = "/"
      const layers = [new AMap.TileLayer({
        getTileUrl: function (x, y, z) {
          // return `${base_url}imgMap/${z}/${x}/${y}.png`
          return `http://192.168.0.105:29001/images/imgMap/${z}/${x}/${y}.png`
        },
        opacity: 1,
        zIndex: 99,
      })]
      this.map = new AMap.Map('container', { // 设置地图容器id
        resizeEnable: true,
        zoom: 15,
        zooms: [15, 20], //设置缩放级别范围 3-20 级
        // 前面是缩小 后面是放大
        resizeEnable: true,
        rotateEnable: true,
        pitchEnable: true,
        center: [114.057201, 22.538136],
        defaultCursor: 'pointer',
        showLabel: true,  //是否显示文字标注
        layers: layers,
        Plugins:["AMap.PolygonEditor"]
      })
 
    },

然后使用他的离线方法

  ceju () {
      this.ruler1 = new AMap.MouseTool(this.map)
      this.ruler1.rule({
        startMarkerOptions: {//可缺省
          icon: new AMap.Icon({
            size: new AMap.Size(19, 31),//图标大小
            imageSize: new AMap.Size(19, 31),
            image: "//webapi.amap.com/theme/v1.3/markers/b/start.png"
          }),
          offset: new AMap.Pixel(-9, -31)
        },
        endMarkerOptions: {//可缺省
          icon: new AMap.Icon({
            size: new AMap.Size(19, 31),//图标大小
            imageSize: new AMap.Size(19, 31),
            image: "//webapi.amap.com/theme/v1.3/markers/b/end.png"
          }),
          offset: new AMap.Pixel(-9, -31)
        },
        midMarkerOptions: {//可缺省
          icon: new AMap.Icon({
            size: new AMap.Size(19, 31),//图标大小
            imageSize: new AMap.Size(19, 31),
            image: "//webapi.amap.com/theme/v1.3/markers/b/mid.png"
          }),
          offset: new AMap.Pixel(-9, -31)
        },
        lineOptions: {//可缺省
          strokeStyle: "solid",
          strokeColor: "#FF33FF",
          strokeOpacity: 1,
          strokeWeight: 2
        }
      })
    },

这个时候会报错 因为没有这个方法

解决方法

这个代码把你想用的方法名保存到本地

找到对应的名字 复制

然后就可以正常使用这个方法拉