Bing必应地图中国API-画线与添加多边形

2011-05-24 14:31:20|  分类: Bing&Google|字号 订阅

 
 

在必应地图上画线的功能应用也很广泛:显示从出发地到目的地的行驶路径,或者显示某一辆车的历史行驶轨迹,等等。
上一讲中我们提到shape类可以是点、线或多边形。在初始化shape类的时候,可以通过输入参数VEShapeType.Polyline来实现一个折线示例。需要注意的是,可以通过指定多个经纬度来确定一条折线。例如:
var shape = new VEShape(VEShapeType.Polyline, [new VELatLong(39.9022,116.3321), new VELatLong(39.9833,116.3423),new VELatLong(39.9946,116.3571)]);
这条折线包含了两个线段。
此外,shape类提供了许多方法来设置shape的各种属性,例如:
shape.SetLineWidth(3);     设置折线的宽度
shape.SetLineColor(new VEColor(0,150,100,1.0));     设置折线的颜色
 
接下来,我们定义一个画线函数来完整的实现这一功能:
  function AddPolyline()
         {
            var ll = map.GetCenter();
            var lat = ll.Latitude;
            var lon = ll.Longitude;
            var shape = new VEShape(VEShapeType.Polyline, [new VELatLong(lat-0.1,lon-0.1), 
                                                  new VELatLong(lat+0.1,lon-0.1),
                                                  new VELatLong(lat+0.1,lon), 
                                                  new VELatLong(lat-0.1,lon), 
                                                  new VELatLong(lat-0.1,lon+0.1),
                                                  new VELatLong(lat+0.1,lon+0.1)]);
            shape.SetTitle('我的折线');
            shape.SetDescription('显示一段折线');
            map.AddShape(shape);
         }
这段代码应该很好理解了,首先取屏幕中心经纬度,然后参考这个经纬度分别取6个点,确定一条5折线。

作为必应地图的三项最基本应用之一,添加多边形的作用也非常广泛。例如,在物流、导航、监控领域,设置一个监控区域,或者观察目标状态的变化。如果我们学习了上两讲的内容,那么这一讲的内容应该内度并不大。
首先我们要初始化一个多边形:
var shape = new VEShape(VEShapeType.Polygon, [new VELatLong(lat,lon-0.15),
                                                   new VELatLong(lat+0.1,lon-0.05),
                                                   new VELatLong(lat+0.1,lon+0.05),
                                                   new VELatLong(lat,lon+0.15),
                                                   new VELatLong(lat-0.1,lon+0.05),
                                                   new VELatLong(lat-0.1,lon-0.05)]);
此处lat和lon为当前地图中心的纬度和经度。
可以看到,多边形的初始化参数为VEShapeType.Polygon,至少三个点确定一个多边形。
我们还可以通过shape类的各种方法来指定多边形的属性:线条粗细、颜色,填充颜色,多边形描述信息等等。这一讲我们增加一个新的内容,即多边形的描述可以支持html语法。
var infobox = "<div style='width:309px;'>You can add html codes into the info box or change the style of the info box. You can design and show any info box you want!<br>"
                    +"<a href='http://msdn2.microsoft.com/en-us/library/bb412553.aspx' target='_blank'>Click here to find out more.</a><br></div>"
                    +"<embed src='http://images.soapbox.msn.com/flash/soapbox1_1.swf' quality='high' width='309px' height='272px' wmode='transparent' type='application/x-shockwave-flash' pluginspage='http://macromedia.com/go/getflashplayer' flashvars='c=v&v=a4b53303-d58c-450e-a01d-069c9bcb5fe9' ></embed><br /><a href='http://soapbox.msn.com/video.aspx?vid=a4b53303-d58c-450e-a01d-069c9bcb5fe9' target='_blank' title='Virtual Earth - Bird's eye view and 3D'>Video: Virtual Earth - Bird's eye view and 3D</a>";
上面的代码看似很长,其实就是定义了一个包含html语法的字符串。然后通过调用shape.SetDescription(infobox)设置多边形的描述内容。
 
下面让我们看一下添加多边形函数的完整实现:
  function AddPolygon()
         {
            var ll = map.GetCenter();
            var lat = ll.Latitude;
            var lon = ll.Longitude;
            var shape = new VEShape(VEShapeType.Polygon, [new VELatLong(lat,lon-0.15),                                        
                       new VELatLong(lat+0.1,lon-0.05),                                    
                       new VELatLong(lat+0.1,lon+0.05),                                    
                       new VELatLong(lat,lon+0.15),                                        
                       new VELatLong(lat-0.1,lon+0.05),                                    
                       new VELatLong(lat-0.1,lon-0.05)]);
         
           shape.SetTitle("<h2>Custom Pin</h2>");
           shape.SetDescription(infobox);
           //Add the shape the the map
           map.AddShape(shape);
         }
并且在html body中增加一个控制链接:
<div><a href='#' onclick='AddPolygon();'>增加多边形</a></div>
记住,别忘了在代码中定义infobox字符串。

 
 
 
 
 

