js高德地图绘制路线并轨迹纠偏

引入下面三个js文件

<script src="http://webapi.amap.com/maps?v=1.4.6&key=你所申请的key值"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<script anguage="javascript" src="https://webapi.amap.com/maps?key=你所申请的key值"&v=1.4.7&plugin=AMap.GraspRoad"></script>



js:

//地图操作

var marker, map = new AMap.Map("container", {
    resizeEnable: true,
});


//起终点坐标
var statrLon="";
var statrLat="";
var endLon="";
var endLat="";

//需要绘制的点坐标数组

var pathParam=[];

 $.ajax({
                url: JM.apiSite + "/admin/networkCar/getOrderRunTrack.json",
                crossDomain: true,
                async: true,
                type: "post",
                data: {
                    "access_token": accessToken,
                    "orderId": result.id
                },
                success: function(json) {
                    $(".gdMap").show();
                    console.log(json);
                    var e=json.info;
                    for(var i=0;i<e.length;i++){
                        var arrObj={};
                        //保存开始和结束时经纬度
                        if(i==0){
                            statrLat=e[i].lat;
                            statrLon=e[i].lon;
                            arrObj.tm=1478031031;
                        }else if(i==e.length-1){
                            endLat=e[i].lat;
                            endLon=e[i].lon;
                            arrObj.tm=i;
                        }else{
                            arrObj.tm=i;
                        }
                        arrObj.x=e[i].lon;
                        arrObj.y=e[i].lat;
                        arrObj.sp=10;
                        arrObj.ag=30;
                        
                        pathParam.push(arrObj);
                    }
                    
                    //官方方法
                    var path1 = [];
                    for(var i=0;i<pathParam.length;i+=1){
                      path1.push([pathParam[i].x,pathParam[i].y])
                    }
                    new AMap.GraspRoad().driving(pathParam,function(error,result){
                      if(!error){
                        var path2 = [];
                        var newPath = result.data.points;
                        for(var i =0;i<newPath.length;i+=1){
                          path2.push([newPath[i].x,newPath[i].y])
                        }
                        var newLine = new AMap.Polyline({
                          path:path2,
                          strokeWeight:8,
                          strokeOpacity:0.7,
                          strokeColor:'green'
                        })
                        map.add(newLine)
                        map.setFitView()
                      }
                    })
                    
                    //添加多个点标记
                    var marker1 = new AMap.Marker({
                        position: new AMap.LngLat(endLon, endLat),
                        icon: "http://webapi.amap.com/theme/v1.3/markers/n/end.png",
                    });
                    
                    var marker2 = new AMap.Marker({
                        position: new AMap.LngLat(statrLon, statrLat),
                        icon: "http://webapi.amap.com/theme/v1.3/markers/n/start.png",
                    });
                    var markerList = [marker1, marker2];
                    
                    map.add(markerList);
                }
            });

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值