PhoneGap Geolocation结合百度地图api获取地理位置api
一、使用百度地图API
1、地址:http://developer.baidu.com/map/
2、在js DEMO中获取反地址解析的DEMO

3、修改这个DEMO的密钥,去创建应用就能创建密钥,然后复制密钥到这个页面即可
4、使用PhoneGap Geolocation 获取地理位置获取到的经度和纬度赋值给point即可
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>phonegap_device_network_notification01</title>
<link href="../jquery.mobile-1.3.2.css" rel="stylesheet" type="text/css"/>
<script src="../jquery.js" type="text/javascript"></script>
<script src="../jquery.mobile-1.3.2.js" type="text/javascript"></script>
<script src="../cordova.js" type="text/javascript"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=17923c0196cbabf7603ea9edabdf787d"></script>
<script type="text/javascript" charset="utf-8"> // 等待PhoneGap加载
document.addEventListener("deviceready", onDeviceReady, false); // 加载完成
function onDeviceReady() {
navigator.geolocation.getCurrentPosition(onSuccess, onError,{ timeout: 100000, enableHighAccuracy: true });
} function onSuccess(position) {
var element = document.getElementById('geolocation');
var latitude=position.coords.latitude ; //纬度
var longitude=position.coords.longitude;//径度 getPosition(longitude,latitude); } // onError 回调函数, 接收包含具体错误信息的PositionError 对象
function onError(error) {
alert('错误代码: ' + error.code + '\n' +
'详细信息: ' + error.message + '\n');
} //根据纬度经度获取详细地址
function getPosition(longitude,latitude){ // 百度地图API功能
var map = new BMap.Map("map");
var point = new BMap.Point(longitude,latitude);
map.centerAndZoom(point,12);
var gc = new BMap.Geocoder(); gc.getLocation(point, function(rs){
var addComp = rs.addressComponents;
alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);
}); } </script> </head>
<style type="text/css">
#map{
width:100%;
height:200px;
}
</style>
<body>
<div data-role="page">
<div data-role="header">
<h1>PhoneGap100实战</h1>
</div>
<div data-role="content" id="map"> </div>
<div data-role="footer">
<h4> </h4>
</div>
</div>
</body>
</html>
PhoneGap Geolocation结合百度地图api获取地理位置api的更多相关文章
- 百度地图一套JS API,非常实用
百度地图一套JS API,非常实用 import mapStyleJson from "./mapStyleJson"; import $ from "jquery&qu ...
- PhoneGap Geolocation 获取地理位置 api
一. PhoneGap Geolocation 对象介绍 1.使应用程序可以访问地理位置信息.geolocation 对象提供了对设备 GPS 传感器的访问.Geolocation 提供设备的位置信息 ...
- Vue 通过调用百度API获取地理位置-经度纬度省份城市
一.首先在百度api注册获得ak密钥 二.新建js文件,我命名为loadBMap.js,里面创建script,代码如下: /** * 加载地图 * @param {Function} callback ...
- html5 geolocation配合百度地图api实现定位
1.了解html5 geolocation HTML5 Geolocation(地理定位)用于定位用户的位置.鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的.=> 使用时 ...
- JS 通过选择百度地图地址获取经纬度自动填充到文本框中的方法
首先要注册百度地图API. 1.登录百度地图开放平台http://lbsyun.baidu.com 注册账号,完善信息,点击网站右上角的“API控制台”,点击,创建应用. 应用类型选择:“浏览器端”, ...
- Android定位&地图&导航——基于百度地图移动获取位置和自动定位
一.问题描述 使用百度地图实现如图所示应用,首先自动定位当前我起始位置(小圆点位置),并跟随移动不断自动定位我的当前位置 百度Api不同版本使用会有些差异,本例中加入lib如下: 二.编写MyAppl ...
- [WPF] 浏览百度地图并获取经纬度地址信息
项目中需要利用登记的区域和地址在百度地图上定位,并获取该地址的经纬度. 本次功能对我来说主要难点如下:1.百度地图API的基本使用方法,请首选使用百度地图的JavaScript大众版(PS:之前使用W ...
- android使用百度地图SDK获取定位信息
本文使用Android Studio开发. 获取定位信息相对简单.我们仅仅须要例如以下几步: 第一步,注冊百度账号,在百度地图开放平台新建应用.生成API_KEY.这些就不细说了,请前往这里:titl ...
- H5调用百度地图API获取地理位置
<script src="http://api.map.baidu.com/api?v=2.0&ak=填入申请的AK"></script> < ...
随机推荐
- [转]Entity Framework Fluent API - Configuring and Mapping Properties and Types
本文转自:https://msdn.microsoft.com/en-us/data/jj591617#1.2 When working with Entity Framework Code Firs ...
- 关于async和await的一些误区
微软的MSDN说async和await是“异步”,但是不少人(包括笔者自己)有一些误区需要澄清:为什么await语句之后没有执行?不是异步吗? [示例代码] public partial class ...
- [编程] C语言变量和数据类型总结练习题
练习题: 1) 如何用 printf() 输出 short.int.long 类型的整数,请举例说明. 2) 如何用 printf() 输出 float.double 类型的小数,请举例说明. 3) ...
- CXF生成客户端遇到的问题
一.CXF环境配置路径错误 1.错误现象 在命令行中输入 wsdl2java -v 检查CXF安装是否正确. 出现错误=> ERROR: Unable to find cxf-manifest. ...
- Boxlayout中button改变大小
需要先设置maximunsize neuStart.setBorder(BorderFactory.createRaisedBevelBorder()); neuStart.setMaximumSiz ...
- 新手学习Java,该从哪里学起?
最近在入坑Java,Java基础知识了解的差不多了,听过很多人的建议,但是从别人那里听到的都是一些比较琐碎的东西,根据打听来的,结合网上自己找到的建议,开始详细地记录一下初学Java,应该掌握哪些具体 ...
- DOM Tree
DOM Tree 什么是DOM树:网页的所有内容在内存当中,其实是以树形结构存储的 何时创建:当浏览器,读取html中内容的时候,会马上开始创建DOM树. 如何创建: 1.读到HTML的时候还没有 ...
- js权威指南学习笔记(一)类型、值和变量
1.数据类型:原始类型(primitive type) 和对象类型(object type) 原始类型包括数字.字符串和布尔值: 除数字.字符串.布尔值.null(空).undefined(未定义), ...
- 新手必需用!大道至简的前端编辑器Sublime Text
很多人在进入学习前端的时候(包括我自己),除了选择学习合适的技术,还需要一个得(自)心(己)应(喜)手(欢)的开发工具,一个得心应手的开发工具除了可以令你的效率大大提高,也可以令你在写代码的时候,心情 ...
- UX2内核浏览加速技术纲要[带你解决WebView卡顿]
UX2内核是本人负责主要开发的浏览服务项目,其主要目的是为开发者提供一个简单好用.轻便的网络浏览服务.UX2内核的安卓端是基于WebView进行深度优化的,同时欢迎大家使用这个内核用于app页面或浏览 ...