<!DOCTYPE HTML> <html > <head> ##全屏显示 <style type="text/css"> html { height: 100%} body {height:100%;margin:0px;padding:0px} </style> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>轨迹回放</title> <link rel="stylesheet" type="text/css" src="./map.css" /> <script language="javascript" src="http://webapi.amap.com/maps?v=1.3&key=您申请的key值"></script> <script language="javascript"> var mapObj; //初始化地图对象,加载地图 function mapInit(){ mapObj = new AMap.Map("iCenter",{ zooms:[7,17], //二维地图显示视口 view: new AMap.View2D({ center:new AMap.LngLat(116.397428,39.90923),//地图中心点 zoom:13 //地图显示的缩放级别 }), continuousZoomEnable:false }); AMap.event.addListener(mapObj,"complete",completeEventHandler); } //地图图块加载完毕后执行函数 function completeEventHandler(){ marker = new AMap.Marker({ map:mapObj, //draggable:true, //是否可拖动 position:new AMap.LngLat(116.397428,39.90923),//基点位置 offset:new AMap.Pixel(-26,-13), //相对于基点的位置 autoRotation:true }); marker = new AMap.Marker({ map:mapObj, //draggable:true, //是否可拖动 position:new AMap.LngLat(116.427907,39.909270),//基点位置 offset:new AMap.Pixel(-26,-13), //相对于基点的位置 autoRotation:true }); marker = new AMap.Marker({ map:mapObj, //draggable:true, //是否可拖动 position:new AMap.LngLat(116.432303,39.909320),//基点位置 offset:new AMap.Pixel(-26,-13), //相对于基点的位置 autoRotation:true }); marker = new AMap.Marker({ map:mapObj, //draggable:true, //是否可拖动 position:new AMap.LngLat(116.424767,39.961329),//基点位置 offset:new AMap.Pixel(-26,-13), //相对于基点的位置 autoRotation:true }); marker = new AMap.Marker({ map:mapObj, //draggable:true, //是否可拖动 position:new AMap.LngLat(116.444317,39.960287),//基点位置 offset:new AMap.Pixel(-26,-13), //相对于基点的位置 autoRotation:true }); var lngX = 116.397428; var latY = 39.90923; lineArr = new Array(); lineArr.push(new AMap.LngLat(lngX,latY)); lineArr.push(new AMap.LngLat(116.427907,39.909270)); lineArr.push(new AMap.LngLat(116.432303,39.909320)); lineArr.push(new AMap.LngLat(116.424767,39.961329)); lineArr.push(new AMap.LngLat(116.444317,39.960287)); //绘制轨迹 var polyline = new AMap.Polyline({ map:mapObj, path:lineArr, strokeColor:"#00A",//线颜色 strokeOpacity:1,//线透明度 strokeWeight:3,//线宽 strokeStyle:"solid"//线样式 }); mapObj.setFitView(); } </script> <style> #iCenter{} </style> </head> <body onLoad="mapInit()" width:100%;height:100%;> <div class="iCenter" id="iCenter" ></div> </body> </html>
【map】使用高德地图显示地图轨迹
猜你喜欢
转载自duduli.iteye.com/blog/2084976
今日推荐
周排行