Bing必应地图中国API-画线与添加多边形
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-画线与添加多边形的更多相关文章
- Bing必应地图中国API - 在地图上画圆
Bing必应地图中国API - 在地图上画圆 2011-05-24 14:49:37| 分类: Bing&Google|字号 订阅 <变形金刚2>上映4日国内票房过亿,基 ...
- Bing必应地图中国API入门讲座之八:显示驾车路线
Bing必应地图中国API入门讲座之八:显示驾车路线 2011-05-24 14:47:36| 分类: Bing&Google|字号 订阅 这篇文章非常值得纪念,因为我是在Googl ...
- Bing必应地图中国API - 添加实时交通信息
Bing必应地图中国API - 添加实时交通信息 2011-05-24 14:44:58| 分类: Bing&Google|字号 订阅 2009年4月23日,微软必应地图中国API新 ...
- Bing必应地图中国API一显示地图 (转) 做人要厚道
Bing必应地图中国API一显示地图 2011-05-24 14:27:31| 分类: Bing&Google|字号 订阅 微软必应地图中国地图API发布已经有10天了,考虑到网上现 ...
- Bing必应地图中国API-显示兴趣点 (转)
Bing必应地图中国API-显示兴趣点 2011-05-24 14:29:55| 分类: Bing&Google|字号 订阅 在地图上显示一个兴趣点,这个应用可以说是最简单但是最广泛 ...
- Bing必应地图中国API-放大与平移
Bing必应地图中国API-放大与平移 2011-05-24 14:26:32| 分类: Bing&Google|字号 订阅 有些时候我们不希望通过默认的控制栏来控制地图,而是希望能 ...
- ArcGIS API for JavaScript根据两个点坐标在地图上画线
ArcGIS API for JavaScript根据两个点坐标在地图上画线比如说a(xxxx,xxxxx),b(xxxx,xxxxx).利用这两个点画一条线 var polyline = new e ...
- 必应地图api文档,微软必应地图web开发版详解,可以在国内使用国外地图
最近,公司项目要求在页面中嵌入地图,需求还算简单,但是由于必须具备响应式(主要是pc和移动端),而且由于公司业务是全球性的,要支持国外地点搜索.考虑到百度,腾讯,高德等等国内地图无法显示国外数据,谷歌 ...
- 必应(Bing)每日图片获取API
必应(Bing)每日图片获取API January 11, 2015 API http://lab.dobyi.com/api/bing.php 介绍 Value Description title ...
随机推荐
- mysql出现问题汇总(持续更新)
1.mysql -uqwe -p普通用户登陆时提示: ERROR 1045 (28000): Access denied for user 'baijie'@'%' (using password: ...
- IDEA基本使用及配置(1)
前言:现在IDEA用的人很多,我以前都是用Eclipse的,都说这个IDE比较智能.好用,于是学习一下. IDEA与Eclipse目录结构对比: IDEA中的Project相当于Eclispe中的wo ...
- 树莓派 - wiringPi
wiringPi其实和BCM2835 library类似,也是通过memmap, IOmap来实现在用户空间直接操作底层寄存器 wiringPi http://wiringpi.com/ Wiring ...
- <input type="button" /> 和<input type="submit" /> 的区别
<input type="button" /> 这就是一个按钮.如果你不写javascript 的话,按下去什么也不会发生.<input type="s ...
- MySQL操作示例
""" MySQL综合练习作业 """ # 1.自行创建测试数据: # 创建数据库 """ create da ...
- 【Codeforces 1031C】Cram Time
[链接] 我是链接,点我呀:) [题意] 题意 [题解] 如果找到最大的n使得1+2+...+n<=a+b 然后第一天输出1,2.3,4....t1 这里1+2+..+t1<=a 这还远远 ...
- POJ 3469 网络流最小割
将两个CPU分别视作源点和汇点 对于那些不在同一个CPU中的模块会产生的代价作为一条双向的容量弧 这里每个模块可以在任意一个CPU中运行,相当于寻找一个割,分割后,在S集合中的模块安装在第一个CPU中 ...
- UVA 1995 I can guess the structer
模 拟 /*by SilverN*/ #include<algorithm> #include<iostream> #include<cstring> #inclu ...
- 【POJ3680】Intervals(费用流)
题意:有n条线段,每条有起点,终点和一个权值 要求选取一些线段,使它们的权值和最大,并且使每一个点被覆盖不超过k次 1 ≤ K ≤ N ≤ 200 1 ≤ ai < bi ≤ 100,000, ...
- CSU - 1115 最短的名字(字典树模板题)
Description 在一个奇怪的村子中,很多人的名字都很长,比如aaaaa, bbb and abababab. 名字这么长,叫全名显然起来很不方便.所以村民之间一般只叫名字的前缀.比如叫'aaa ...