个人中心
gpt4 book ai didi

javascript - 隐藏 Bing map AJAX v7 DirectionsManager 信息框

转载 作者：行者123 更新时间：2023-12-03 12:18:26 24 4
gpt4 key购买 nike

我第一次使用 DirectionsManager 在 Bing Maps AJAX v7 中创建路线。路线创建正确，但有两个小“信息框”，在路线的开头显示“A”，在终点显示“B”。我想删除这些信息框，但老实说，在阅读了所有文档( http://msdn.microsoft.com/en-us/library/hh312832.aspx )和“Binging/Googling”一段时间后，我找不到任何有用的东西。另外，我尝试了 setRenderOptions 中的每个选项。有什么想法吗？

        directionsManager = new Microsoft.Maps.Directions.DirectionsManager(map);
        directionsManager.resetDirections();
        directionsManager.setRenderOptions({autoDisplayDisambiguation: false, 
            autoUpdateMapView: true, displayManeuverIcons: false, displayPreItineraryItemHints: false, displayPostItineraryItemHints: false, displayRouteSelector: false, displayStepWarnings: false, drivingPolylineOptions: { strokeColor: new Microsoft.Maps.Color(150, 255, 51, 51), strokeThickness: 8 }
        });

        directionsManager.setRequestOptions({ routeMode: Microsoft.Maps.Directions.RouteMode.driving });

        var seattleWaypoint = new Microsoft.Maps.Directions.Waypoint({ address: '000 fake street, Houston TX 77000' });
        directionsManager.addWaypoint(seattleWaypoint);
        var tacomaWaypoint = new Microsoft.Maps.Directions.Waypoint({ address: '111 fake street, Houston TX 77111' });
        directionsManager.addWaypoint(tacomaWaypoint);

        directionsManager.calculateDirections();

最佳答案

一种可能的解决方案是自定义图钉以显示小尺寸的空白图钉(我尝试过使用另一个 15x15 像素大小的图钉):

// Set the render options
            directionsManager.setRenderOptions({ 
                itineraryContainer: document.getElementById('itineraryDiv'), 
                displayWalkingWarning: false, 
                walkingPolylineOptions:{strokeColor: new Microsoft.Maps.Color(200, 0, 255, 0)},
                waypointPushpinOptions: {icon:'pin_blank.png', height:1, width:1}
            });

另一种方法可能包括您自己调用服务并在代码中处理请求和响应。这是一个示例:http://msdn.microsoft.com/en-us/library/gg427607.aspx

以下代码可能会对您有所帮助:

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

         var map = null;

         function GetMap()
         {
            // Initialize the map
            map = new Microsoft.Maps.Map(document.getElementById("mapDiv"),{credentials:"Your Bing Maps Key", mapTypeId: Microsoft.Maps.MapTypeId.road }); 


         }

         function ClickRoute(credentials)
         {

            map.getCredentials(MakeRouteRequest);
         }


         function MakeRouteRequest(credentials)
         {
            var routeRequest = "http://dev.virtualearth.net/REST/v1/Routes?wp.0=" + document.getElementById('txtStart').value + "&wp.1=" + document.getElementById('txtEnd').value + "&routePathOutput=Points&output=json&jsonp=RouteCallback&key=" + credentials;

            CallRestService(routeRequest);

         }


          function RouteCallback(result) {


             if (result &&
                   result.resourceSets &&
                   result.resourceSets.length > 0 &&
                   result.resourceSets[0].resources &&
                   result.resourceSets[0].resources.length > 0) {

                     // Set the map view
                     var bbox = result.resourceSets[0].resources[0].bbox;
                     var viewBoundaries = Microsoft.Maps.LocationRect.fromLocations(new Microsoft.Maps.Location(bbox[0], bbox[1]), new Microsoft.Maps.Location(bbox[2], bbox[3]));
                     map.setView({ bounds: viewBoundaries});


                     // Draw the route
                     var routeline = result.resourceSets[0].resources[0].routePath.line;
                     var routepoints = new Array();

                     for (var i = 0; i < routeline.coordinates.length; i++) {

                         routepoints[i]=new Microsoft.Maps.Location(routeline.coordinates[i][0], routeline.coordinates[i][1]);
                     }


                     // Draw the route on the map
                     var routeshape = new Microsoft.Maps.Polyline(routepoints, {strokeColor:new Microsoft.Maps.Color(200,0,0,200)});
                     map.entities.push(routeshape);

                 }
         }


         function CallRestService(request) 
         {
            var script = document.createElement("script");
            script.setAttribute("type", "text/javascript");
            script.setAttribute("src", request);
            document.body.appendChild(script);
         }

      </script>
   </head>
   <body onload="GetMap();">
      <div id='mapDiv' style="position:relative; width:400px; height:400px;"></div>
      <input id="txtStart" type="text" value="Seattle"/>
      <input id="txtEnd" type="text" value="Portland"/>
      <input type="button" value="Calculate Route" onclick="ClickRoute()"/>
   </body>
</html>

关于javascript - 隐藏 Bing map AJAX v7 DirectionsManager 信息框，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24563297/

24 4 0
文章推荐： javascript - JSONP 适配器 Phonegap 项目无法正常工作
文章推荐： mockups - Balsamiq，如何在Datagrid中放置按钮
文章推荐： intellij-idea - 如何将内部类移动到外部
文章推荐： javascript - Backbone fetch 返回 5 个模型，但当我渲染 Collection View 时，只有 1 个模型存在？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com