js+百度地图API

js与百度地图API实例：

<div id='address'></div>
<script src="http://api.map.baidu.com/api?v=2.0&ak=boS5H3cIm4bD53h37GlKfhpKKBCpmjwl"></script>


var map = new BMap.Map('address');//核心类Map，实例化一个地图。

var point = new BMap.Point(114.131416, 22.573554);//基础类Point,初始化点的经纬度

map.centerAndZoom(point, 20); //核心类Map的方法，在实例化地图中，点位的缩放（3~19）
map.addControl(new BMap.NavigationControl()); //控件类NavigationControl，平移缩放，添加到实例化的地图上
map.addControl(new BMap.ScaleControl()); //控件类ScaleControl，比例尺，添加到实例化的地图上
map.addControl(new BMap.MapTypeControl());//控件类MapTypeControl，地图类型，添加到实例化的地图上

var marker = new BMap.Marker(point);//覆盖物类Marker，图像标注

map.addOverlay(marker);//核心类Map的方法，覆盖物添加到实例化地图中

var opts = {    
	width : 220,     // 信息窗口宽度    
	height: 80,     // 信息窗口高度    
	title : "<p style='font-size: 1.5rem; margin-bottom: 0.1rem;'>宝琳国金珠宝交易中心</p>",  // 信息窗口标题  
	content: "<p style='margin: 0;padding: 0;'>地址：深圳市罗湖区田贝四路宝林国金一期一楼</p><p style='margin: 0;padding: 0;'>电话：0755-22928136</p>" 
}    
var infoWindow = new BMap.InfoWindow(opts.content, opts); //覆盖物类InfoWindow，信息的窗口
map.openInfoWindow(infoWindow, point); //核心类Map的方法，在点位上，打开信息窗口
map.enableScrollWheelZoom(true); //核心类Map的方法，滚轮放大缩小
猜你喜欢
