让百度地图全屏的js

最新推荐文章于 2023-10-07 14:53:06 发布

原创最新推荐文章于 2023-10-07 14:53:06 发布 · 1w 阅读

2 ·

CC 4.0 BY-SA版权

百度地图api 专栏收录该内容

3 篇文章

订阅专栏

本文通过一段JavaScript代码展示了如何使用百度地图API实现地图的加载、缩放控制及响应窗口大小变化等功能。该示例将地图置于网页的全屏显示，并设置初始地理位置为中心点。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<script type="text/javascript"> 
	function initialize() { 
		changeSize(); 
		var map = new BMap.Map('map'); 
		var point = new BMap.Point(116.404844, 39.923125); 
		map.centerAndZoom(point, 15); 
		map.addControl(new BMap.NavigationControl()); 
		map.enableScrollWheelZoom(true);// 允许鼠标滑轮放大缩小 }
		function loadScript() { 
			var script = document.createElement("script"); 
			script.src = "http://api.map.baidu.com/api?v=1.3&callback=initialize"; 
			document.body.appendChild(script); 
			}
		function changeSize() { 
			var showMap = document.getElementById("map"); 
			showMap.style.width = document.documentElement.clientWidth + "px"; 
			showMap.style.height = document.documentElement.clientHeight + "px"; 
			}
		window.onresize = changeSize; //改变大小的时候，div也占满全屏 
		window.onload = loadScript;
	</script>