高德地图轨迹绘制
http://blog.csdn.net/wocaonima332/article/details/51769738 坐标转换
http://lbs.amap.com/api/webservice/guide/api/direction/ 高德路径规划,设置途径点(驾车)
http://blog.csdn.net/u010367582/article/details/50484428 百度地图设置途径点
http://www.cnblogs.com/milkmap/p/3755257.html
http://blog.csdn.net/justdoit_potato/article/details/73189164
<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>