利用HBuilder开发基于MUI的H5+ app中使用百度地图定位功能
定位功能有两种方法:
首先要初始化内置地图:
var map = new plus.maps.Map("map");
这里黄色的map是html里面的id:
<div id="map">地图加载中...</div>
1、调用GPS定位API(注意,使用了baidu和bd09ll参数,无需转换坐标)
plus.geolocation.getCurrentPosition(function(p) {
console.log(p.addresses);
console.log( p.coords.longitude);
console.log( p.coords.latitude);
var gpsPoint = new plus.maps.Point( p.coords.longitude, p.coords.latitude);
map.centerAndZoom(gpsPoint, 19);
}, function(e) {}, {
provider: 'baidu',
coordsType: 'bd09ll'
});
2、使用h5+内置地图进行定位。
map.getUserLocation(function(state, pos) {
console.log(JSON.stringify(pos));
if(0 == state) {
map.centerAndZoom(pos, 16);
plus.maps.Map.reverseGeocode(pos, {}, function(event) {
var address = event.address; // 转换后的地理位置
var point = event.coord; // 转换后的坐标信息
var coordType = event.coordType; // 转换后的坐标系类型
alert("Address:" + address);
console.log(JSON.stringify(point));
console.log(coordType);
}, function(e) {
alert("Failed:" + JSON.stringify(e));
});
}
});
扫一扫关注,一起学编程:

利用HBuilder开发基于MUI的H5+ app中使用百度地图定位功能的更多相关文章
- 【MUI】百度地图定位功能
博主最近进行一款APP开发,需要用到定位功能,经过一番折腾,终于搞定,不废话,代码如下 mui.plusReady(function() { var longitude, latitude; //va ...
- MUI框架---实现百度地图定位功能
1 2 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak= ...
- mui --- 怎么获取百度地图定位功能
<!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...
- Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图
标签: Android百度地图API Key 分类: Android 百度地图开发(2) 最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地 ...
- 基于mui的H5套壳APP开发web框架分享
前言 创建一个main主页面,只有主页面有头部.尾部,中间内容嵌入iframe内容子页面,如果在当前页面进行跳转操作,也是在iframe中进行跳转,而如果点击尾部按钮切换模块.页面,那就切换ifram ...
- Android开发之清除缓存功能实现方法,可以集成在自己的app中,增加一个新功能。
作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985 Android开发之清除缓存功能实现方法,可以集成在自己的app中,增加一个新功能. 下面是一个效果图 ...
- 移动端app跳转百度地图
http://lbsyun.baidu.com/index.php?title=uri/guide/helloworld(百度地图调起URI API)开发者只需按照接口规范构造一条标准的URI,便可在 ...
- Android 百度地图定位(手动+自动) 安卓开发教程
近由于项目需要,研究了下百度地图定位,他们提供的实例基本都是用监听器实现自动定位的.我想实现一种效果:当用户进入UI时,不定位,用户需要定位的时候,自己手动点击按钮,再去定位当前位置. 经过2天研究 ...
- 客户端相关知识学习(一)之混合开发,为什么要在App中使用H5页面以及应用场景、注意事项
混合开发 随着移动互联网的高速发展,常规的开发速度已经渐渐不能满足市场需求.原生H5混合开发应运而生,目前,市场上许多主流应用都有用到混合开发,例如支付宝.美团等.下面,结合我本人的开发经验,简单谈一 ...
随机推荐
- wasserstein 距离
https://blog.csdn.net/nockinonheavensdoor/article/details/82055147 注明:直观理解而已,正儿八经的严谨证明看最下面的参考. Earth ...
- axaj 的回调
//为了动态生成表格获取数据用ajax获取servlet回调数据 <script> $.ajax({ url = "servlet地址", type : "p ...
- DDMS 使用方法
一.真机调试的两个必备条件 (1)手机打开开发者模式并且运行USB调试 (2)PC上装好手机对应的驱动 二.DDMS(DalvikDebugMonitorServer)四个主要窗口 Devices:当 ...
- http://ctf.bugku.com/challenges#Easy_Re
今天做一道逆向题,开心,见证了自己汇编的用途. 首先看它是否加壳? 1.加壳检测 是vc编程的,没有加壳,可以愉快地分析了. 2.分析程序,找到flag. 首先运行一下子程序, ...
- Java05-Java基础语法(四)循环结构
Java05-Java基础语法(四)循环结构 循环结构(重复/迭代):根据条件重复执行部分语句 1.while循环结构 while(条件表达式){ 循环体语句; } 1)语法:a.while是关键字 ...
- FragmentManager V4包下 应该用FragmentActivity
import android.os.Bundle; import android.support.v4.app.FragmentActivity; public class MainActivity ...
- 函数的有用信息,装饰器 day12
一 函数的有用信息 本函数的功能:绘图功能,实时接收数据并绘图.:return: 绘图需要的数据,返回给前端某标签 def f1(): ''' 本函数的功能:绘图功能,实时接收数据并绘图. :retu ...
- Vue 1.0 和 2.0 执行顺序
// Vue 生命周期 // Vue 1.0 // 执行步骤:选项/生命周期钩子 // 1 init // 2 created // 3 beforeCompile // 4 compiled // ...
- mybatis入门--单表的增删改操作
单表的增加操作 前面我们看了如何搭建mybatis框架以及查询操作,这里我们说下如何使用mybatis进行增加用户的操作.首先是在user.xml文件中添加insert的方法.代码如下 <!-- ...
- 解决sublime3不能编辑插件default settings的问题
一.遇见问题 今天给sublime安装了View In Browser,想更改一下默认启动的浏览器 preferences-Package settings-View In Browser-setti ...