Bing Maps API请求返回Uncaught SyntaxError:意外的令牌:

时间:2014-10-16 15:40:46

标签: javascript jquery bing-maps

我收到错误Uncaught SyntaxError:意外的令牌:(dev.virtualearth.net /:1)

这是我的javascript。

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(showPosition);
    } else {
        alert("Geolocation is not supported by this browswer or not enabled.");
    }
}

function showPosition(position) {
    $.ajax({
        url: 'http://dev.virtualearth.net/REST/v1/Locations/',
        dataType: 'jsonp',
        data: {
            q: position.coords.latitude + ',' + position.coords.longitude,
            key: '***'
        }
    }).then(function(data) {
        //alert("Latitude: " + position.coords.latitude + "<br /> Longitude: " + position.coords.longitude +
        //"<br /> Province: " + data.resourceSets.resources[0].address.locality);
        console.log(data.toString());
    });


}

返回的json有效,但不确定错误发生的位置。

1 个答案:

答案 0 :(得分:1)

您的查询存在一些问题:

  • 不应像您一样将坐标传递给查询参数。这不会像我认为你想要的那样反转地理位置。坐标应该是URL的一部分,如... / Location / latitude,longitude?key =
  • 除了dataType之外,还设置了ajax方法的jsonp参数。
  • 不使用导航器,而是使用属于Bing Maps API的GeoLocationProvider类。旧版浏览器不支持Navigator类,但是,某些旧版浏览器确实有其他方法可以获取用户位置。 GeoLocationProvider类为您包装所有这些不同的方法。这样,您还可以选择显示精度圆,并根据需要设置地图视图。
  • 将会话密钥与REST服务一起使用,而不是使用Bing地图密钥。这将使此服务请求成为不可计费的交易。

以下是一个代码示例,可让您获取用户位置并对其进行反向地理编码:

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

  <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
  <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.1.min.js"></script>

  <script type="text/javascript">
    var map, sessionKey;

    function GetMap()
    {   
        map = new Microsoft.Maps.Map(document.getElementById("myMap"), { 
            credentials: "YOUR_BING_MAPS_KEY"
        });

        map.getCredentials(function(c){
            sessionKey = c;
        });
    }

    function getLocation() {
        var geoLocationProvider = new Microsoft.Maps.GeoLocationProvider(map);  
        geoLocationProvider.getCurrentPosition({ 
            showAccuracyCirle: false, 
            updateMapView: false,
            successCallback: showPosition
        });
    }

    function showPosition(position) {

        $.ajax({
            url: 'http://dev.virtualearth.net/REST/v1/Locations/' + position.center.latitude + ',' + position.center.longitude,
            dataType: "jsonp",
            jsonp: "jsonp",
            data: {
                key:sessionKey
            },
            success: function (result) {
                if (result &&
                    result.resourceSets &&
                    result.resourceSets.length > 0 &&
                    result.resourceSets[0].resources &&
                    result.resourceSets[0].resources.length > 0) {
                    alert(result.resourceSets[0].resources[0].address.formattedAddress);
                }else{
                    alert("No Results Found");
                }            
            },
            error: function (e) {
                alert(e.statusText);
            }
        });
    }
    </script>   
</head>
<body onload="GetMap();">
    <div id='myMap' style="position:relative;with:800px;height:600px;"></div><br/>
    <input type="button" onclick="getLocation()" value="test"/>
</body>
</html>