php获取步行的轨迹 - php基础

PHP完全自学手册(珍藏版) 中文pdf扫描版下载

<!DOCTYPE HTML>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>获取轨迹</title>

    <script src="/js/jquery-1.10.2.min.js" type="text/javascript"></script>

    <link rel="stylesheet" type="text/css" href="http://developer.amap.com/Public/css/demo.Default.css" />

    <style type="text/css">

        html{height:100%}

        body{height:100%;margin:0px;padding:0px;overflow:hidden}

        #iCenter{height:99%;width:99%}

    </style >

    <script language="javascript" src="http://webapi.amap.com/maps?v=1.3&key=您网站的key"></script>

    <script language="javascript">

        var polyline;

        var lngX =114.025974;

        var latY = 22.546054;

        var list = eval('[{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445264427000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265147000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265167000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265167000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265347000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265347000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265407000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265407000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265527000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445265947000},{"accuracy":12,"latitude":44.550365,"longitude":120.898041,"altitude":0,"speed":0,"bearing":10,"time":1445266066000}]');

        if(list[0]){

            lngX = list[0]['longitude'];

            latY = list[0]['latitude'];

        }

        var mapObj;

        //初始化地图对象，加载地图

        function mapInit(){

            mapObj = new AMap.Map("iCenter",{

                //二维地图显示视口

                view: new AMap.View2D({

                    center:new AMap.LngLat(lngX,latY),//地图中心点

                    zoom:17 //地图显示的缩放级别

                }),

                continuousZoomEnable:false

            });

            AMap.event.addListener(mapObj,"complete",completeEventHandler);

        }

        //地图图块加载完毕后执行函数

        function completeEventHandler(){

            var locType = $("input:checked").val();

            lineArr = new Array();

            for (var i = 0; i < list.length; i++){

                var item = list[i];

                if(locType){

                    if(locType==item['provider']){

                        var latlng = new AMap.LngLat(item['longitude'],item['latitude']);

                        lineArr.push(latlng);

                    }

                }else{

                    var latlng = new AMap.LngLat(item['longitude'],item['latitude']);

                    lineArr.push(latlng);

                }

            }

            marker = new AMap.Marker({

                map:mapObj,

                //draggable:true, //是否可拖动

                position:lineArr[lineArr.length-1],//基点位置

                icon:"http://code.mapabc.com/images/car_03.png", //marker图标，直接传递地址url

                offset:new AMap.Pixel(-26,-13), //相对于基点的位置

                autoRotation:true

            });

            //绘制轨迹

            polyline = new AMap.Polyline({

                map:mapObj,

                path:lineArr,

                strokeColor:"#00A",//线颜色

                strokeOpacity:1,//线透明度

                strokeWeight:3,//线宽

                strokeStyle:"solid"//线样式

            });

            mapObj.setFitView();

        }

        function startAnimation() {

            marker.moveAlong(lineArr,500);

        }

        function stopAnimation() {

            marker.stopMove();

        }

        $().ready(function(){

            $("input[name='loc_type']").click(function(){

                polyline.setMap(null);

                marker.setMap(null);

                completeEventHandler();

            });

        });

    </script>

    <script type="text/javascript">

    </script>

</head>

<body onLoad="mapInit()">

<div id="iCenter"></div>

<div style="position:absolute;left:20px;top:10px;font-size:12px">

    <input type="radio" name="loc_type" checked="checked" value=""/>ALL

    <input type="radio" name="loc_type" value="G"/>GPS

    <input type="radio" name="loc_type" value="N"/>NETWORK

</div>

<div style="position:absolute;left:40%;bottom:60px;font-size:12px">

    <input type="button" value="开始" onclick="startAnimation()"/>

    <input type="button" value="停止" onclick="stopAnimation()"/>

</div>

</body>

</html>

转载请注明：谷谷点程序 » php获取步行的轨迹