很多文章讲离线使用本地普通地图瓦片的方法,是下面这样:
文件:bmap_offline_api_v2.0_min.js
注释内容并添加下面两行
Vc.getTilesUrl = function(a, b, c) {
var d = a.x;
a = a.y;
e = 1;
c = Uc[c];
/*this.map.dE() && (e = 2);
d = this.map.bb.xw(d, b).Fw;
return (Tc[Math.abs(d + a) % Tc.length] + "?qt=tile&x=" + (d + "").replace(/-/gi, "M") + "&y=" + (a + "").replace(/-/gi, "M") + "&z=" + b + "&styles=" + c + "&scaler=" + e + (6 == x.ea.la ? "&color_dep=32&colors=50" : "") + "&udt=20160730").replace(/-(\d+)/gi, "M$1")*/
tdir = bdmapcfg.tiles_dir.length>0?bdmapcfg.tiles_dir:bdmapcfg.home + "tiles";
return tdir + "/" + b + "/" + d + "/" + a + bdmapcfg.imgext; //使用本地的瓦片
文件:map_load.js
var bmapcfg = {
'home':'.',
'imgext': '.jpg', //瓦片图的后缀 ------ 根据需要修改,一般是 .png .jpg
'tiles_dir' : '', //普通瓦片图的地址,为空默认在 offlinemap/tiles/ 目录
'tiles_hybrid': '', //卫星瓦片图的地址,为空默认在 offlinemap/tiles_hybrid/ 目录
'tiles_self' : '' //自定义图层的地址,为空默认在 offlinemap/tiles_self/ 目录
};
那么在map.html中使用了
//添加地图类型控件
map.addControl(new BMap.MapTypeControl({
mapTypes: [
BMAP_NORMAL_MAP,//普通地图
BMAP_HYBRID_MAP,//混合路网
BMAP_SATELLITE_MAP//卫星地图
]
}));
后只能显示普通地图的瓦片却显示不了卫星地图和混合地图的瓦片,怎么办呢?网上怎么搜都搜不到解决方法,让人很头大。
在浏览器中打开控制台,根据鼠标滚动缩放后的找不到文件图片报错,定位到卫星图和混合图的url,类比普通地图的方法,进行下面的修改,成功将卫星图和混合图修改为离线瓦片。直接上代码。
文件:bmap_offline_api_v2.0_min.js
Xc.getTilesUrl = function(a, b) {
var c = a.x,
d = a.y;
//return (Sc[Math.abs(c + d) % Sc.length] + "u=x=" + c + ";y=" + d + ";z=" + b + ";v=009;type=sate&fm=46&udt=20141015").replace(/-(\d+)/gi, "M$1")
var tdir = bmapcfg.tiles_dir.length > 0 ? bmapcfg.tiles_dir : bmapcfg.home + "tiles_satellite";
return tdir + "/" + b + "/" + c + "/" + d + bmapcfg.imgext; // 使用本地的卫星瓦片
};
var Xa = new Rc("\u536b\u661f", Xc, {
tips: "\u663e\u793a\u536b\u661f\u5f71\u50cf",
minZoom: 1,
maxZoom: 19,
textColor: "white"
}),
Yc = new Ec({
transparentPng: o
});
Yc.getTilesUrl = function(a, b) {
var c = a.x,
d = a.y;
//return (Tc[Math.abs(c + d) % Tc.length] + "?qt=tile&x=" + (c + "").replace(/-/gi, "M") + "&y=" + (d + "").replace(/-/gi, "M") + "&z=" + b + "&styles=sl" + (6 == x.ea.la ? "&color_dep=32&colors=50" : "") + "&udt=20141015").replace(/-(\d+)/gi, "M$1")
var tdir = bmapcfg.tiles_dir.length > 0 ? bmapcfg.tiles_dir : bmapcfg.home + "tiles_hybrid";
return tdir + "/" + b + "/" + c + "/" + d + bmapcfg.imgext; // 使用本地的混合瓦片(路网等)
在文件中搜索getTilesUrl,找到第10次和第11次出现的位置,注释原有的return加上每个return下面两行。成功
普通地图瓦片路径:tiles文件夹
卫星地图瓦片路径:tiles_satellite文件夹
混合地图瓦片路径:tiles_hybrid文件夹