百度离线地图研发 laravel框架

1. JS--API下载
   1. 访问地址：http://api.map.baidu.com/api?v=3.0（有百度API密钥的可以加上密钥：http://api.map.baidu.com/api?v=3.0&ak=密钥），选择如图并访问
   2. 
   3. 访问：http://api.map.baidu.com/getscript?v=3.0&ak=&services=&t=20200109192240获得如图，复制保存下来
   4. 
   5. 保存文件名自定义：bmap_offline_api_v3.0_min.js
   6. 
   7. 最后在使用地方引入js
   8. 
2. 修改API文件
   1. 屏蔽ak验证
      1. 在bmap_offline_api_v3.0_min.js文件中查找Math.random()代码，多查找几次具体命名可能会有所不同，并且新增代码如下，结果如下

      2.         //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
                 if (/^http/.test(a)) return;//修改  屏蔽ak验证，若调用外部资源直接返回
                 //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

      3. 
   2. 设置引入本地资源路径
      1. 在bmap_offline_api_v3.0_min.js文件中查找url.domain.main_domain_nocdn.baidu或者main_domain_nocdn代码，多查找几次具体命名可能会有所不同，并且新增代码如下，结果如下
      2. 

      3. D.oa = bmapcfg.home这个等配置mp_load.js后配置，在下步

3. 下载本地资源
   1. 所谓本地资源，就是在使用地图时需要用到的一些模块（module），比如图层类，标记类，控件类。
   2. 首先，在 bmap_offline_api_min.js 文件中，用 &mod= 定位到下面的代码，然后加一行代码将用到的模块打印出来：
   3. 
   4. 在html页面中编写加载百度地图API
   5. 
   6. 访问，在控制台上获取打印结果，为功能需要的模板名
   7. 
   8. 访问网址：http://api0.map.bdimg.com/getmodules?v=3.0&t=20140707&mod=模板名，比如http://api0.map.bdimg.com/getmodules?v=3.0&t=20140707&mod=common_yus52z，获得js资源拷贝到/modules/模板名.js，如图：
   9. 
4. 引用本地资源
   1. 在上面步骤打印模块名的地方，做如下修改：
   2. 
   3. 要注意路径问题，如果不对会报错
5. 加载瓦片资源（资源自行百度下载）
   1. 下载/购买链接（咸鱼）：https://market.m.taobao.com/app/idleFish-F2e/widle-taobao-rax/page-detail?wh_weex=true&wx_navbar_transparent=true&id=656896500898&ut_sk=1.YVA54qNv6UUDAGRWhXjEUw1%2B_12431167_1636447486922.Copy.detail.656896500898.2903781529&forceFlush=1https://market.m.taobao.com/app/idleFish-F2e/widle-taobao-rax/page-detail?wh_weex=true&wx_navbar_transparent=true&id=656896500898&ut_sk=1.YVA54qNv6UUDAGRWhXjEUw1%2B_12431167_1636447486922.Copy.detail.656896500898.2903781529&forceFlush=1
   2. 配置位置
   3. 
   4. 瓦片配置文件
      1. 

   5. var bmapcfg = {
          'imgext': '.jpg',   //瓦片图的后缀  根据需要修改，一般是 .png .jpg
          'tiles_dir': '/baiduOffline/tiles'       //普通瓦片图的地址，为空默认在tiles/ 目录
      };
      var scripts = document.getElementsByTagName("script");
      var JS__FILE__ = scripts[scripts.length - 1].getAttribute("src");  //获得当前js文件路径
      bmapcfg.home = JS__FILE__.substr(0, JS__FILE__.lastIndexOf("/js") + 1); //地图API主目录
      

   6. 在html中引入该配置文件

   7. 

   8. 修改瓦片路径：在bmap_offline_api_v3.0_min.js文件中查找getTilesUrl 代码，多查找几次具体命名可能会有所不同，并且修改代码如下，结果如下

   9. 

   10.     Hd.getTilesUrl = function (a, b, c) {
               var e = a.x, a = a.y, f = Sb("normal"), g = 1, c = Gd[c];
               // this.map.ax() && (g = 2);
               // e = this.map.Xe.Xv(e, b).Sl;
               // return (Fd[Math.abs(e + a) % Fd.length] + "?qt=vtile&x=" + (e + "").replace(/-/gi, "M") + "&y=" + (a + "").replace(/-/gi, "M") + "&z=" + b + "&styles=" + c + "&scaler=" + g + (6 == z.fa.ma ? "&color_dep=32&colors=50" : "") + "&udt=" + f).replace(/-(\d+)/gi, "M$1")
               //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
               let tdir = bmapcfg.tiles_dir.length > 0 ? bmapcfg.tiles_dir : bmapcfg.home + "tiles";
               // console.log(tdir + "/" + b + "/" + e + "/" + a + bmapcfg.imgext)
               return tdir + "/" + b + "/" + e + "/" + a + bmapcfg.imgext; // 使用本地的瓦片
               //!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
           };

6. 刷新页面出现及成功