【百度地图API】如何制作孪生姐妹地图?
任务描述:
我想要两张一模一样的地图!我想要双子地图!我想要孪生姐妹地图!
好好好,统统满足大家!
在这里我不需要使用百度地图API提供的地图缩略图控件,而是自己动手做一对双胞胎地图!
如何实现?
创建两张地图,map1和map2,他俩的中心点和地图级别(放大倍数)不同。
当鼠标移动map1的中心点时,map2的中心点会随着一起变化,最终和map1的中心点一致。
同理,可以实现用鼠标滚轮放大缩小地图。
操作试试:
移动左边的地图,右边的地图会随着一起运动;
对左边的地图使用鼠标滚轮(中键),右边的地图也会放大或者缩小。
图示:

运行代码,请点击这里。
代码:

代码
map2.centerAndZoom(point2,12); // 初始化地图map2,让地图级别和map1一致。
map1.addEventListener("moveend",function(){map2.panTo(map1.getCenter());}); //让map2跟着map1走
map1.addEventListener("zoomend",function(){map2.zoomTo(map1.getZoom());}); //让map2的地图等级与map1一致
map1.enableScrollWheelZoom(); // 启用滚轮放大缩小
</script>
</html>
【百度地图API】如何制作孪生姐妹地图?的更多相关文章
- 【百度地图API】如何制作商圈地图?行政地图?
原文:[百度地图API]如何制作商圈地图?行政地图? 摘要: 想要显示某一个区域,并且鼠标放上去,该区域就会变色.这时,你就需要巧用多边形覆盖物,和它的鼠标事件了! 快来看看去哪儿网的实例吧:http ...
- 【高德地图API】汇润做爱地图技术大揭秘
原文:[高德地图API]汇润做爱地图技术大揭秘 昨日收到了高德地图微信公众号的消息推送,说有[一大波免费情趣用品正在袭来],点进去看了一眼,说一个电商公司(估计是卖情趣用品的)用高德云图制作了一张可以 ...
- 百度地图API详解之自定义地图类型
http://blog.csdn.net/sup_heaven/article/details/8461586 今天的文章主要介绍如何利用地图API实现自定义地图. 百度地图API目前默认支持两种地图 ...
- android菜鸟学习笔记31----Android使用百度地图API(二)获取地理位置及地图控制器的简单使用
1.获取当前地理位置: Android中提供了一个LocationManager的类,用于管理地理位置.不能通过构造函数获取该类的实例,而是通过Context的getSystemService(): ...
- 【百度地图API】制作多途经点的线路导航——路线坐标规划
一.创建地图 首先要告诉大家的是,API1.2版本取消密钥,取消服务设置,大家可以采用更加简短的方式引用API的JS啦~ <script type="text/javascript&q ...
- 通过百度地图API显示当前位置在地图上(图标显示)--第三方开源--百度地图(二)
1.下载百度地图的demo,下载地址:http://lbsyun.baidu.com/sdk/download?selected=mapsdk_basicmap,mapsdk_searchfuncti ...
- jvectormap地图开发和制作任意国家地图
jvectormap官网上提供了世界地图和很多国家的地图,但不是所有国家的地图都有,比如沙特阿拉伯的国家地图就没有,怎么办呢? 在http://www.amcharts.com/svg-maps/上下 ...
- 【百度地图API】如何制作自定义样式的公交导航结果面板?
原文:[百度地图API]如何制作自定义样式的公交导航结果面板? 摘要: 百度地图API有默认的公交导航结果面板,但样式比较单一:而百度地图上的结果面板就比较美观.如何利用百度地图API来制作一个比较美 ...
- 乐卡上海网点地图制作心得 | 百度地图API使用心得
前言 事情的起因是我的爱人喜欢收集一些美丽的乐卡(明信片的一种,正面是美丽壮阔的风景照).作为一个坚实的后盾自然要支持她!于是我经常借着午休穿梭在大街小巷,凭借乐卡官方提供的乐卡网点地址进行寻找并取卡 ...
随机推荐
- 花生壳宣布网站的网址直接绑定到详细的项目——jboss版本
花生壳公布,首先要有域名.然后激活域名,详细的公布就不说了,网上有非常多资料,这里是在jboss下直接将网址与详细的项目相应.做法有点不地道 假设跟图上一样配置的话.訪问网址相当于訪问的是http:/ ...
- 无法使用Django新建项目:'django-admin.py'不是内部或外部命令
问题: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbXlhdGxhbnRpcw==/font/5a6L5L2T/fontsize/400/fill/I0 ...
- web 环境项目(intellj部署的tomcat) 重启时报 Exception in thread "HouseKeeper" java.lang.NullPointerException (转)
Exception in thread "HouseKeeper" java.lang.NullPointerException at org.logicalcobwebs.pro ...
- poj 1274The Perfect Stall
第一次接触二分图匹配. 这题是一个匈牙利算法的模板题直接套即可. 题意是 给你奶牛和谷仓的个数a和b,接下来a行是奶牛喜欢去的谷仓.第一个是谷仓个数,接下来是谷仓编号. 这里我们把行当奶牛,列当谷仓 ...
- Java单链逆转
本文介绍两种方法单向链表反转.记录,如下面: 1. package com.leetcode; public class ListReverse { public static void main(S ...
- 深入浅出java并发
http://www.blogjava.net/xylz/archive/2010/07/08/325587.html
- 最大流量dinci模板
我们知道.增广路径EK时间是在充电算法的O(n*m^2).找到最短增广路径的时间复杂度为O(m*n^2).这样的时间复杂度主要是寻找扩充道路. 这里也有一个演示Dinci算法,使用BFS层次结构图,然 ...
- Androids含文档erver结束(工具包 Httputils)两
在同server在...的基础上,本文client还登录界面 Andriod简单http get请求基础上,用户注冊后跳转到下载界面,本文下载界面仅仅有两个View,一个是textView显示注冊后u ...
- Ajax基础知识(二)
接上一篇 Ajax基础知识(一) 在上一篇博客里,抛弃了VS中新建aspx页面,拖个button写上C#代码的方式.使用ajax的方式,异步向服务器请求数据.我们让服务器只简单的返回一个" ...
- 有趣 IOS 开展 - block 使用具体解释
Block 它是iOS于4.0新的程序语法之后,于iOS SDK 4.0之后,block应用几乎无处不在. 在其他语言中也有类似的概念,称为闭包(closure),实例object C兄弟swift ...