百度离线地图的制作

  在不能连接外网的web项目中要使用地图功能,因为不能使用在线地图,所以只能自己制作离线地图,这里使用的是百度地图。

 1、离线js文件准备

  通过http://api.map.baidu.com/api?v=2.0获得百度api文件

  

 

   通过以上可以看到api地址    http://api.map.baidu.com/getscript?v=2.0&ak=&services=&t=20180323171755

  打开api地址,可以看到,将文件保存到本地,这里命名为apiv2.0.js

2、修改保存下来的apiv2.0.js

搜索Math.random找到如下代码

function pa(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 pa(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.url = z.V_[z.Py];
    z.vp = z.url.proto + z.url.domain.baidumap + "/";
    z.wc = z.url.proto + ("2" == z.Py ? z.url.domain.main_domain_nocdn.other: z.url.domain.main_domain_nocdn.baidu) + "/";
    //z.ma = z.url.proto + ("2" == z.Py ? z.url.domain.main_domain_cdn.other[0] : z.url.domain.main_domain_cdn.baidu[0]) + "/";
    z.ma=""; //这里置为空

 4、创建本地引用文件
创建文件getmodules2.0.js用来放模块文件,在apiv2.0.js文件,搜素&mod=,

load: function(a, b, c) {
            var d = this.ib(a);
            if (d.Bd == this.Fj.bq) c && b();
            else {
                if (d.Bd == this.Fj.oG) {
                    this.kK(a);
                    this.xN(a);
                    var e = this;
                    e.CC == q && (e.CC = o, setTimeout(function() {
                        for (var a = [], b = 0, c = e.Pd.Fn.length; b < c; b++) {
                            var d = e.Pd.Fn[b],
                            l = "";
                            ja.Ky.eK(d) ? l = ja.Ky.get(d) : (l = "", a.push(d + "_" + Sb[d]));
                            e.Pd.Sv.push({
                                RM: d,
                                JE: l
                            })
                        }
                        e.CC = q;
                        e.Pd.Fn.length = 0;
                       // 0 == a.length ? e.VK() : pa(e.hG.YP + "&mod=" + a.join(","))
                    console.log(a);     //这里打印出来的是你需要的模块
                    0 == a.length ? e.UK() : Qb("js/getmodules2.0.js") //这里引入的是自建的引入模块文文件
                    },
                    1));
                    d.Bd = this.Fj.HP
                }
                d.Qu.push(b)
            }
        },

 5、获取打印出的模块api

在上述更改中console.log(a) 打印出的是需要的模块,

 

获取需要的模块api的方式

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

根据需要改变上述连接中&mod=后面的内容,替换成需要的模块,打开,复制保存到新建的getmodules2.0.js即可,

需要什么模块,获得模块后添加到getmodules2.0.js即可

6、调用本地地图瓦片

//地图js 调用本地地图
     var outputPath = 'tiles/';    //地图瓦片所在的文件夹
       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 })

 

以上完全参考https://blog.csdn.net/a312024054/article/details/70213444,仅作个人总结使用

 

posted on 2018-03-30 15:54  会数数的小数点  阅读(712)  评论(0编辑  收藏  举报