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. 去面试Python工程师,这几个基础问题一定要能回答,Python面试题No4

    今天的面试题以基础为主,去面试Python工程师,这几个基础问题不能答错 第1题:列表和元组有什么不同? 列表和元组是Python中最常用的两种数据结构,字典是第三种. 相同点: 都是序列 都可以存储 ...

  2. LeetCode(29)Divide Two Integers

    题目 Divide two integers without using multiplication, division and mod operator. If it is overflow, r ...

  3. HttpURLConnection绕过HTTPS的SSL验证

    (这个jdk环境需要是1.8,以上). 直接在类里面加一个static代码块 static { try { trustAllHttpsCertificates(); HttpsURLConnectio ...

  4. mysql-5.7.17-winx64免安装配置

    一,下载mysql-5.7.17-winx64.zip 地址:https://dev.mysql.com/downloads/file/?id=467269 二,解压到自己的某个磁盘:data文件夹和 ...

  5. 你需要知道的Linux安全

    1. 账号以及密码一定要复杂,密码需要符合这些规范:字符大于 10 个:至少包含大小写以及数字:密码中不能包含账号,不能包含自己的姓名全拼,不能有自己的生日数字,不能有自己的电话号码:密码要定期更换: ...

  6. Fiddler抓取https相关设置

    转自:https://www.cnblogs.com/joshua317/p/8670923.html 很多使用fiddler抓包,对于http来说不需太多纠结,随便设置下就能用,但是抓取https就 ...

  7. xtu summer individual 3 F - Opening Portals

    Opening Portals Time Limit: 2000ms Memory Limit: 262144KB This problem will be judged on CodeForces. ...

  8. [BZOJ2667][cqoi2012]模拟工厂

    [BZOJ2667][cqoi2012]模拟工厂 试题描述 有一个称为“模拟工厂”的游戏是这样的:在时刻0,工厂的生产力等于1.在每个时刻,你可以提高生产力或者生产商品.如果选择提高生产力,在下一个时 ...

  9. [luoguP1010] 幂次方 ^(* ̄(oo) ̄)^

    传送门 递归.. 代码 #include <cstdio> int n; int bit[15]; inline void solve(int x) { int i, f = 0; if( ...

  10. requests模块发送POST请求

    在HTTP协议中,post提交的数据必须放在消息主体中,但是协议中并没有规定必须使用什么编码方式,从而导致了 提交方式 的不同.服务端根据请求头中的 Content-Type 字段来获知请求中的消息主 ...