javascript - Virtual Earth V6.3 (Bing) map 控件中高缩放级别的折线问题

标签 javascript asp.net bing-maps polyline virtual-earth

我有一个带有 Virtual Earth V6.3 控件的应用程序,使用纯 JavaScript 来添加折线,如嵌入在单个 HTML5 网页中的以下示例代码片段所示:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>VE Map with Polyline</title>
    <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>
    <script type="text/javascript">
        function MapLoad() {
            // load map
            var _map = new VEMap('Map');
            _map.LoadMap();

            // center point in NY City
            var _center = new VELatLong(40.75, -73.99);

            // zoom level
            _map.SetCenterAndZoom(_center, 14);

            // set Map style
            _map.SetMapStyle(VEMapStyle.Shaded);

            // polyline layer
            var _layerPolyline = new VEShapeLayer();

            // sample polyline array of coordinates
            var _arrPoints = [];
            _arrPoints.push(new VELatLong(40.78, -73.984));
            _arrPoints.push(new VELatLong(40.76, -73.989));
            _arrPoints.push(new VELatLong(40.75, -73.99));
            _arrPoints.push(new VELatLong(40.74, -73.991));
            _arrPoints.push(new VELatLong(40.73, -73.992));
            _arrPoints.push(new VELatLong(40.72, -73.993));
            _arrPoints.push(new VELatLong(40.72, -73.994));
            _arrPoints.push(new VELatLong(40.73, -73.995));
            _arrPoints.push(new VELatLong(40.73, -73.996));
            _arrPoints.push(new VELatLong(40.74, -73.997));

            // polyline object properties
            var _polyLine= new VEShape(VEShapeType.Polyline, _arrPoints);
            _polyLine.HideIcon();
            _polyLine.SetLineColor(new VEColor(0, 0, 255, 1));
            _polyLine.SetFillColor(new VEColor(0, 0, 255, 0));
            _polyLine.SetLineWidth(4);

            // add polyline to layer
            _layerPolyline.AddShape(_polyLine);

            // add layer to map
            _map.AddShapeLayer(_layerPolyline);
        }
    </script>
</head>
<body onload="MapLoad();">
    <div id="Map" style="position:absolute; height:98%; width:98%;"></div>
</body>
</html>

它在任何缩放级别下都可以正常工作。然而,在使用 ASP.NET 4.5 Web 表单时,本质上相同的代码会在实际应用程序中产生奇怪的结果,即:折线在高缩放级别(大约高于 15)时消失。

问:关于问题的根本原因以及如何解决它有什么想法吗?谢谢。

更新:通过升级到 Bing Maps AJAX Control 7.0 版,问题已解决(工作: DEMO :公交车路线折线可见在任何缩放级别)。感谢 Ricky Brundrit (@rbrundritt)。

最佳答案

可能的问题与缺少 UTF-9 元标记或文档类型有关。 V6.3 确实很旧,需要指定以下元标记和文档类型:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

另一个可能的问题是您在加载 map 时指定了任何凭据。这违反了 Bing map 的使用条款。

_map = new VEMap('MapNYC');
_map.SetCredentials("YOUR_BING_MAPS_KEY");
_map.LoadMap();

您可以在此处找到有关如何创建 Bing map 帐户和 key 的文档:

https://msdn.microsoft.com/en-us/library/gg650598.aspx

https://msdn.microsoft.com/en-us/library/ff428642.aspx

我建议为“公共(public)网站”创建一个“基本” key 。这将使您每年可以进行 125,000 笔免费交易。

尽管如此,您不应该使用 v6.3。它在 5 年前被 V7 取代,并且很快将接近使用生命周期。 v6.3 的文档在一年前就已下线,作为该版本生命结束的一部分。

关于javascript - Virtual Earth V6.3 (Bing) map 控件中高缩放级别的折线问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29811413/

相关文章:

javascript - 识别 JavaScript 中的恶意文件上传

c# - 在 C# 中更新对象时 session 对象发生变化

c# - 离线时删除/隐藏 Bing map 离线消息

javascript - AngularJS 无法加载 Bing map

c# - 必应 map API : Is there a way to use truck routing for distance matrix?

javascript - 如何设置事件的 EventTarget

javascript - MVVM 对 JavaScript 库的依赖?

c# - 用 2 个数字之间的所有数字填充下拉列表

javascript - 更新输入数字变量 onclick

visual-studio-2010 - Intellisense 是否适用于使用 Ext.extend 扩展的对象?