-1

我正在使用 Google 地图 api 导航用户位置到固定位置之间的路线，我使用 DirectionsService 导航但它不起作用。

<script type="text/javascript">

$( "#map-page" ).live( "pageinit", function() {

    var defaultLatLng = new google.maps.LatLng(22.983587,120.22599);  // Default to Hollywood, CA when no geolocation support
    // 建立 DirectionsService 物件
    var directionsService = new google.maps.DirectionsService();


    if ( navigator.geolocation ) {
        function success(pos) {
            // Location found, show map with these coordinates
            drawMap(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
                // DirectionsRequest
        var request = {
        origin: new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude),  // 起點
        destination: new google.maps.LatLng(22.981666,120.194301),  // 終點
        waypoints: [],
        optimizeWaypoints: true, // 路線最佳化
        travelMode: google.maps.TravelMode.WALKING // 交通模式，目前有 開車/步行 以及腳踏車(僅限美國) 三種路線規劃
};

    directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      var route = response.routes[0];
      // 取得距離
      console.log(route.legs[0].distance.text);
      // 取得從起點至終點的大約時間
      console.log(route.legs[0].duration.text);
    }
});

        }

        function fail(error) {
            console.log(error);
            drawMap(defaultLatLng);  // Failed to find location, show default map
        }

        // Find the users current position.  Cache the location for 5 minutes, timeout after 6 seconds
        navigator.geolocation.getCurrentPosition(success, fail, {maximumAge: 500000, enableHighAccuracy:true, timeout: 6000});
    } else {
        drawMap(defaultLatLng);  // No geolocation support, show default map    
    }

    function drawMap(latlng) {
        var myOptions = {
            zoom: 10,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP

        };

        var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);

        // Add an overlay to the map of current lat/lng
        var marker = new google.maps.Marker({
            position: latlng,
            map: map,
            title: "Greetings!"
        });
    }
    </script>

谁能告诉我怎么了，thx

顺便说一句，我有上面代码的演示

http://appkon.com/demo/project2/maps.html

4

1 回答 1

2

查看 Chrome 中的 JavaScript 控制台，我收到错误消息，此资源即将出现 404，无法加载： http ://appkon.com/demo/JQuery%20Mobile%20%E7%A8%8B%E5 %BC%8F%E7%A2%BC/ch9/maps.js

我怀疑这是你问题的开始。我会解决这个问题，看看还有什么问题。这是使用 Chrome 开发工具调试 Maps API 的一个很好的参考视频： http ://www.youtube.com/watch?v=nb4gvrNrDWw

于 2012-08-08T13:43:09.377 回答