Bing必应地图中国API-放大与平移
Bing必应地图中国API-放大与平移
2011-05-24 14:26:32| 分类： Bing&Google|字号 订阅
有些时候我们不希望通过默认的控制栏来控制地图，而是希望能够自定义放大、缩小按钮。比如在显示某公司的位置时，公司老总只希望别人能够以公司位置为中心放大、缩小地图。
所需要做的很简单，增加两个函数：放大和缩小。
function DoZoomIn(c)
{
map.ZoomIn();
}
function DoZoomOut()
{
map.ZoomOut();
}
然后在html boy中增加两个按钮：
<div>
<input type='button' value='放大' onclick='DoZoomIn();' />
<input type='button' value='缩小' onclick='DoZoomOut();'/>
</div>
或者，我们想直接指定地图放大的级别，我们可以另外写一个函数：
function DoZoom()
{
var zoom = document.getElementById('zoomLevel').value;
map.SetZoomLevel(zoom);
}
然后在html body中增加一个输入框让用户输入放大级别，以及一个按钮：
<div>
放大级别:<input id='zoomLevel' type='text' style='width:15px;' value='10' />
<input type='button' value='显示' onclick='DoZoom();' />
</div>
最小放大级别为1，即显示世界地图。最大放大级别为17。此处初始值设置为10，能够显示北京全貌。
最后，完整代码如下：
<!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();
}
function DoZoomIn(c)
{
map.ZoomIn();
}
function DoZoomOut()
{
map.ZoomOut();
}
function DoZoom()
{
var zoom = document.getElementById('zoomLevel').value;
map.SetZoomLevel(zoom);
}
</script>
</head>
<body onload="GetMap();">
<div id='myMap' style="position:relative; width:600px; height:480px;"></div>
<div>
<input type='button' value='放大' onclick='DoZoomIn();' />
<input type='button' value='缩小' onclick='DoZoomOut();'/>
</div>
<div>
放大级别:<input id='zoomLevel' type='text' style='width:15px;' value='10' />
<input type='button' value='显示' onclick='DoZoom();' />
</div>
</body>
</html>
本讲将展现三种平移方式：经纬度直接平移、手动平移，以及连续平移。
首先我们来看一下经纬度直接平移，我们定义一个平移函数：
function PanLatLong(c)
{
var lat = document.getElementById('txtMapLat').value;
var lon = document.getElementById('txtMapLon').value;
map.PanToLatLong(new VELatLong(lat, lon));
}
平移的经纬度从输入框获取，因此需要在html body中增加两个输入框，对应ID分别为txtMapLat和txtMapLon：
<div>
维度:<input id='txtMapLat' style='width: 30px' type='text' value='36' />
经度:<input id='txtMapLon' style='width: 30px' type='text' value='105' />
<input type='button' value='经纬度平移' onclick='PanLatLong();' />
</div>
第二个功能是手动平移，由用户输入以当前地图为中心平移量的大小。同样，我们需要定义一个函数：
function PanXY()
{
var x = document.getElementById('txtMapX').value;
var y = document.getElementById('txtMapY').value;
map.Pan(x,y);
}
我们在html body域增加两个输入框，允许用户输入平移量，ID分别为txtMapX和txtMapY：
<div>
X:<input id='txtMapX' style='width: 30px' type='text' value='1' />
Y:<input id='txtMapY' style='width: 30px' type='text' value='1' />
<input type='button' value='手动平移' onclick='PanXY();' />
</div>
接下来我们看一下连续平移的实现方法。连续平移在很多地方可以应用，比如在线旅游，显示用户旅游线路的时候可以通过连续平移的方法直观显示用户的足迹。此处我们需要定义两个函数：开始平移和结束平移：
function StartContinuous()
{
var x = document.getElementById('txtMapXspeed').value;
var y = document.getElementById('txtMapYspeed').value;
map.StartContinuousPan(x,y);
}
function EndContinuous()
{
map.EndContinuousPan();
}
然后，我们在html body域增加两个按钮，分别对应开始平移和结束平移。并提供一个输入框，允许用户输入连续平移的速度：
<div>
X (speed):<input id='txtMapXspeed' style='width: 30px' type='text' value='1' />
Y (speed):<input id='txtMapYspeed' style='width: 30px' type='text' value='1' />
<input type='button' value='开始连续平移' onclick='StartContinuous();' />
<input type='button' value='结束连续平移' onclick='EndContinuous();' />
</div>
引用：http://www.htchen.com/post/4.html
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:31:20| 分类: Bing&Google|字号 订阅 在必应地图上画线的功能应用也很广泛:显示从出发地到 ...
- Bing必应地图中国API-显示兴趣点 （转）
Bing必应地图中国API-显示兴趣点 2011-05-24 14:29:55| 分类: Bing&Google|字号 订阅 在地图上显示一个兴趣点,这个应用可以说是最简单但是最广泛 ...
- 必应地图api文档，微软必应地图web开发版详解，可以在国内使用国外地图
最近,公司项目要求在页面中嵌入地图,需求还算简单,但是由于必须具备响应式(主要是pc和移动端),而且由于公司业务是全球性的,要支持国外地点搜索.考虑到百度,腾讯,高德等等国内地图无法显示国外数据,谷歌 ...
- 必应(Bing)每日图片获取API
必应(Bing)每日图片获取API January 11, 2015 API http://lab.dobyi.com/api/bing.php 介绍 Value Description title ...
- 必应语音API(Bing text to speech API)
前言 Link : Microsoft Speech API overview 通过这个链接,大致了解Bing speech API的语音识别和语音合成两部分, 这次是需要用到TTS,所以就直接看TT ...
随机推荐
- 浅谈Session的使用（原创）
目录 浅谈Session的使用(原创) 1.引言 2.Session域的生命周期 2.1 Session的创建 2.2 Session的销毁 3.那么,session被销毁后,其中存放的属性不就都访问 ...
- 笔试算法题（43）：布隆过滤器（Bloom Filter）
议题:布隆过滤器(Bloom Filter) 分析: BF由一个很长的二进制向量和一系列随机映射的函数组成,通过多个Hash函数将一个元素映射到一个Bit Array中的多个点,查询的时候仅当所有的映 ...
- Python 函数对象-函数嵌套-名称空间与作用域-闭包函数
今日内容: 1. 函数对象 函数是第一类对象: 指的是函数名指向的值可以被当中数据去使用 1.可以被引用 2.可以当做参数传给另一个函数 3.可以当做一个函数的返回值 4.可以当做容器类型的元素 2. ...
- Spring中操作日志记录web请求的body报文
在spring中,通常可以使用切面编程方式对web请求记录操作日志.但是这种方式存在一个问题,那就是只能记录url中的请求参数,无法记录POST或者PUT请求的报文体,因为报文体是放在request对 ...
- Go：struct
一.使用方式 方式3和方式4返回的是:结构体指针,编译器底层对 p.Name 做了转化 *(p).Name,方便程序员使用. type Person struct { Name string Age ...
- (八)python3 迭代
迭代:如果给定一个 list 或 tuple,我们可以通过 for 循环来遍历这个 list 或tuple,这种遍历我们称为迭代(Iteration) 字典: >>> d = {'a ...
- Linux基础命令回顾
前言 说到linux基础命令,网上一搜一箩筐,想学也有很多教程,如果你不幸看到此篇文章,想看就认真看完,毕竟你点进来了不是嘛? 我每次写的文章都是为了分享自己的学习成果或重要知识点,希望能帮助更多的人 ...
- mysql复制知识整理
主服务器(master)简称M,从服务器(slave)简称S 一.原理: M监听S的复制请求,S创建一个I/O线程以连接M并让它发送记录在其二进制日志中的语句,M接受到请求,创建一个Binlog ...
- [luoguP1981] 表达式求值（U•ェ•*U）
传送门 弄两个栈,一个存数,一个存运算符,然后乱搞. 代码 #include <cstdio> #include <cstring> #include <iostream ...
- Xcode4.5.1破解iOS免证书开发真机调试与ipa发布
开发环境使用Mac OSX Mountain Lion 10.8 + Xcode 4.5.1,iOS设备需要越狱并从Cydia安装AppSync.Xcode4.5.1的安装破解详细步骤如下: 第一步, ...