高德地圖軌跡繪製

 http://blog.csdn.net/wocaonima332/article/details/51769738 座標轉換

 

http://lbs.amap.com/api/webservice/guide/api/direction/ 高德路徑規劃,設置途徑點(駕車)javascript

 

http://blog.csdn.net/u010367582/article/details/50484428 百度地圖設置途徑點html

 http://www.cnblogs.com/milkmap/p/3755257.html

 

http://blog.csdn.net/justdoit_potato/article/details/73189164java

 

<script type="text/javascript">
    
        //這裏能夠傳入後臺的json數據,相似此格式
        var pointList=[
          {
          
        lng:116.397428,
          lat:39.90923
          
          },

        {
         
          lng:116.397428,
          lat:39.90923
          
         

          
          },
        
        {
         
          lng:116.397428,
          lat:39.90923

          
          },
            {
         
          lng:116.397428,
          lat:39.90923

          
          }
        
      
      ];
        

        var a_mark;    //圖標點
        var marker;  
        var lineArr;
        map = new AMap.Map("map_container", {
          resizeEnable: true,
        center: [116.397428, 39.90923],
        zoom: 14
        });
        map.plugin(["AMap.ToolBar"],function(){
            //加載工具條
            var tool = new AMap.ToolBar();
            map.addControl(tool);   
            });
        
        //地圖圖塊加載完畢後執行函數  
 function completeEventHandler(x,y){ 
    
    marker3 = new AMap.Marker({  
        map:map,  
        //draggable:true, //是否可拖動  
        position:new AMap.LngLat(x,y),//基點位置  
        icon:"http://code.mapabc.com/images/car_03.png", //marker圖標,直接傳遞地址url  
        offset:new AMap.Pixel(-26,-13), //相對於基點的位置  
        autoRotation:true  
    });        
    var lngX ;  
    var latY ;         
    lineArr = new Array();   

     for(var i = 1;i<pointList.length;i++){
        lngX = pointList[i].lng;
        latY = pointList[i].lat;
        lineArr.push(new AMap.LngLat(lngX,latY));
     }
 
    //繪製軌跡  
    var polyline = new AMap.Polyline({  
        map:map,  
        path:lineArr,  
        strokeColor:"#00A",//線顏色  
        strokeOpacity:1,//線透明度  
        strokeWeight:3,//線寬  
        strokeStyle:"solid",//線樣式  
    });  
}  
function startRun(){  //開始繪製軌跡
    x=pointList[0].lng;
    y=pointList[0].lat
    completeEventHandler(x,y);
    marker.moveAlong(lineArr,80);     //開始軌跡回放
}
function init(){
         
       /*    $.ajax({
                type: "post",
                 url: _gPath+"你的數據.json",

                success: function(resp){
                    
                    $.each(resp, function(i,n){
                     
                        pointList = resp.data;

                  });
                }
        }); */
          
           startRun();   
      }      
      $(document).ready(function(){
       init();
      
      }); 

    </script>
web

相關文章
相關標籤/搜索