【百度地图API】关于如何进行城市切换的三种方式

原文:【百度地图API】关于如何进行城市切换的三种方式

摘要:本文介绍了三种切换城市的方式:查询城市、城市列表和显示城市轮廓。

---------------------------------------------------------------------

很多API爱好者问到我,如何像百度地图那样,实现各个城市之间的切换呢?

在这里,公布以下三种方式。

第一种,是查询城市的方法。使用API接口的LocalSearch方法。我之前写过完整的文章,请查看:

http://www.cnblogs.com/milkmap/archive/2010/12/22/1914106.html

 

 

另外,如果不想显示红色的标注,和信息窗口。可以尝试以下代码:

API1.2,利用localsearch找到第一个结果的经纬度,然后重新设置地图中心点。

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>西单</title><script type="text/javascript" src="http://api.map.baidu.com/api?v=1.2"></script></head><body><div style="width:520px;height:340px;border:1px solid gray" id="container"></div></body></html><script type="text/javascript">var map = new BMap.Map("container");map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);

function myFun(){var pp = local.getResults().getPoi(0).point;    map.centerAndZoom(pp, 18);}var local = new BMap.LocalSearch(map, {  onSearchComplete: myFun});local.search("西单");</script>

============================================================

 

 

 

 

 

 

上面这种方式有个缺陷,就是会显示出查询城市的红色标注,还有一个信息窗口。由于百科没有该城市的数据,这个信息窗口里还没有该城市的描述。

 可不可以去掉标注,还有信息窗口呢?我只想切换城市呢。

接下来,就介绍一下第二种方法,点选城市列表,切换城市。

查看源代码,运行示例,请点击http://www.ui-love.com/baidumap/city/selectCity.htm (服务器原因,可能打开速度较慢,请耐心等待)

 

 

代码请看官网的libaray中的“城市列表”:http://dev.baidu.com/wiki/map/index.php?title=MapLibrary

===========================================================================

 

 

 

 

 

 

 

 

第三种,显示城市轮廓。最后这种方法我比较喜欢,当你切换城市的时候,可以显示出这个城市的轮廓。点击运行:http://www.ui-love.com/baidumap/city/Boundary.html

你只需要简单地使用Bounds这个类就可以了。

var bdary =new BMap.Boundary();
bdary.get(“山东省”, function(rs){
console.log(rs);//rs是返回的结果
});

 

 

注意,以下提供的boundary代码是API1.1版本的,仅为参考。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>获取地区轮廓线</title><script type="text/javascript" src="http://api.map.baidu.com/api?key=46ce9d0614bf7aefe0ba562f8cf87194&v=1.1&services=true"></script><style type="text/css">body{font-size:13px;margin:10px}#container{width:800px;height:500px;border:1px solid gray}</style></head><body><div id="container"></div><br />输入省、直辖市或县名称:<input type="text" id="districtName" style="width:80px" value="山东省"><input type="button" onclick="getBoundary()" value="获取轮廓线">

<script type="text/javascript">

if (typeof console == "undefined"){  window.console = {log: function(){}};}

var map = new BMap.Map("container");map.centerAndZoom(new BMap.Point(116.403765, 39.914850), 5);var stdMapCtrl = new BMap.NavigationControl({type: BMAP_NAVIGATION_CONTROL_SMALL})map.addControl(stdMapCtrl);map.enableScrollWheelZoom();map.enableContinuousZoom();

function getBoundary(){       var bdary = new BMap.Boundary();var name = document.getElementById("districtName").value;    bdary.get(name, function(rs){        console.log(rs);        map.clearOverlays();

var bounds;var maxNum = -1, maxPly;

var count = rs.boundaries.length; for(var i = 0; i < count; i++){var ply = new BMap.Polygon(rs.boundaries[i], {strokeWeight: 2, strokeColor: "#ff0000"});            map.addOverlay(ply);  

var arrPts = ply.getPoints();if(arrPts.length > maxNum){                maxNum = arrPts.length;                maxPly = ply;            }

}

if(maxPly){            map.setViewport(maxPly.getPoints());        }

});   }

</script></body></html>
时间: 2024-10-22 04:51:09

【百度地图API】关于如何进行城市切换的三种方式的相关文章

求asp.net城市切换思路,两种方式

