H5结合百度map实现GPS定位
前言
目前我们做m端时都会用到定位,当用户第一次打开h5页面时会启动gps定位,并结合百度map来查找城市。按照我们的逻辑思路就是gps定位获取经纬度,传到后台调用百度的一个接口查找城市名称。
1、查询得到城市名称,我们根据城市名称在我们自己的数据库里再查询对应的城市id(查询会很频繁,可以基于xml 缓存查询,也可以放到redis里)
2、为了保险起见,我们也会在自己的库里根据经纬度维护一套城市信息,防止接口不可用时不影响定位。
H5 GPS定位
  (function () {
         var
             isGeolocation = false,
             lat = 0,
             lng = 0,
             coords = null;
         if (navigator.geolocation) { isGeolocation = true; };
         if (isGeolocation) {
             function getPosSuccess(position) {
                 coords = position.coords;
                 lat = coords.latitude, lng = coords.longitude;
                 $.ajax({
                     type: 'GET',
                     dataType: 'json',
                     url: '/Home/GetPositionArea',
                     data: { 'lat': lat, 'lng': lng },
                     success: function (data) {
                     }
                 });
             };
             function getPosError(err) {
                 switch (err) {
                     case err.PERMISSION_DENIED:
                         console.log("您拒绝了共享位置,可手动选择城市。");
                         break;
                     case err.POSITION_UNAVAILABLE:
                         console.log("无法获取当前位置");
                         break;
                     case err.TIMEOUT:
                         console.log("获取位置超时");
                         break;
                     default:
                         console.log("未知错误");
                         break;
                 }
             };
             navigator.geolocation.getCurrentPosition(getPosSuccess, getPosError, null);
         } else {
         };
     })();
结合百度接口查询具体城市
public JsonResult GetPositionArea(decimal lng, decimal lat)
{
string api =
string.Format(
"http://api.map.baidu.com/geocoder/v2/?output=json&ak=XXXXX&location={0},{1}",
lat, lng); //传入自己的业务参数ak string result = HttpRequestHelper.Get(api); return Json(result, JsonRequestBehavior.AllowGet);
}
H5结合百度map实现GPS定位的更多相关文章
- 手机版的百度map封装,使用gps定位
		代码如下,包自己引 包参考 一个百度MAP导航的基础封装 使用的是浏览器调用gps定位 修改了标注的大小 效果如图: 代码...... <!DOCTYPE html> <html&g ... 
- 如何利用【百度地图API】进行定位?非GPS定位
		原文:如何利用[百度地图API]进行定位?非GPS定位 如果你可以上网,如果你有火狐浏览器,那么恭喜你.你能很容易使用以下代码进行定位! ------------------------------- ... 
- GPS定位为什么要转换处理?高德地图和百度地图坐标处理有什么不一样?
		GPS定位为什么要转换处理?高德地图和百度地图坐标处理有什么不一样? 先了解一下 高德地图 采用: GCJ-02 (不可逆) 百度百科: http://baike.baidu.com/link?url ... 
- 使用百度地图结合GPS进行定位
		本文在上文基础上加入GPS定位功能,实现实时定位,代码如下: Activity: package com.home; import android.app.Activity; import andro ... 
- ionic基于GPS定位并通过百度地图获取定位详细信息
		相信所有的前端攻城狮都会碰到移动端App.里面获取用户定位信息. 那么问题来了,怎么获取用户的定位信息(经纬度)呢. 当然方法有很多,通过百度地图API 以及 高德地图 API都是可以的.但是两个获取 ... 
- android 基于百度地图api开发定位以及获取详细地址
		一:百度地图开发必须要到百度开发平台android开发api下载相应的库,已经申请百度地图开发key. 二:新建项目baidumaplocation.设计main.xml文件这里注意的是MapView ... 
- Android开发之位置定位详解与实例解析(GPS定位、Google网络定位,BaiduLBS(SDK)定位)
		在android开发中地图和定位是很多软件不可或缺的内容,这些特色功能也给人们带来了很多方便.定位一般分为三种发方案:即GPS定位.Google网络定位以及基站定位 最简单的手机定位方式当然是通过GP ... 
- Android学习--  基于位置的服务  LBS(基于百度地图Android SDK)--定位SDK
		原文:Android学习-- 基于位置的服务 LBS(基于百度地图Android SDK)--定位SDK 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.ne ... 
- 在iOS APP中使用H5显示百度地图时如何支持HTTPS?
		现象: 公司正在开发一个iOSAPP,使用h5显示百度地图,但是发现同样的H5页面,在安卓可以显示出来,在iOS中就显示不出来. 原因分析: 但是现在iOS开发中,苹果已经要求在APP中的所有对外连接 ... 
随机推荐
- js 定时更改div背景图片
			今天遇到一个业务场景,使用js将一个div标签的背景图片定时更换一下. 之前百度了几个,有css+js,也有css3的,不过css3的兼容有问题,之后同事提示,可以使用js直接来更换div的北京图片, ... 
- 第四次spring会议
			昨天:对TXT的字体颜色和背景进行了代码编写. 出现的问题:在网上找到如何编写代码后,自己打进去了,输出不出来.少打了一个空格在EventArgs e之间. 今天将做之事: 我设置上换肤和透明度等功能 ... 
- python基础循环
			1.使用while循环输入1234568910 n = 1 while n < 11: if n == 7: pass else: print(n) n = n + 1 2.求1 - 100的所 ... 
- Noxim Overview
			PE+Router= Tile Node Architectural Elements: Buffer.h, Router.h, LocalRoutingTable.h, Tile.h, NoC.h, ... 
- springmvc接收数组方式总结
			1.接受正常的数组 如param1=aaa¶m1=bbb¶m1=3 对于这种,在实体参数中,使用String param1[] 这种参数既可以获取数组的值 2.接受数组 ... 
- C++中的return和exit区别
			在main函数中,return和exit经常混用,两者的一个区别:return会执行statck unwinding,而exit不会.如果触发了信号,exit也同样不会做stack unwinding ... 
- utf-8转gb2312
			近日在对一个json串进行转码时,显示中文乱码,原因是json串编码方式为utf-8,而我程序在windows上采用的是多字节编码方式,即采用gb2312编码.这里就存在一个utf-8到gb2312的 ... 
- 背水一战 Windows 10 (89) - 文件系统: 读写文本数据, 读写二进制数据, 读写流数据
			[源码下载] 背水一战 Windows 10 (89) - 文件系统: 读写文本数据, 读写二进制数据, 读写流数据 作者:webabcd 介绍背水一战 Windows 10 之 文件系统 读写文本数 ... 
- Linux下的redis的持久化,主从同步及哨兵
			redis持久化 Redis是一种内存型数据库,一旦服务器进程退出,数据库的数据就会丢失, 为了解决这个问题,Redis提供了两种持久化的方案,将内存中的数据保存到磁盘中,避免数据的丢失. RDB持久 ... 
- 深圳scala-meetup-20180902(2)- Future vs Task and ReaderMonad依赖注入
			在对上一次3月份的scala-meetup里我曾分享了关于Future在函数组合中的问题及如何用Monix.Task来替代.具体分析可以查阅这篇博文.在上篇示范里我们使用了Future来实现某种non ... 
