根据定位绘制驾车路线

版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/lengxin337/article/details/80004342

百度地图参考地址http://lbsyun.baidu.com/index.php?title=jspopular/guide/routeplan

<script>

var map = new BMap.Map("allmap");//创建地图实例
map.addControl(new BMap.NavigationControl());    
map.addControl(new BMap.ScaleControl());    
map.addControl(new BMap.OverviewMapControl());      
var centerPoint;
//页面初始化
$(function() {
  //初始化地图 默认加载北京天安门
  var point = new BMap.Point(116.331398,39.897445);
  map.centerAndZoom(point,16);//初始化地图,point为中心点,缩放级别为16
  //判断手机浏览器是否支持定位
  
  var longitude={$info['longitude']};
  var latitude={$info['dimension']};
  if(longitude && latitude){
  var centerPoint = new BMap.Point(longitude,latitude);
map.panTo(centerPoint);
    map.setCenter(centerPoint);
    var icon = new BMap.Icon('__PUBLIC__/assets/images/position_shop.png', new BMap.Size(20, 32), {  
    anchor: new BMap.Size(10, 30)  
    });
    var mk = new BMap.Marker(centerPoint,{icon:icon});


    var label = new BMap.Label("{$info['cust_name']}", {
    offset: new BMap.Size(15, -25)
    });
    label.setStyle({
   
    color: '#fff',
    background: '#ff8355',
    border: '1px solid "#ff8355"',
    borderRadius: "5px",
    textAlign: "center",
    height: "26px",
    padding: "5px",
    });
    mk.setLabel(label);
    //mk.disableDragging();// 不可拖拽
    map.addOverlay(mk); 
  }
});


function navigation(){

if(navigator.geolocation){
        var geolocation = new BMap.Geolocation();//创建定位实例
        geolocation.getCurrentPosition(showLocation,{enableHighAccuracy: true});//enableHighAccuracy 要求浏览器获取最佳结果
    }else{
        map.addControl(new BMap.GeolocationControl());//添加定位控件 支持定位
    }


}




//处理定位后的信息
function showLocation(r){

if(this.getStatus() == BMAP_STATUS_SUCCESS){

var myP1= new BMap.Point(r.longitude,r.latitude);

var myP2=new BMap.Point({$info['longitude']},{$info['dimension']});

        var driving = new BMap.DrivingRoute(map); 
        driving.search(myP1,myP2);
        driving.setSearchCompleteCallback(function(){
       
        map.clearOverlays();
        var pts = driving.getResults().getPlan(0).getRoute(0).getPath();
        var polyline = new BMap.Polyline(pts);
        map.addOverlay(polyline); 
        var icon1 = new BMap.Icon('__PUBLIC__/assets/images/gps_qidian.png', new BMap.Size(80, 92), {  
            anchor: new BMap.Size(10, 30)  
            });
        var icon2 = new BMap.Icon('__PUBLIC__/assets/images/gps_zhongdian.png', new BMap.Size(80, 92), {  
            anchor: new BMap.Size(10, 30)  
            });
        var m1 = new BMap.Marker(myP1,{icon:icon1});
        var m2 = new BMap.Marker(myP2,{icon:icon2});
        map.addOverlay(m1);       
        map.addOverlay(m2);
       
        var lab1 = new BMap.Label("起点",{position:myP1});        //创建3个label        
        var lab2 = new BMap.Label("终点",{position:myP2});
       
        map.addOverlay(lab1);
        map.addOverlay(lab2);                        
        setTimeout(function(){         
        map.setViewport([myP1,myP2]);          //调整到最佳视野       
        },1000);
        })
}  



</script>
展开阅读全文

没有更多推荐了,返回首页