【百度地图API】如何激发手机的高分辨率
摘要：不少用户使用百度地图API开发在移动浏览器上的应用时发现，明明自己的手机是高分辨率的，但是显示出来的地图却比较模糊，甚至“看不清楚”。接下来，我们要学习如何激发手机浏览器的高分辨率功能。
--------------------------------------------------------------------------------
以安卓手机为例，我们使用PhoneGap来写一段API代码。
代码A：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Phonegap+API</title>
<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
<style type="text/css">
#container{height:300px;width:300px;padding:0;margin:0;border:1px solid red;}
</style>
</head>
<body>
展示上海市地图
<div id="container"></div>
</body>
</html>
<script type="text/javascript">
var map = new BMap.Map("container");
map.centerAndZoom("上海",12);
</script>
大家注意，地图容器的高宽均为300px。
这个实验的测试用机是HTC G7。屏幕分辨率为762*480。
从eclipse的log里也能看出G7的分辨率，如下图：
那么代码A运行出来是什么样子呢？
运行出来之后，让大家大吃一惊，“怎么满屏了呢？”
如下图：
如何解决高低分屏的分辨率问题？
因为HTC G7已经属于高分辨率的屏幕了，所以普通级别不适合它。
大家有没有注意代码A里这句话：
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
“user-scalable=no”是为了禁止用户放大缩小浏览器窗口内的东西。因为百度地图API提供了双指放大缩小地图的功能。
所以，同理，我们在这里加上“target-densitydpi=device-dpi”，就可以让设备显示自身的分辨率了。
类似的，还有“width=device-width”，自动调整设备宽度。
我们再来看看加上这段代码之后的效果图：
地图缩小了吧。这才是HTC G7真实分辨率~
记得，要用以下代码，设备就能显示正常的分辨率了哦~
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
附PhoneGap安卓开发指南：http://www.phonegap.cn/?page_id=442#android
【百度地图API】如何激发手机的高分辨率的更多相关文章
- html5中高德、腾讯、百度 地图api调起手机app
html 部分 <div id="mapBg"> <div class="mapTab"> <a href="" ...
- 【百度地图API】手机浏览器抓包工具及其使用方法
原文:[百度地图API]手机浏览器抓包工具及其使用方法 摘要:为了测试地图API在手机浏览器上的性能,需要给手机浏览器设置代理.通过代理,我们可以在PC上获取到抓包数据.进而对性能做进一步分析. -- ...
- 用百度地图API打造方便自己使用的手机地图
有钱人咱就不说了,因为偶是个穷银--因为穷,所以去年买的Huawei C8650+到现在还在上岗,对于没有钱买好的配置的手机的童鞋来说,类似于百度,谷歌,高德等商家的地图在自己的机器上跑起来确实是有点 ...
- 使用html5获取当前手机的经纬度，并接入百度地图API，查询出当前位置
最近项目需要,稍微研究一下html5获取当前地理位置的问题. 获取当前位置的经纬度很简单,一句代码就搞定 navigator.geolocation.getCurrentPosition(functi ...
- 百度地图API和高德地图API资料集锦
[高德地图API]从零开始学高德JS API(五)路线规划——驾车|公交|步行 [高德地图API]从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自 ...
- 安卓调用百度地图api 错误 mcode参数不存在
自己的手机app里用到了百度地图sdk,希望根据手机获得的坐标来逆向到百度地图的坐标. 根据api文档拼写了url,因为是移动端,说是要添加mcode参数,然后我的url看起来如下: http://a ...
- 如何在网页中调用百度地图api
我想在木有提供地图接口的年代,前端工程师门要么只写上企业的具体地址,要么就是用一张标有自己位置的地图图片.但是现在不一样啦!为了增强用户体验,谷歌,甚至百度都很开放了,你可以在他们的网站上找到地图接口 ...
- 百度地图api（摘自百度）
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- 网页百度地图API相关资料
百度地图API——网页URI接口.手机网页点击直接导航:js生成一个地图网页 或 直接跳转到百度导航界面 http://developer.baidu.com/map/index.php?title= ...
随机推荐
- 《Linux Device Drivers》第十六章 块设备驱动程序——note
基本介绍 块设备驱动程序通过主传动固定大小数据的随机访问设备 Linux核心Visual块设备作为基本设备和不同的字符设备类型 Linux块设备驱动程序接口,使块设备最大限度地发挥其效用.一个问题 一 ...
- 阿里2015回顾面试招收学历（获得成功offer）
1. 引言 继上次"百度2015校园招聘面试题回顾录(成功拿到offer)"文章过后,大家都希望除了题目之外.最好能给出自己当时的回答情况,看看有没有什么回答技巧,这样更有參考价值 ...
- 在eclipse中启动tomcat时报错：could not create java virtual machine... a fatal error...
控制台报错:unrecoginzed option: --launcher XXMaxPermSize 解决方法:-〉 perference -> tomcat ->JVM setting ...
- 软体project（两）——软体project
每本书的第一章,都是在讲宏观的东西.软工也不例外.接下来.我们就要介绍软件project"是什么"的问题. 一.是什么? watermark/2/text/aHR0cDov ...
- jquery：ajax不接收返回值回
html页面a加元素的假设href=javasrcipt:void(0)会导致ajax没有收到回后台值. : <p class="chatmsg_load_more"> ...
- SQLServer RESOURCE_SEMAPHORE 等待状态
原文:SQLServer RESOURCE_SEMAPHORE 等待状态 概述: 当一个SQLServer实例运行得很慢的时候,应该做一些检查,如检查等待状态.最好的方法是一开始就建立一个性能基线,以 ...
- 有JSON中字段最好是【字符】而非【enum】想到
最近听了牛人一句: 1,如果协议中定义了tag的话,协议的解析就不会依赖到变化,那么开发的话也更为独立. eg: good: name=“zl”, gender=“f” bad: name=" ...
- Linux下find命令具体解释
1. find命令 linux的find命令用来查找文件,功能非常强大, 能够通过时间, 用户组, 文件名称, 文件类型, 权限,大小等来查找对应文件. 2. find的使用方法 通过find --h ...
- C#+Mapxtreme 实现一些GIS系统基本的功能
此程序包括了mapxtreme地图相关基本功能的演示其中包括 鹰眼地图,图层控制,发达,缩小,平移地图,地图模糊查询,中点工具,距离测量工具,面积测量工具,图元信息查看工具.适合于企业级开发,可以为您 ...
- SharePoint 2013 禁用搜索服务
原文:SharePoint 2013 禁用搜索服务 前言,在SharePoint2013中,对于硬件需求的提升,让我们虚机里安装总是一筹莫展,尤其开启了搜索服务以后,对于内存的消耗就更加严重,尤其对于 ...