深入学习ing

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);   //省份+城市

 

posted on 2017-03-15 14:03  深入学习ing  阅读(497)  评论(0编辑  收藏  举报

导航