Bing必应地图中国API-画线与添加多边形的更多相关文章

  1. Bing必应地图中国API - 在地图上画圆

    Bing必应地图中国API - 在地图上画圆 2011-05-24 14:49:37|  分类: Bing&Google|字号 订阅     <变形金刚2>上映4日国内票房过亿,基 ...

  2. Bing必应地图中国API入门讲座之八:显示驾车路线

    Bing必应地图中国API入门讲座之八:显示驾车路线 2011-05-24 14:47:36|  分类: Bing&Google|字号 订阅     这篇文章非常值得纪念,因为我是在Googl ...

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

    Bing必应地图中国API - 添加实时交通信息 2011-05-24 14:44:58|  分类: Bing&Google|字号 订阅     2009年4月23日,微软必应地图中国API新 ...

  4. Bing必应地图中国API一显示地图 (转) 做人要厚道

    Bing必应地图中国API一显示地图 2011-05-24 14:27:31|  分类: Bing&Google|字号 订阅     微软必应地图中国地图API发布已经有10天了,考虑到网上现 ...

  5. Bing必应地图中国API-显示兴趣点 (转)

    Bing必应地图中国API-显示兴趣点 2011-05-24 14:29:55|  分类: Bing&Google|字号 订阅     在地图上显示一个兴趣点,这个应用可以说是最简单但是最广泛 ...

  6. Bing必应地图中国API-放大与平移

    Bing必应地图中国API-放大与平移 2011-05-24 14:26:32|  分类: Bing&Google|字号 订阅     有些时候我们不希望通过默认的控制栏来控制地图,而是希望能 ...

  7. ArcGIS API for JavaScript根据两个点坐标在地图上画线

    ArcGIS API for JavaScript根据两个点坐标在地图上画线比如说a(xxxx,xxxxx),b(xxxx,xxxxx).利用这两个点画一条线 var polyline = new e ...

  8. 必应地图api文档,微软必应地图web开发版详解,可以在国内使用国外地图

    最近,公司项目要求在页面中嵌入地图,需求还算简单,但是由于必须具备响应式(主要是pc和移动端),而且由于公司业务是全球性的,要支持国外地点搜索.考虑到百度,腾讯,高德等等国内地图无法显示国外数据,谷歌 ...

  9. 必应(Bing)每日图片获取API

    必应(Bing)每日图片获取API January 11, 2015 API http://lab.dobyi.com/api/bing.php 介绍 Value Description title ...

随机推荐

  1. mysql出现问题汇总(持续更新)

    1.mysql -uqwe -p普通用户登陆时提示: ERROR 1045 (28000): Access denied for user 'baijie'@'%' (using password: ...

  2. IDEA基本使用及配置(1)

    前言:现在IDEA用的人很多,我以前都是用Eclipse的,都说这个IDE比较智能.好用,于是学习一下. IDEA与Eclipse目录结构对比: IDEA中的Project相当于Eclispe中的wo ...

  3. 树莓派 - wiringPi

    wiringPi其实和BCM2835 library类似,也是通过memmap, IOmap来实现在用户空间直接操作底层寄存器 wiringPi http://wiringpi.com/ Wiring ...

  4. <input type="button" /> 和<input type="submit" /> 的区别

    <input type="button" /> 这就是一个按钮.如果你不写javascript 的话,按下去什么也不会发生.<input type="s ...

  5. MySQL操作示例

    """ MySQL综合练习作业 """ # 1.自行创建测试数据: # 创建数据库 """ create da ...

  6. 【Codeforces 1031C】Cram Time

    [链接] 我是链接,点我呀:) [题意] 题意 [题解] 如果找到最大的n使得1+2+...+n<=a+b 然后第一天输出1,2.3,4....t1 这里1+2+..+t1<=a 这还远远 ...

  7. POJ 3469 网络流最小割

    将两个CPU分别视作源点和汇点 对于那些不在同一个CPU中的模块会产生的代价作为一条双向的容量弧 这里每个模块可以在任意一个CPU中运行,相当于寻找一个割,分割后,在S集合中的模块安装在第一个CPU中 ...

  8. UVA 1995 I can guess the structer

    模 拟 /*by SilverN*/ #include<algorithm> #include<iostream> #include<cstring> #inclu ...

  9. 【POJ3680】Intervals(费用流)

    题意:有n条线段,每条有起点,终点和一个权值 要求选取一些线段,使它们的权值和最大,并且使每一个点被覆盖不超过k次 1 ≤ K ≤ N ≤ 200 1 ≤ ai < bi ≤ 100,000, ...

  10. CSU - 1115 最短的名字(字典树模板题)

    Description 在一个奇怪的村子中,很多人的名字都很长,比如aaaaa, bbb and abababab. 名字这么长,叫全名显然起来很不方便.所以村民之间一般只叫名字的前缀.比如叫'aaa ...