调用Google Maps DirectionsService时未捕获的异常

问题描述

致电Google Maps Directions服务时出现Uncaught InvalidValueError: in property origin: not a string; and not a LatLng or LatLngLiteral: not an Object错误-即便如此，方向似乎也已添加到地图中?

I am getting an Uncaught InvalidValueError: in property origin: not a string; and not a LatLng or LatLngLiteral: not an Object error when I call the Google maps directions service - even so, the directions seem to be added to the map?

这是在当前位置(currentPos)和不太远的位置(LatLng(52.705151, -2.741861))之间调用路线服务的功能

Here is the function that calls the directions service between the current location (currentPos) and a location not too far away (LatLng(52.705151, -2.741861))

    function calcRoute() {
    var start = currentPos;
    var end = new google.maps.LatLng(52.705151, -2.741861);
    var request = {
        origin: start,
        destination: end,
        travelMode: google.maps.TravelMode.WALKING
    };
    directionsService.route(request, function (response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
        }
    });
}

以下是初始化地图并调用calcRoute()函数的代码:

Here is the code that initializes the map and calls the calcRoute() function:

    var directionsDisplay;
var directionsService = new google.maps.DirectionsService();

var currentPos;
var destinationPos;

var map;

function initialize() {
    directionsDisplay = new google.maps.DirectionsRenderer();
    var mapOptions = {
        zoom: 14
    };

    map = new google.maps.Map(document.getElementById('map_canvas'),
        mapOptions);

    directionsDisplay.setMap(map);

    var infoWindow = new google.maps.InfoWindow();

    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(function (position) {
            currentPos = new google.maps.LatLng(position.coords.latitude,
                                             position.coords.longitude);

            var marker = new google.maps.Marker({
                position: currentPos,
                map: map,
                title: "You are here"
            });

            marker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png')

            map.setCenter(currentPos);

            $.ajax({
                type: 'GET',
                url: $('#AddMarkersToMap').val(),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    addMarkers(data, infoWindow);
                },
                error: function () {
                    alert("Error");
                }
            });


        }, function () {
            handleNoGeolocation(true);
        });
    } else {
        handleNoGeolocation(false);
    }

    calcRoute();


}

一些谷歌搜索提示可能是由于未加载地图导致的异常，因此我尝试像这样放置calcRoute调用，但没有帮助:

Some Googling suggested the exception might be caused because the map hadn't loaded so I tried putting the calcRoute call like this which didn't help:

    $(function () {
        calcRoute()
    });

推荐答案

调用calcRoute时，您的currentPos变量未定义.
getCurrentPosition是异步的，不会在calcRoute之前执行，因此未设置currentPos.
如果需要在calcRoute中使用currentPos，则应在getCurrentPosition的回调中调用它以确保已定义.

Your currentPos variable is undefined when you call calcRoute.
getCurrentPosition is asynchronous and will not have executed before calcRoute and therefore not set currentPos.
If you need to use currentPos in calcRoute you should call it in the callback to getCurrentPosition to ensure that it is defined.

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function (position) {
        currentPos = new google.maps.LatLng(position.coords.latitude,
                                         position.coords.longitude);

        var marker = new google.maps.Marker({
            position: currentPos,
            map: map,
            title: "You are here"
        });

        marker.setIcon('http://maps.google.com/mapfiles/ms/icons/green-dot.png')

        map.setCenter(currentPos);

        $.ajax({
            type: 'GET',
            url: $('#AddMarkersToMap').val(),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                addMarkers(data, infoWindow);
            },
            error: function () {
                alert("Error");
            }
        });
        calcRoute();
        //\\//\\//\\
    }, function () {
        handleNoGeolocation(true);
    });

这篇关于调用Google Maps DirectionsService时未捕获的异常的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！