|
|
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>轨迹回放</title>
<!-- <link rel="stylesheet" type="text/css" href="demo.Default.css" /> -->
<script language="javascript" src="http://webapi.amap.com/maps?v=1.2&key=您申请的key值"></script>
<script language="javascript">
var mapObj;
var marker;
var marArr = [];
//初始化地图对象，加载地图
function mapInit(){
mapObj = new AMap.Map("iCenter"{
center:new AMap.LngLat(116.39742839.90923) //地图中心点
continuousZoomEnable:false
level:10 //地图显示的缩放级别
});
AMap.event.addListener(mapObj"complete"completeEventHandler);
}
//地图图块加载完毕后执行函数
function completeEventHandler(){
marker = new AMap.Marker({
map:mapObj
//draggable:true //是否可拖动
position:new AMap.LngLat(116.27388139.807409)//基点位置
icon:"[img]file:///C:\Users\XH\AppData\Local\Temp\[5UQ[BL(6~BS2JV6W}N6[%S.png[/img]http://code.mapabc.com/images/car_03.png" //marker图标，直接传递地址url
offset:new AMap.Pixel(-26-13) //相对于基点的位置
autoRotation:true
});
var lngX = 116.273881;
var latY = 39.807409;
lineArr = new Array();
lineArr.push(new AMap.LngLat(lngXlatY));
for (var i = 1; i <30; i++){
lngX=lngX+Math.random()*0.05;
if(i%2){
latY = latY+Math.random()*0.0001;
}else{
latY = latY+Math.random()*0.06;
}
lineArr.push(new AMap.LngLat(lngXlatY));
}
//绘制轨迹
var polyline=new AMap.Polyline({
map:mapObj
path:lineArr
strokeColor:"#00A"//线颜色
strokeOpacity:1//线透明度
strokeWeight:3//线宽
strokeStyle:"solid"//线样式
});
//marArr.push(marker);
}
function startAnimation() {
marker.moveAlong(lineArr10);
marArr.push(marker);
window.setInterval("mapObj.setFitView(marArr)"1000);
}
function stopAnimation() {
marker.stopMove();
}
</script>
</head>
<body>
<div id="iCenter" style="height:600px; width:700px;"></div>
<div style="padding:2px 0px 0px 5px;font-size:12px">
<input type="button" value="开始动画"/>
<input type="button" value="停止动画"/>
</div>
</body>
<html>
|
|
|
发表于 2014-8-27 12:04:16
收藏
发表于 2014-11-18 16:33:41
楼主