angularjs_百度地图API_根据经纬度定位_示例

时间:2023-03-09 18:31:35
angularjs_百度地图API_根据经纬度定位_示例

百度API--Demo地址:   http://lbsyun.baidu.com/jsdemo.htm#i8_4

本例是在angular.js使用的百度地图根据经纬度定位的API:(正常的页面写法基本一致,只是引用的时候有点不太一样而已)

A-页面:a.html

<!--活动地图-->
<div style="height: 400px" id="allmap"></div>

B-JS:a-controller.js

//加载js引用
function loadJScript() {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://api.map.baidu.com/api?v=2.0&ak=6934f6bf0a1fe131d75b956f9463831f&callback=init";
document.body.appendChild(script);
} //根据经纬度定位
function dw(){
// 百度地图API功能
//加载活动地图
var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(经度, 纬度), 20);
map.enableScrollWheelZoom(true);
// 用经纬度设置地图中心点
map.clearOverlays();
var new_point = new BMap.Point(经度, 纬度);
var marker = new BMap.Marker(new_point); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中
map.panTo(new_point);
}
loadJScript();
dw();

其他定位--根据详细地址定位

                    // 根据地质定位
// 百度地图API功能
var map = new BMap.Map("allmap");
var point = new BMap.Point(116.331398, 39.897445); //默认定位
map.centerAndZoom(point, 12);
// 创建地址解析器实例
var myGeo = new BMap.Geocoder();
// 将地址解析结果显示在地图上,并调整地图视野
myGeo.getPoint(project.Detail, function (point) { //project.Detail 详细地质
if (point) {
map.centerAndZoom(point, 16);
map.addOverlay(new BMap.Marker(point));
} else {
alert("您选择地址没有解析到结果!");
}
}, project.Province + project.City); //省份+城市