百度地图定位

最新推荐文章于 2022-11-23 14:32:13 发布

雪莲的博客

最新推荐文章于 2022-11-23 14:32:13 发布

阅读量655

点赞数

分类专栏：地图/定位

本文链接：https://blog.csdn.net/ZHIYUANfL/article/details/54666663

版权

4 篇文章 0 订阅

订阅专栏

  <!--引用百度地图API--> 

  <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=mHmcg0aZwTMRO8PlLgAPdszC"></script> 

  <script> 

  jQuery(document).ready( 
 function ($) { 

  //创建和初始化地图函数： 

 
 function initMap() { 

  createMap();//创建地图 

  setMapEvent();//设置地图事件 

  addMapControl();//向地图添加控件 

  addMapOverlay();//向地图添加覆盖物 

}

 
 function createMap() { 

  map = 
  new BMap.Map("map"); 

  map.centerAndZoom( 
 new BMap.Point(116.362167, 39.994641), 17); 

}

 
 function setMapEvent() { 

  map.enableScrollWheelZoom(); 

  map.enableKeyboard(); 

  map.enableDragging(); 

  map.enableDoubleClickZoom() 

}

 
 function addClickHandler(target, window) { 

  target.addEventListener("click", 
 function () { 

  target.openInfoWindow(window); 

});

}

 
 function addMapOverlay() { 

 
 var markers = [ 

  {content: "北京市海淀区学院路30号天工大厦A座409", title: "北京甜园科技有限公司", imageOffset: {width: 0, height: 3}, position: {lat: 39.993937, lng: 116.361736}} 

];

 
 for ( 
 var index = 0; index < markers.length; index++) { 

 
 var point = 
 new BMap.Point(markers[index].position.lng, markers[index].position.lat); 

 
 var marker = 
 new BMap.Marker(point, { 

  icon: 
  new BMap.Icon("http://api.map.baidu.com/lbsapi/createmap/images/icon.png", 
 new BMap.Size(20, 25), { 

  imageOffset: 
  new BMap.Size(markers[index].imageOffset.width, markers[index].imageOffset.height) 

})

});

 
 var label = 
 new BMap.Label(markers[index].title, {offset: 
 new BMap.Size(25, 5)}); 

 
 var opts = { 

  width: 200, 

  title: markers[index].title, 

  enableMessage: 
 false 

};

 
 var infoWindow = 
 new BMap.InfoWindow(markers[index].content, opts); 

  marker.setLabel(label); 

  addClickHandler(marker, infoWindow); 

  map.addOverlay(marker); 

}

;

}

  //向地图添加控件 

 
 function addMapControl() { 

 
 var scaleControl = 
 new BMap.ScaleControl({anchor: BMAP_ANCHOR_BOTTOM_LEFT}); 

  scaleControl.setUnit(BMAP_UNIT_IMPERIAL); 

  map.addControl(scaleControl); 

 
 var navControl = 
 new BMap.NavigationControl({anchor: BMAP_ANCHOR_TOP_LEFT, type: BMAP_NAVIGATION_CONTROL_LARGE}); 

  map.addControl(navControl); 

}

 
 var map; 

  initMap(); 

})

  </script> 