Bing必应地图中国API

Bing必应地图中国API - 添加实时交通信息

2011-05-24 14:44:58| 分类： Bing&Google|字号订阅

2009年4月23日，微软必应地图中国API新增实时路况API。第一时间为大家带来这个API的应用例子。
其实，我们完全可以不用修改任何代码就能查看实时交通路况。因为地图导航工具栏就有“实时路况”这个按钮，点击一下就能看路况信息。
但是，有时候我们希望通过程序来控制是否显示实时路况信息，就有必要参考一下这个例子。秉承一贯的风格，我这个例子也很简单。
首先定义两个函数：显示实时路况ShowTraffic（）及不显示实时路况ClearTraffic（）：
        function ShowTraffic() {
            map.LoadTraffic(true);   //显示实时路况
            map.ShowTrafficLegend(x, y); //设置实时路况图例的位置，x、y分别表示距离屏幕坐标左上角的像素位置。如果不设置的话，默认显示在屏幕右下角
            map.SetTrafficLegendText("The traffic dude!"); //设置图例的文字说明，不过好像会被默认的文字覆盖掉，我在研究一下。不影响使用
        }
        function ClearTraffic() {
            map.ClearTraffic(); //不显示实时路况
        }
然后，我们增加两个按钮来触发这两个函数：
<input id="showtraffic" type="button" value="Show Traffic" onclick="ShowTraffic();"/>
<input id="cleartraffic" type="button" value="Clear Traffic" onclick="ClearTraffic();"/>

大功告成，是不是很简单？
完整代码如下：
<!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://dev.ditu.live.com/mapcontrol/mapcontrol.ashx?v=6.1"></script>
      <script type="text/javascript">
var map = null;

         function GetMap()
         {
            map = new VEMap('myMap');
            map.LoadMap(new VELatLong(39.9, 116.6), 5);
        }
        function ShowTraffic() {
            map.LoadTraffic(true);
            map.ShowTrafficLegend(100, 100);
            map.SetTrafficLegendText("The traffic dude!");
        }
        function ClearTraffic() {
            map.ClearTraffic();
        }

      </script>
   </head>
   <body onload="GetMap();">
      <div id='myMap' style="position:relative; 600px; height:480px;"></div>
      <input id="showtraffic" type="button" value="Show Traffic" onclick="ShowTraffic();"/>
      <input id="cleartraffic" type="button" value="Clear Traffic" onclick="ClearTraffic();"/>
   </body>
</html>
引用：http://www.htchen.com/post/9.html