定位功能有两种方法:

首先要初始化内置地图:

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中使用百度地图定位功能的更多相关文章

  1. 【MUI】百度地图定位功能

    博主最近进行一款APP开发,需要用到定位功能,经过一番折腾,终于搞定,不废话,代码如下 mui.plusReady(function() { var longitude, latitude; //va ...

  2. MUI框架---实现百度地图定位功能

    1 2 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak= ...

  3. mui --- 怎么获取百度地图定位功能

    <!doctype html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. Android 百度地图开发(一)--- 申请API Key和在项目中显示百度地图

      标签: Android百度地图API Key  分类: Android 百度地图开发(2)    最近自己想研究下地图,本来想研究google Map,但是申请API key比较坑爹,于是从百度地 ...

  5. 基于mui的H5套壳APP开发web框架分享

    前言 创建一个main主页面,只有主页面有头部.尾部,中间内容嵌入iframe内容子页面,如果在当前页面进行跳转操作,也是在iframe中进行跳转,而如果点击尾部按钮切换模块.页面,那就切换ifram ...

  6. Android开发之清除缓存功能实现方法,可以集成在自己的app中,增加一个新功能。

    作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985 Android开发之清除缓存功能实现方法,可以集成在自己的app中,增加一个新功能. 下面是一个效果图 ...

  7. 移动端app跳转百度地图

    http://lbsyun.baidu.com/index.php?title=uri/guide/helloworld(百度地图调起URI API)开发者只需按照接口规范构造一条标准的URI,便可在 ...

  8. Android 百度地图定位(手动+自动) 安卓开发教程

    近由于项目需要,研究了下百度地图定位,他们提供的实例基本都是用监听器实现自动定位的.我想实现一种效果:当用户进入UI时,不定位,用户需要定位的时候,自己手动点击按钮,再去定位当前位置.  经过2天研究 ...

  9. 客户端相关知识学习(一)之混合开发,为什么要在App中使用H5页面以及应用场景、注意事项

    混合开发 随着移动互联网的高速发展,常规的开发速度已经渐渐不能满足市场需求.原生H5混合开发应运而生,目前,市场上许多主流应用都有用到混合开发,例如支付宝.美团等.下面,结合我本人的开发经验,简单谈一 ...

随机推荐

  1. Ext.js多文件选择上传,

    工作了之后来到了一家用Ext.js的公司, 一开始的时候做项目, 我被分给一个做一个单表的增删改查, 再加上文件上传功能, 带我的老师让我自己研究一下Ext.js怎么多文件选择上传, 并且能获取到上传 ...

  2. idea使用maven打包jar包

    1.在pom.xml中加入以下内容: <?xml version="1.0" encoding="UTF-8"?> <project xmln ...

  3. mysql垂直分区和水平分区

    数据库扩展大概分为以下几个步骤: 1.读写分离:当数据库访问量还不是很大的时候,我们可以适当增加服务器,数据库主从复制的方式将读写分离: 2.垂直分区:当写入操作一旦增加的时候,那么主从数据库将花更多 ...

  4. 问题1:设置了text-overflow : ellipsis未起作用

    <style type="text/css"> * { padding: 0; } .div01 , .div02 { margin-top: 10px; border ...

  5. windows+nginx+tomcat实现集群负载均衡(生产环境必读)

    概念理解(原文链接) 集群:多个tomcat服务器运行同一个web服务就能称之为集群 负载均衡:apache按照一定方式将不同的客户端访问分配到不同的tomcat服务器 简单负载均衡实现: 网上参考了 ...

  6. xcode 更新svn/Git后发现模拟器显示No Scheme问题

    这个是由于XXX..xcodeproj包中xcuserdata文件夹中user.xcuserdatad文件夹名字的问题...user.xcuserdatad文件夹的名字,不是当前用户的名字,就会显示n ...

  7. webpack.dev.conf.js

    var utils = require('./utils')var webpack = require('webpack')var config = require('../config') // 一 ...

  8. php5.6 版本出现 Automatically populating $HTTP_RAW_POST_DATA is deprecated and will be removed in a future version 的错误

    解决方法是修改php.ini配置: ;always_populate_raw_post_data = -1 把前面的分号去掉 always_populate_raw_post_data = -1 然后 ...

  9. 【gRPC使用问题4】

    1.进行gRPC服务调用出错:服务不可用 2.解决方案: linux系统部署的节点服务的确不可用,愿意是 系统是泡在虚拟机里面, 计算核数只有一核,太小,服务没有跑起来.

  10. [z]分区truncate操作的介绍及对全局索引和空间释放影响的案例解析

    [z]https://www.2cto.com/database/201301/181226.html 环境: [sql] [oracle@localhost ~]$ uname -r 2.6.18- ...