web端加载百度地图和天地图

pmsyn

已于 2022-07-20 17:08:27 修改

阅读量1k

点赞数 1

分类专栏： Gis 文章标签：前端百度地图天地图 web

于 2022-06-01 09:30:10 首次发布

本文链接：https://blog.csdn.net/rookiepm/article/details/125077645

版权

Gis 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

1.加载百度地图

在页面中引入js文件

<html>
<head>
<script type="text/javascript" src="http://api.map.baidu.com/api?key=&v=1.4&services=true"></script>
</head>
<body>
<div>
	<div id = "map"></div>
</div>
</body>
</html>

初始化地图


<script type="text/javascript">
	var map = new BMap.Map("map");//在百度地图容器中创建一个地图
	map.centerAndZoom('乐陵市', 12); // 初始化地图,设置中心点坐标和地图级别
	map.enableScrollWheelZoom(true); // 开启鼠标滚轮缩放
</script>

2.加载天地图

引入js文件
tk需要自己注册申请，具体申请流程详见天地图官网

<html>
<head>
<script src="http://api.tianditu.gov.cn/api?v=4.0&tk=tk" type="text/javascript"></script>
</head>
<body>
<div>
	<div id = "map"></div>
</div>
</body>
</html>

初始化地图


<script type="text/javascript">
	var map = new T.Map('map');
	var LngLat = new T.LngLat(117.225601,37.729007),
	zoom = 10;
    map.centerAndZoom(LngLat , zoom);
</script>