原文:【百度地图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】如何激发手机的高分辨率的更多相关文章

  1. html5中高德、腾讯、百度 地图api调起手机app

    html 部分 <div id="mapBg"> <div class="mapTab"> <a href="" ...

  2. 【百度地图API】手机浏览器抓包工具及其使用方法

    原文:[百度地图API]手机浏览器抓包工具及其使用方法 摘要:为了测试地图API在手机浏览器上的性能,需要给手机浏览器设置代理.通过代理,我们可以在PC上获取到抓包数据.进而对性能做进一步分析. -- ...

  3. 用百度地图API打造方便自己使用的手机地图

    有钱人咱就不说了,因为偶是个穷银--因为穷,所以去年买的Huawei C8650+到现在还在上岗,对于没有钱买好的配置的手机的童鞋来说,类似于百度,谷歌,高德等商家的地图在自己的机器上跑起来确实是有点 ...

  4. 使用html5获取当前手机的经纬度,并接入百度地图API,查询出当前位置

    最近项目需要,稍微研究一下html5获取当前地理位置的问题. 获取当前位置的经纬度很简单,一句代码就搞定 navigator.geolocation.getCurrentPosition(functi ...

  5. 百度地图API和高德地图API资料集锦

    [高德地图API]从零开始学高德JS API(五)路线规划——驾车|公交|步行   [高德地图API]从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自 ...

  6. 安卓调用百度地图api 错误 mcode参数不存在

    自己的手机app里用到了百度地图sdk,希望根据手机获得的坐标来逆向到百度地图的坐标. 根据api文档拼写了url,因为是移动端,说是要添加mcode参数,然后我的url看起来如下: http://a ...

  7. 如何在网页中调用百度地图api

    我想在木有提供地图接口的年代,前端工程师门要么只写上企业的具体地址,要么就是用一张标有自己位置的地图图片.但是现在不一样啦!为了增强用户体验,谷歌,甚至百度都很开放了,你可以在他们的网站上找到地图接口 ...

  8. 百度地图api(摘自百度)

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  9. 网页百度地图API相关资料

    百度地图API——网页URI接口.手机网页点击直接导航:js生成一个地图网页 或 直接跳转到百度导航界面 http://developer.baidu.com/map/index.php?title= ...

随机推荐

  1. MonkenRunner通过HierarchyViewer定位控制的方法和建议(Appium/UIAutomator/Robotium侣)

    1. 背景 正在使用MonkeyRunner当我们经常使用Chimchat下面HierarchyViewer模块获得目标控制的一些信息,以协助我们测试.但在MonkeyRunner官方的说法是没有看到 ...

  2. 妈蛋:kinMaxShow旋转木马异常,WebUploader图片上传坑爹,图像被压缩

    今天晚上在改造轮播图. 原来的代码是这种: <div> <img src="${static}/image/index/banner/`.jpg" /> & ...

  3. String.format()【演示具体的例子来说明】

    String.format()[演示样例具体解释] 整理者:Vashon 前言: String.format 作为文本处理工具.为我们提供强大而丰富的字符串格式化功能,为了不止步于简单调用 Strin ...

  4. javascript动画中的“帧”

    在写游戏的时候,动画移动的速度需要保持一致,为了在各个软硬件环境中速度的一致,需要考虑帧频的不同. 计算时间系数: 时间系数 = 目标FPS / 实际FPS 计算实际FPS actualFPS = 1 ...

  5. 【Android基础】listview控件的使用(3)------Map与SimpleAdapter组成的多显示条目的Listview

    前面介绍的两种listview的使用都是最基础的,所以有很大的局限性,比如只能在一个item(即每一行的条目)中显示一个文本信息,这一篇我将介绍Map与SimpleAdapter组成的多显示条目的Li ...

  6. MonkeyRunner源代码分析Android通信设备

    正如前面<谁动了我的截图?--Monkeyrunner takeSnapshot方法源代码跟踪分析>所述,本文主要会尝试描写叙述android的自己主动化測试框架MonkeyRunner到 ...

  7. JAVA中的super和this关键字的使用

    一 this关键字 this关键字可以出现在构造方法和实例方法中,不能出现在静态方法中,这是因为静态方法可以用类名来调用,这时可能还没有任何对象诞生. this主要有两种用法: 1 用在构造方法中,调 ...

  8. Flynn初步:基于Docker的PaaS台

    Flynn它是一个开源PaaS台,无论要部署的应用程序,你可以建立自己的主动性Docker容器集群的实现,能特性与组件设计大量參考了传统的PaaS平台Heroku.本文旨在从使用动机.基本对象.层次架 ...

  9. Ceph 存储集群

    Ceph 存储集群 Ceph 作为软件定义存储的代表之一,最近几年其发展势头很猛,也出现了不少公司在测试和生产系统中使用 Ceph 的案例,尽管与此同时许多人对它的抱怨也一直存在.本文试着整理作者了解 ...

  10. 小丁带你走进git的世界三-撤销修改(转)

    一.撤销指令 git checkout还原工作区的功能 git reset  还原暂存区的功能 git clean  还没有被添加进暂存区的文件也就是git还没有跟踪的文件可以使用这个命令清除他们 g ...