前言
网上有许多的文章都有教程但是缺少了瓦片地图下载这个最重要的东西。(这篇博客主要是分享一下如何下载瓦片地图)
BMapDown
偶然搜索到BMapDown 这个工具可以在线下载瓦片地图。
下载地址(非常谢谢开发者)
下载下来之后发现还直接有百度地图离线的js (bmap-offline文件夹),直接拉到项目中就可以用了。
下载瓦片地图
选好区域下载地图之后放到 bmap-offline/tiles目录下就行了
注意下载的时候最好缩放级数都下载 不然不能缩放。
使用
<body>
<div id="map"</div>
</body>
<script type="text/javascript">
$(function () {
mounted();
});
function mounted() {
// 百度地图
var map = new BMap.Map("map");
//由于是离线地图只能用坐标来定位
var point = new BMap.Point(119.7322,30.2383);
//19代表瓦片的缩放级数
map.centerAndZoom(point, 19);
map.addControl(new BMap.MapTypeControl());
//设置定位点的弹跳动画
var marker = new BMap.Marker(point); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中
marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
map.enableScrollWheelZoom(true);
//添加工具条比例尺控件
var top_left_control = new BMap.ScaleControl({
anchor: BMAP_ANCHOR_TOP_LEFT
}); // 左上角,添加比例尺
var top_left_navigation = new BMap.NavigationControl(); //左上角,添加默认缩放平移控件
var top_right_navigation = new BMap.NavigationControl({
anchor: BMAP_ANCHOR_TOP_RIGHT,
type: BMAP_NAVIGATION_CONTROL_SMALL
}); //右上角,仅包含平移和缩放按钮
map.addControl(top_left_control);
map.addControl(top_left_navigation);
map.addControl(top_right_navigation);
};
</script>
————————————————
版权声明:本文为CSDN博主「纸上得来终觉浅,绝知此事要躬行」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/a294634473/article/details/102684758