Mikel
[转载]百度地图API详解之移动平台开发的最佳实践 – jz1108 – 博客园.
这是百度地图API详解系列文章的第二篇，主要介绍如何在iPhone和Android平台上使地图API进行开发（这里指的是在浏览器端执行的JavaScript版本API）。
大部分情况下，在iPhone和Android上开发与PC上开发没有两样，开发者调用API的代码都是一样的，这里主要介绍如何针对移动设备的特点更好的开发地图应用，以及介绍一些与移动平台相关的API。
建议移动平台的开发者仔细阅读一遍Safari Web Content Guide和Web Applications系列文章， 他们会告诉你移动Web开发的基本知识。
构建页面
下面我们开始构建移动平台的地图。首先我们声明文档类型为HTML5：
<!DOCTYPE html> |
目前iPhone和Android平台的浏览器都能较好的支持HTML5标准，因此建议移动页面都声明为HTML5文档类型。
接着调整页面的显示比例，在html页面中增加下面的meta标签：
<metaname="viewport"content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/> |
这里将页面的显示比例调整为1:1，并且禁止用户通过双指缩放页面。其中minimum-scale和maximum-scale用来防止在设备旋转时页面发生缩放。下面我们添加地图容器：
<div id="container"></div> |
和样式：
html{height:100%} |
body{height:100%;margin:0px;padding:0px} |
#container{height:100%} |
注意到我们给地图容器指定了100%的宽和高，这样做一方面是让地图区域尽可能 大，方便用户操作；另一方面是因为目前移动版的浏览器的API还不完善，如果地图没有充满屏幕会导致bug（主要是手指操作时位置会出现偏差，如果你的地 图展示不需要移动、缩放，那么不充满屏幕也没有影响）。
接下来我们初始化地图，其实代码和PC上没有差别：
var map = new BMap.Map("container"); // 创建Map实例 |
var point = new BMap.Point(116.404, 39.915); // 创建点坐标 |
map.centerAndZoom(point,15); // 初始化地图，设置中心点坐标和地图级别。 |
你将在iPhone（iPhone3截图）中看到如下效果，即使设备旋转地图也能正常显示：
高解析度
众所周知，iPhone4和iPhone3相比，在同样物理尺寸的情况下，宽度和高度分辨率各扩大了一倍，你会发现同样的地图在iPhone3和iPhone4上显示效果是不同的。下面是iPhone4的屏幕截图（此图为实际尺寸的50%）：
你会发现地图图片有点儿发虚。这是因为iPhone4的屏幕分辨率为960×640，而你的页面尺寸仍旧在480×320模式下，就是说地图图片被拉伸了。为了在iPhone4这样的高分辨率设备上更清晰的展示地图，在创建地图对象时可以通过配置参数开启高解析度模式：
var map = new BMap.Map("container", {enableHighResolution: true}) |
这时再来看iPhone4的效果（这回我们以960×640的实际尺寸展示）：
注意，即使你开启了高解析度模式，在iPhone3等普通屏幕上还是按照原先的样式显示，也就是说只有真正的高分辨率设备才能使用此模式。
在Android平台上，手机种类、型号更为丰富，因此不同的手机的分辨率、物理尺寸都不同，我们可统一使用dpi来衡量，高dpi的手机也可以开启高解析度地图模式。下面是同一设备开启高解析度前后的对比效果（为实际尺寸的50%）：
在高解析度模式下，你所使用的元素（包括HTML元素、图片等）都应该在宽度和高 度上都应该进行扩大，在iPhone4上应各扩大一倍，在Android上应各扩大为原来的1.5倍。否则元素在浏览器中会显得比较小，不论从视觉上还是 操作上都影响用户体验。比如你设置的标注图标大小为23×26，那么在iPhone4的高解析度模式下你的图标尺寸应扩大到46×52。怎么知道地图在用 户的设备上是否真正处于高解析度模式呢？很简单，通过map的highResolutionEnabled方法即可判断。当且仅当你开启了高解析度模式并 且设备确实支持的时候此方法返回true。需要注意的是，在高解析度模式模式下地图图块数量会增加，用户访问的速度以及流量都会受到一些影响。
用户操作
惯性拖拽是个很酷的效果，当用户手指在移动地图后从设备表面抬起的时候，地图还会 根据用户刚才手指的移动方向和力度再移动一小段距离。仿佛整个地图图层具有惯性效果。这个功能通过调用map的 enableInertialDragging方法即可开启。在iPhone上，用户可通过双指对地图进行缩放和移动，你也可以通过map的 enablePinchToZoom来确定是否开启该功能（默认开启）。而在Android平台上，由于目前还没有开放双指操作相关的API，因此建议在 此平台上的地图中增加两个按钮用来控制地图的放大和缩小，同时也需要考虑高解析度模式按钮尺寸的问题。
