離線地圖開發(fā)（以百度地圖為例）

需求

需要在離線的情況下也能夠加載出地圖输硝，使用地圖的一些功能（需網(wǎng)絡(luò)進行云檢索的功能除外）

問題：

地圖圖片資源（瓦片圖）
地圖 api

開始

獲取 api js

利用密鑰去http://api.map.baidu.com/getscript?v=2.0&ak=你申請的密鑰&services=&t=20180917142401獲取下載拷貝到本地

命名為 BAIDU.API2.min.js (并用前端工具格式化美化一下代碼格式，方便修改)

去除ak驗證

在 BAIDU.API2.min.js 中定位到下列代碼位置,建議使用 Math.random() 多找?guī)状尉驼业搅?/li>

  function oa(a, b) {
    if (b) {
      var c = (1E5 * Math.random()).toFixed(0);
      z._rd["_cbk" + c] = function (a) {
        b && b(a);
        delete z._rd["_cbk" + c]
      };
      a += "&callback=BMap._rd._cbk" + c
    }
    var d = K("script", {
      type: "text/javascript"
    });
    d.charset = "utf-8";
    d.src = a;
    d.addEventListener ? d.addEventListener("load", function (a) {
      a = a.target;
      a.parentNode.removeChild(a)
    }, q) : d.attachEvent && d.attachEvent("onreadystatechange", function () {
      var a = window.event.srcElement;
      a && ("loaded" == a.readyState || "complete" == a.readyState) && a.parentNode.removeChild(a)
    });
    setTimeout(function () {
      document.getElementsByTagName("head")[0].appendChild(d);
      d = p
    }, 1)
  };

修改方法就是不進行外部訪問

/* 修改后 */
  function oa(a, b) {
    if (/^http/.test(a)) // 這里判斷一下，如果是調(diào)用外部資源就退出去好了
    return;
    if (b) {
      var c = (1E5 * Math.random()).toFixed(0);
      z._rd["_cbk" + c] = function (a) {
        b && b(a);
        delete z._rd["_cbk" + c]
      };
      a += "&callback=BMap._rd._cbk" + c
    }
    var d = K("script", {
      type: "text/javascript"
    });
    d.charset = "utf-8";
    d.src = a;
    d.addEventListener ? d.addEventListener("load", function (a) {
      a = a.target;
      a.parentNode.removeChild(a)
    }, q) : d.attachEvent && d.attachEvent("onreadystatechange", function () {
      var a = window.event.srcElement;
      a && ("loaded" == a.readyState || "complete" == a.readyState) && a.parentNode.removeChild(a)
    });
    setTimeout(function () {
      document.getElementsByTagName("head")[0].appendChild(d);
      d = p
    }, 1)
  };

設(shè)置引用本地工具資源

搜索'z.url.domain.main_domain_cdn.baidu[0]',找到使用它定義的字符串，置為空

z.xp = z.url.proto + z.url.domain.baidumap + "/";
  z.wc = z.url.proto + ("2" == z.Qy ? z.url.domain.main_domain_nocdn.other : z.url.domain.main_domain_nocdn.baidu) +
    "/";
  z.ma = z.url.proto + ("2" == z.Qy ? z.url.domain.main_domain_cdn.other[0] : z.url.domain.main_domain_cdn.baidu[0]) +
    "/";
  z.cj = z.url.proto + z.url.domain.main_domain_cdn.webmap[0] + "/";
  z.cj = "";  //置為空
  z.sg = function (a, b) {
    var c, d, b = b || "";
    switch (a) {
      case "main_domain_nocdn":
        c = z.wc + b;
        break;
    ...

創(chuàng)建本地工具資源文件
在 BAIDU.API2.js 中找到這個方法

注意
- 找到 "&mod=" 所在位置行,將其所表示的參數(shù) 替換為自定義的工具資源文件js (本文中 js文件為 "lib/js/getModules.js")
- 在 "lib/js"目錄下創(chuàng)建 getModules.js 作為 API主文件調(diào)用本地的工具資源文件

 load: function (a, b, c) {
      var d = this.ib(a);
      if (d.Bd == this.Fj.dq) c && b();
      else {
        if (d.Bd == this.Fj.pG) {
          this.lK(a);
          this.yN(a);
          var e = this;
          e.DC == q && (e.DC = o, setTimeout(function () {
            for (var a = [], b = 0, c = e.Pd.Gn.length;b < c;b++) {
              var d = e.Pd.Gn[b],
                l = "";
              ia.Ly.fK(d) ? l = ia.Ly.get(d) : (l = "", a.push(d + "_" + Rb[d]));
              e.Pd.Tv.push({
                SM: d,
                KE: l
              })
            }
            e.DC = q;
            e.Pd.Gn.length = 0;
            // 0 == a.length ? e.WK() : oa(e.iG.ZP + "&mod=" + a.join(",")) 注釋掉這行
            console.log(a);     //這里很重要讳嘱！幫助我們找到我們需要加載的模塊蛔外！
            0 == a.length ? e.WK() : oa('lib/js/getModules.js')
          }, 1));
          d.Bd = this.Fj.IP
        }
        d.Ru.push(b)
      }
    },

當a這個數(shù)組里面是需要請求的模塊秘通，getModules.js沒有的罪佳，打印出來，通過下面方式獲取虫几，并放到getModules.js
newvectordrawlib_hmclwu就是a打印出來的模塊名稱锤灿，通過這個鏈接獲取

http://api0.map.bdimg.com/getmodules?v=2.0&t=20140707&mod=newvectordrawlib_hmclwu

[demo下載地址]（https://pan.baidu.com/s/1pDUFmAzPCUFel1mc0F7AIQ）
密碼：anyp

最后編輯于：2018.09.28 18:10:54

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者