百度地图2.0离线版的制作

DEMO下载：http://download.csdn.net/detail/a312024054/9860770

感谢前辈共享出来，不过时间有点长了，有些细节有些变动，修改了一下

转载 : https://my.oschina.net/smzd/blog/548538

1. 下载API主文件

通过http://api.map.baidu.com/api?v=2.0获取API主文件的链接

获取API主文件http://api.map.baidu.com/getscript?v=2.0&ak=&services=&t=20170411141812

使用前端工具http://tool.chinaz.com/tools/jsformat.aspx 进行格式化，方便修改

把API的主文件命名为:apiv2.0.min.js

2. 去除ak验证

在apiv2.0.min.js中定位到下列代码位置，建议使用Math.random()多找几次就找到了

function Qb(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 = M("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 Qb(a, b) {
    if (/^http/.test(a))//这里判断一下，如果是调用外部资源就退出去好了
        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 = M("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)
};

3. 设置引用本地工具资源

搜索“z.url.domain.main_domain_cdn.baidu[0]”，找到使用他定义的字符串，置为空

z.op = z.url.proto + z.url.domain.baidumap + "/";
z.Ec = z.url.proto + ("2" == z.My ? z.url.domain.main_domain_nocdn.other: z.url.domain.main_domain_nocdn.baidu) + "/";
z.la = z.url.proto + ("2" == z.My ? 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) {
...

4. 创建本地工具资源文件

创建一个文件getmodules2.0.js，在这里面放API需要调用的模块,我这里是放在js文件夹下面了

设置API主文件调用本地的工具资源文件，通过"&mod="定位

load: function(a, b, c) {
    var d = this.ib(a);
    if (d.Ad == this.Ej.Xp) c && b();
    else {
        if (d.Ad == this.Ej.nG) {
            this.jK(a);
            this.xN(a);
            var e = this;
            e.AC == q && (e.AC = o, setTimeout(function() {
                for (var a = [], b = 0, c = e.Od.Bn.length; b < c; b++) {
                    var d = e.Od.Bn[b],
                    l = "";
                    ja.Gy.dK(d) ? l = ja.Gy.get(d) : (l = "", a.push(d + "_" + Rb[d]));
                    e.Od.Ov.push({
                        QM: d,
                        HE: l
                    })
                }
                e.AC = q;
                e.Od.Bn.length = 0;
                //0 == a.length ? e.UK() : Qb(e.gG.XP + "&mod=" + a.join(","))

                console.log(a);     //这里很重要！帮助我们找到我们需要加载的模块！
                    0 == a.length ? e.UK() : Qb("js/getmodules2.0.js")
            },
            1));
            d.Ad = this.Ej.GP
        }
        d.Nu.push(b)
    }

当a这个数组里面是需要请求的模块，getmodules2.0.js没有的，打印出来，通过下面方式获取，并放到getmodules2.0.js
newvectordrawlib_hmclwu就是a打印出来的模块名称，通过这个链接获取

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

到这里就可以跑起来了

<!DOCTYPE html>  
<html>  
    <head>  
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
        <title>Hello, World</title>  
        <style type="text/css">  
        html{height:100%}  
        body{height:100%;margin:0px;padding:0px}  
        #container{height:100%}  
        </style>  
        <script type="text/javascript" src="js/apiv2.0.min.js">
        </script>
    </head>  

    <body>  
        <div id="container"></div> 
        <script type="text/javascript"> 
            var map = new BMap.Map("container");          // 创建地图实例  
            var point = new BMap.Point(116.404, 39.915);  // 创建点坐标  
            map.centerAndZoom(point, 15);                 // 初始化地图，设置中心点坐标和地图级别  
        </script>  
    </body>  
</html>

5. 设置调用本地地图

<body>  
<div id="container"></div> 
<script type="text/javascript"> 

    var outputPath = 'maptile/';    //地图瓦片所在的文件夹
    var fromat = ".png";    //格式

    var tileLayer = new BMap.TileLayer();
    tileLayer.getTilesUrl = function (tileCoord, zoom) {
        var x = tileCoord.x;
        var y = tileCoord.y;
        var url = outputPath + zoom + '/' + x + '/' + y + fromat;
        return url;
    }
    var tileMapType = new BMap.MapType('tileMapType', tileLayer);

    var map = new BMap.Map("container", { mapType: tileMapType })

    var point = new BMap.Point(116.404, 39.915);  // 创建点坐标  
    map.centerAndZoom(point, 6);                 // 初始化地图，设置中心点坐标和地图级别  
</script>  
</body>  

6. 在IE中使用,需要额外添加模块

例如添加一个可以放大缩小的控件

 map.addControl(new BMap.NavigationControl({
        anchor: BMAP_ANCHOR_TOP_RIGHT,  // 靠左上角位置
        type: BMAP_NAVIGATION_CONTROL_LARGE, // LARGE类型
    }));

把下面的内容拷贝到getmodules2.0.js中就好了

需要注意的是模块名称下划线后面的好像是随机生成的，
所以是要前面的map已经包含了，并且功能能够使用，就不需要在加了

7. 地图瓦片资源

可以使用 太乐地图下载器 下载瓦片，这个下载器可以下到百度地图的瓦片，新测可用

8. 杂记

//主动触发marker的click事件
marker.dispatchEvent("click");