根據定位繪制駕車路線


百度地圖參考地址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>

注意!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系我们删除。



 
粤ICP备14056181号  © 2014-2020 ITdaan.com