百度地图的使用

申请AK

• 创建应用
  • 项目名称：xxx
  • 应用类型： 浏览器端
  • 白名单： *（测试环境）

引入脚本

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

创建实例及定位

var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);

var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
	if(this.getStatus() == BMAP_STATUS_SUCCESS){
		var mk = new BMap.Marker(r.point);
		map.addOverlay(mk);
		map.panTo(r.point);
		alert('您的位置：'+r.point.lng+','+r.point.lat);
	}
	else {
		alert('failed'+this.getStatus());
	}        
});

获取位置详细信息

可以通过谷歌浏览器More tools中的Sensors模拟改变位置调试

    var map = new BMap.Map("allmap");
    var point = new BMap.Point(116.331398, 39.897445);
    map.centerAndZoom(point, 12);

    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(
      function(r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
          var myGeo = new BMap.Geocoder();

          myGeo.getLocation(new BMap.Point(r.point.lng, r.point.lat), function(rs) {
            var lbs_point = "";
            var address = "";
            if (rs.surroundingPois.length > 0) {
              lbs_point =
                rs.surroundingPois[0].point.lng +"," + rs.surroundingPois[0].point.lat;
              address = rs.surroundingPois[0].title;
            } else {
              lbs_point = rs.point.lng + "," + rs.point.lat;
              address = rs.address;
            }
            alert(JSON.stringify(rs, null, 4));
          });
        }
      },
      {
        enableHighAccuracy: true
      }
    );

标注折线

    var polyline = new BMap.Polyline(
      [new BMap.Point(116.399, 39.91), new BMap.Point(116.405, 39.92)],
      { strokeColor: "blue", strokeWeight: 6, strokeOpacity: 0.5 }
    );
    map.addOverlay(polyline);