百度地图离线js+瓦片地图

最新推荐文章于 2024-05-08 23:55:34 发布

纸上得来终觉浅，绝知此事要躬行

最新推荐文章于 2024-05-08 23:55:34 发布

阅读量2.8k

点赞数 1

分类专栏： java

本文链接：https://blog.csdn.net/a294634473/article/details/102684758

版权

java 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

百度地图离线js+瓦片地图

前言
BMapDown
下载瓦片地图
使用

前言

网上有许多的文章都有教程但是缺少了瓦片地图下载这个最重要的东西。（这篇博客主要是分享一下如何下载瓦片地图）

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>

纸上得来终觉浅，绝知此事要躬行

关注

1
点赞
踩
7

收藏

觉得还不错? 一键收藏
1
评论
百度地图离线js+瓦片地图

百度地图离线js+瓦片地图前言BMapDown下载瓦片地图使用前言网上有许多的文章都有教程但是缺少了瓦片地图下载这个最重要的东西。（这篇博客主要是分享一下如何下载瓦片地图）BMapDown偶然搜索到BMapDown 这个工具可以在线下载瓦片地图。下载地址下载下来之后发现还直接有百度地图离线的js (bmap-offline文件夹),直接拉到项目中就可以用了。下载瓦片地图选好区域下载...
复制链接

扫一扫