日期:2014-05-16  浏览次数:20383 次

能用谷歌地图api显示 几个经纬度点 形成轨迹

服务器返回的数据为,

每行一个点,逗号分开经纬度

32.1231241,125.23123123
32.1231241,125.23123123
32.1231241,125.23123123
32.1231241,125.23123123

比如说,有 四个点,知道经纬度


设置4秒后


动态依次连接四个点画线,

显示一下轨迹

------解决方案--------------------
如果是V3的话,这段代码可以参考下,下班了,没时间写:
也是我回复的类似的帖子,原贴链接

JScript code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>谷歌地图 v3</title>
    <script src="http://maps.google.com/maps/api/js?v=3.1&sensor=true" type="text/javascript"></script>
    
    <script type="text/javascript">
        var map;// 地图对象
        var directionsService = new google.maps.DirectionsService();
        var directionDisplay;
        var path = null,timer = 0,index = 0,marker = null;
        function init() {
            directionsDisplay = new google.maps.DirectionsRenderer();
            var coor = new google.maps.LatLng(23.129163, 113.264435);
            map = new google.maps.Map(document.getElementById("map"), { zoom: 12, center: coor, mapTypeControl: false, mapTypeId: google.maps.MapTypeId.ROADMAP });

            directionsDisplay.setMap(map);

            var request = {
                origin: "广州市火车站",
                destination: "广州市番禺区汉溪长隆",
                optimizeWaypoints: true,
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            };

            // 获取从“广州市火车站”到“广州市番禺区汉溪长隆”的线路
            directionsService.route(request, function(response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);
                    path = response.routes[0].overview_path;
                    if (path) {
                        timer = window.setInterval(function() {
                            if (!marker) {
                                marker = new google.maps.Marker({ position: path[index++], map: map });
                            } else {
                                if (index < path.length) {
                                    marker.setPosition(path[index++]);
                                } else {
                                    index = 0;
                                    window.clearInterval(timer);
                                }
                            }
                        }, 30);
                    }
                }
            });
        }
    </script>
</head>
<body onload="init();">
    <div id="map" style="width:800px; height:800px;"></div>
</body>
</html>