问题描述 求asp.net城市切换思路,两种方式 我现在要做一个城市切换,第一次直接根据IP跳转,第二次可以任意切换到任何城市,请问怎么写啊! 解决方案 .net 遍历Dictionary两种方式asp.net 两种会话数据方式 解决方案二: 点击手动设置的城市的时候用cookie记录住点击的城市,页面dom ready事件中从cookie中读取城市,没有就从ip定位,否则加载cookie中城市的数据

Android中使用百度地图API:城市POI搜索-获取所有结果

本文主要讲解如何通过百度地图API搜索得到一个城市里的所有POI.这里有必要对"所有"这个词进行强 调一下,以便引起重视,之所以这样说,是因为在搜索POI时,默认仅返回一页的搜索结果10条,那么如何才 能得到所有的搜索结果呢?其实baidu map api是提供了相关的方法,但我发现有相当多的网友都在问这个问 题,所以有必要讲解演示一下. 先讲一下什么称之为"城市POI搜索"?它与我们在上一篇文章([011] 百 度地图API之POI搜索-发现你身边的兴趣点,如超市

【百度地图API】暑假放假回老家——城市切换功能

原文:[百度地图API]暑假放假回老家--城市切换功能 任务描述: 酸奶小妹放寒假啦,要从北京呼啦一下飞回重庆呢.现在百度地图API上不能直接切换城市,怎么办呢?   如何实现: 利用API先搜索到要去城市,然后再让搜索到的城市显示在地图中心点. (百度地图上的实现方式是,给后端一个请求,后端返回该城市的经纬度)   图示:   运行代码:请点击这里   代码:   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&

【百度地图API】百度API卫星图使用方法和卫星图对比工具

原文:[百度地图API]百度API卫星图使用方法和卫星图对比工具 百度地图API推出卫星图接口也有一个月啦~   本文除了介绍如何使用百度地图API来操作卫星图外,还顺带制作了个卫星图对比工具.   一.百度地图API卫星图 调用百度卫星图有两种方式,一是地图类型控件,一是地图底图设置.下面分别介绍这两种方法:   1.利用控件 使用控件有一大优势,就是地图类型控件上,有百度全部的地图类型,比如二维.三维.卫星等. 而且,只需要一句话,就能简单加上这个控件. map.addControl(new

百度地图api如何使用_javascript技巧

如果想用百度地图api,首先需要先获取一个百度地图api的密钥,然后引入百度地图的api,接下来,我们详细介绍下获取.引入api密钥的技巧,以及通过代码给大家详解下百度地图api如何使用,具体请看下文. 首先 ,如果想调用百度地图api,你需要获取一个百度地图api的密钥. 申请密钥很简单,在百度地图api的首页就有相关链接,填写相关信息百度就会给你一个密钥了. 接下来,就是引入百度地图的api 关键代码如下: 复制代码 代码如下: <script type="text/javascrip

【百度地图API】建立全国银行位置查询系统(二)——怎样为地图添加控件

原文:[百度地图API]建立全国银行位置查询系统(二)--怎样为地图添加控件 <摘要>你将在第二章中学会以下知识: 使用手写代码的利器--notepad++: 如何为地图添加控件--鱼骨.鹰眼.比例尺.2D3D转换控件.版权控件. ----------------------------------------------------------------------------------------------------------------- 一.安装配置notepad++ 为什么

Android中使用百度地图API:公交换乘方案搜索

这是我写的第3篇介绍调用百度地图API搜索服务的文章,所以对搜索前要做的其它工作不再介绍,再加上 代码中的注释也对相关的操作.方法做了尽可能详细的说明,所以直接看示例吧. 1)布局文件 res/layout/main.xml <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/andro

Android中使用百度地图API:根据经纬度查询地址信息

百度地图移动版API不仅包含构建地图的基本接口,还集成了众多搜索服务,包括:位置检索.周边检索. 范围检索.公交检索.驾乘检索.步行检索.地址信息查询等. 百度地图移动版API提供的搜索服务主要是 通过初始化MKSearch类,注册搜索结果的监听对象MKSearchListener来实现异步搜索服务.首先需要自定义一 个MySearchListener类,它实现MKSearchListener接口,然后通过实现接口中不同的回调方法,来获得对应的 搜索结果.MySearchListener类的定义

百度地图api根据服务器坐标定位

问题描述 百度地图api根据服务器坐标定位 // 取本地经纬度 myLatitude = location.getLatitude(); myLongitude = location.getLongitude(); city = location.getCity(); stNode = PlanNode.withLocation(new LatLng(myLatitude, myLongitude)); enNode = PlanNode.withCityNameAndPlaceName(cit