百度地图API详解之移动平台开发的最佳实践
这是百度地图API详解系列文章的第二篇，主要介绍如何在iPhone和Android平台上使地图API进行开发（这里指的是在浏览器端执行的Javascript版本API）。
大部分情况下，在iPhone和Android上开发与PC上开发没有两样，开发者调用API的代码都是一样的，这里主要介绍如何针对移动设备的特点更好的开发地图应用，以及介绍一些与移动平台相关的API。
建议移动平台的开发者仔细阅读一遍Safari Web Content Guide和Web Applications系列文章， 他们会告诉你移动Web开发的基本知识。
构建页面
下面我们开始构建移动平台的地图。
首先我们声明文档类型为HTML5：
1
目前iPhone和Android平台的浏览器都能较好的支持HTML5标准，因此建议移动页面都声明为HTML5文档类型。
接着调整页面的显示比例，在html页面中增加下面的meta标签：
1
maximum-scale=1.0, user-scalable=no"/>
这里将页面的显示比例调整为1:1，并且禁止用户通过双指缩放页面。其中minimum-scale和maximum-scale用来防止在设备旋转时页面发生缩放。下面我们添加地图容器：
1
和样式：
1
2
3 html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
注意到我们给地图容器指定了100%的宽和高，这样做一方面是让地图区域尽可能大，方便用户操作；另一方面是因为目前移动版的浏览器的API还不完善，如果地图没有充满屏幕会导致bug（主要是手指操作时位置会出现偏差，如果你的地图展示不需要移动、缩放，那么不充满屏幕也没有影响）。
接下来我们初始化地图，其实代码和PC上没有差别：
百度地图 API
百度地图API应用实例
Michael Tian 百度地图API应用实例说明文档
2 / 21
目录
百度地图 API ............................................................................................................................ 3
1基础知识 ................................................................................................................................ 3
1.1 百度地图 API 概念 ..................................................................................................... 3
1.2 百度地图的“Hello, World” ................................................................................... 3
1.2.1 引用百度地图API文件 ....................................................................................... 5
1.2.2创建地图容器元素 ................................................................................................ 5
1.2.3命名空间 ................................................................................................................ 5
使用百度地图JavaScript API开发旅游线路设计与行程定制系统
□朱小兰
【摘 要】【内容摘要】在日常的课堂教学过程中，我们是无法进行实际线路设计的评价、考核与展现的，因此，引入现代的信息技术手段、利用互联网络作为平台进行旅游线路设计与行程定制系统的课堂教学系统软件的开发就很有必要性。本系统的开发利用百度地图API 接口，全方位展现了旅游线路在现实生活中的分布以及参考时间、价位、车程等综合信息，在教师演示、学生设计、作业评价等方面让课堂与现实更紧密地结合在一起，以现实为导向，更好地给需求者一个直观印象。
【期刊名称】产业与科技论坛
【年(卷),期】2015(000)003
【总页数】2
【关键词】【关键词】百度地图JavaScript API;旅游线路设计;课堂教学
随着人们生活水平的提高，越来越多的人们选择利用假期进行旅游。旅游专业的学生在今后从事旅游行业的可能性是比较大的，因此，学会如何设计旅游线路就很有必要性。无论学生今后是从事导游工作还是旅行社相关事务安排，让学生了解一条符合旅游者需求的线路是如何设计的，该条线路的设计理念是什么，从中可以获利多少，怎样以最少的成本支出吸引旅游者等都需要在日常的课堂教学中让学生学习到，从而为他们今后更好工作打下基础。但是在日常的课堂教学过程中，我们是无法进行实际线路设计的评价、考核与展现的，因此，引入现代的信息技术手段、利用互连网络作为平台进行旅游线路设计与行程定
制系统的课堂教学系统软件的开发就很有必要性。
一、百度地图JavaScript API 概述
百度地图JavaScript API 是一套由JavaScript 语言编写的应用程序接口，该套API 免费对外开放，包含了构建地图基本功能的各种接口。利用该套API 接口可以在网站中构建功能丰富、交互性强的地图应用。自v1.5 版本起，需先申请密钥才可使用，接口(除发送短信功能外)无使用次数限制。获取JavaScript API
百度文库 - 让每个人平等地提升自我
0 百度地图说明文档
1.界面展示
界面整体分为4部分，主地图显示区、鼠标测距地图区、按钮与输入区、结果面板区。
主地图显示区用于除测距以外的功能显示，鼠标测距地图区只用于鼠标测距，结果面板区显示部分查询结果。
功能实现包括基本操作功能：鼠标滚轮放大、缩小、全图、拖拽平移、卫星地图切换、鼠标测距，其他功能有
（1） 定位查询（输入经纬度坐标在图上查询具体位置）
（2） 经纬度坐标获取（鼠标点击获取图上经纬度坐标）
（3） 快速查询（不同行政区级别点击查询缩放到当前位置，通过城市定位和关键字提示实现）
（4） 关键词查询（输入查询内容将查询结果显示到控制面板和图上）
（5） 覆盖物叠加（点击按钮将覆盖物添加到图上）
（6） 删除覆盖物（点击按钮删除覆盖物，包括关键字查询、路线查询在图上显示的覆盖物，用于清除查询结果，便于二次查询）
（7） 信息窗口（点击图上点覆盖物弹出信息窗口）
（8） 地址解析/逆解析、添加点线面（直接选用工具条上按钮进行绘制）
（9） 编辑功能（点击按钮开启/关闭编辑）
（10） 获取绘制的覆盖物个数，清除所有覆盖物
（11） 步行路线规划（包括地图上显示和结果面板显示）
（12） 驾车路线规划（信息窗口显示驾车所需时间和行驶距离，地图和结果面板显示路线）
（13） 公交车和地铁路线查询（输入公交车或地铁号，在结果面板显示经过的站点及发车信息）
（14） 公交车出行路线规划（地图上显示路线）
（15） 输入时关键字提示
（16） 右下角打开路况提示
以下为部分功能实现效果截图 百度文库
- 让每个人平等地提升自我
1
关键字查询（结果显示在地图上）
关键字查询结果显示在结果面板
步行路线规划 百度文库
- 让每个人平等地提升自我
2
驾车路线规划
公交车和地铁路线站点查询，结果显示在查询面板
公交路线规划 百度文库 - 让每个人平等地提升自我
