一、百度地图二次开发初始化百度地图

最新推荐文章于 2024-06-15 11:14:55 发布

悠然～.～

最新推荐文章于 2024-06-15 11:14:55 发布

阅读量4.9k

点赞数 1

分类专栏：前端-百度地图文章标签：百度地图

本文链接：https://blog.csdn.net/lze693/article/details/54234946

版权

前端-百度地图专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1.添加引用百度js路径

2.设置css样式

3.添加div

4.编写js

源码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>百度地图初始化</title>
		<style type="text/css">
        #container{width:50%;height:500px;}
    </style>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
	</head>
	<body>
		<div id="container"></div>
		<script type="text/javascript">
    //百度地图API功能    
    var map = new BMap.Map("container");
    map.centerAndZoom(new BMap.Point(116.331398,39.897445),10);
</script>
	</body>
</html>

效果图：

相关解释：

var map = new BMap.Map("container", {mapType: BMAP_HYBRID_MAP});//初始化百度地图 container为div中id名 mapType为默认加载时的地图模式 BMAP_HYBRID_MAP为卫星和路网混合式视图，BMAP_NORMAL_MAP为普通街道视图，BMAP_SATELLITE_MAP为卫星视图。地图类型也可不加默认普通街道视图。

map.centerAndZoom(new BMap.Point(116.331398,39.897445),10);//设置地图中心和初始话缩放等级缩放等级为范围3-19级，也可设置成城市缩放等级可以不添加如：map.centerAndZoom("北京");也可map.centerAndZoom("北京",10);