Question

我已经在Bing Map v7中使用了Accuracy Circle，但是当我使用Bing Maps v8时它无法工作。

如何在Bing Map V8中创建圆形折线或精确圆

Answer 1

Bing Maps V8 SDK不再具有GeoLocationProvider类。这是在6年前发布的v7中添加的。发布时，没有任何浏览器具有任何地理定位功能。现在，所有主流浏览器都内置了HTML5 Geolocation API，不再需要v7中的此变通办法类。您可以在此处找到有关如何在V8中使用HTML5地理定位API的文章：https://msdn.microsoft.com/en-us/library/mt712802.aspx

这些样本目前没有显示如何创建精确圆，因为空间数学库尚不可用，这使得这非常简单。在这个库中有一个名为getRegularPolygon的静态函数（docs：https://msdn.microsoft.com/en-us/library/mt712834.aspx）。它返回一个位置数组，这些位置在具有指定半径的位置周围形成正多边形。如果生成具有30个或更多点的正多边形，则它将看起来像一个圆。然而，这个空间数学函数存在一个错误，即它默认为米，而是使用KM而不是。我已经整理了一个代码示例，该示例在用户位置周围绘制了一个精确的圆圈，并为当前的bug添加了一个小的工作。即使在错误修复后，这项工作仍将继续有效，因此您不必担心将来会破坏它。这是代码示例：

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script type='text/javascript'
            src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap'
            async defer></script>
    <script type='text/javascript'>
    function GetMap() {
        var map = new Microsoft.Maps.Map('#myMap', {
            credentials: 'Your Bing Maps Key'
        });

        //Load the spatial math module
        Microsoft.Maps.loadModule("Microsoft.Maps.SpatialMath", function () {
            //Request the user's location
            navigator.geolocation.getCurrentPosition(function (position) {
                var loc = new Microsoft.Maps.Location(
                    position.coords.latitude,
                    position.coords.longitude);

                //Create an accuracy circle
                var accuracyRadiusMeters = position.coords.accuracy;

                var path = Microsoft.Maps.SpatialMath.getRegularPolygon(loc, accuracyRadiusMeters/1000, 30,  Microsoft.Maps.SpatialMath.KM);
                var poly = new Microsoft.Maps.Polygon(path);
                map.entities.push(poly);           

                //Add a pushpin at the user's location.
                var pin = new Microsoft.Maps.Pushpin(loc);
                map.entities.push(pin);

                //Center the map on the user's location.
                map.setView({ center: loc, zoom: 17 });
            });
        });
    }
    </script>
</head>
<body>
    <div id="myMap" style="position:relative;width:600px;height:400px;"></div>
</body>
</html>

如何在Bing Map V8中创建圆形折线或精确圆

1 个答案: