基础演示案例一则：
因为此案例仅作为个人演示用，暂不公开百度开发者相关信息！敬请谅解。
效果图：
代码如下：
<!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Baidu Map V1.2 添加缩放控件和比例尺</title> <style type="text/css"> html{height:100%} body{height:100%;margin:0px;padding:0px} #container{height:100%} </style> <script type="text/javascript" src="http://api./api?v=2.0&ak=8c***fc***llm7mex***PI83L***R7vv"></script></head> <body><div id="container"></div><script type="text/javascript"> var map = new BMap.Map("container");// 创建地图实例 var point = new BMap.Point(117.282699092, 31.8669422607); // 创建点坐标 map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别 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}); //右上角，仅包含平移和缩放按钮/*缩放控件type有四种类型:BMAP_NAVIGATION_CONTROL_SMALL：仅包含平移和缩放按钮；BMAP_NAVIGATION_CONTROL_PAN:仅包含平移按钮；BMAP_NAVIGATION_CONTROL_ZOOM：仅包含缩放按钮*///添加缩放控件和比例尺map.addControl(top_left_control); map.addControl(top_left_navigation);map.addControl(top_right_navigation); </script> </body> </html>
注意：这里的ak=8c***fc***llm7mex***PI83L***R7vv是和开发者的信息绑定应用有关的代码！在百度地图后台申请设置即可。
以上就是关于 “ 百度地图demo基础组件演示 ” 的全部内容。
