使用html5 地理位置技术 和 百度地图api查询当前位置

使用了  zepto  和 requirejs

define([‘zepto‘],function($){
 var geolocation = {
        init:function(config,onSuccess,onError){
            if(typeof(config)==‘function‘){
                onError = onSuccess;
                onSuccess = config;
                config = undefined;
            }

            if(Object(config)===config){
                for(var k in this.option){
                    this.option[k] = config[k];
                }
            }

            if(typeof(onSuccess)==‘function‘){
                this.onSuccess = onSuccess;
            }

            if(typeof(onError)==‘function‘){
                this.onError = onError;
            }

            return this;
        },

          getPosition:function(returnType){//returnType==cityName,返回城市名称
                  var host = this;
                 navigator.geolocation.getCurrentPosition(function ( position){
                         console.log(‘getCurrentPosition success ‘,position);
                        if(!returnType){
                              host.onSuccess.call(null,position);
                          }else{
                              var lat = position.coords.latitude;
                            var lng = position.coords.longitude;

                            var urls="http://api.map.baidu.com/geocoder/v2/?ak=0QoBGmQ4i5N0FycRCQMukgqd&callback=renderReverse&location="+lat+","+lng+"8&output=json&pois=0";

                            $.ajax({
                                type: "POST",
                                url: urls,
                                dataType : "jsonp",
                                success: function(data){
                                    //alert(JSON.stringify(data));
                                    //alert(host.onSuccess)
                                    console.log(‘get city name>>>‘,data);
                                    host.onSuccess.call(null,data);
                                },
                                error:function(error){
                                    host.onError.call(null,error);
                                }

                             });
                          }

                    }, function(error){

                        host.onError.call(null,error);
                    }, this.option);

                 return this;
          },
          option:{
                enableHighAccuracy: true,
                maximumAge: 30000,
                timeout: 20000
          },
          onSuccess: function(data){
              console.log(‘geolocation.getCurrentPosition success:‘,data);
          },
          onError:function(error){
              console.log(‘geolocation.getCurrentPosition error:‘,error);
          }

 };

return geolocation;

});
时间: 2024-11-09 17:54:24

使用html5 地理位置技术 和 百度地图api查询当前位置的相关文章

HTML5页面直接调用百度地图API,获取当前位置,直接导航目的地(转)

HTML5页面直接调用百度地图API,获取当前位置,直接导航目的地 我是应用在微信中,自定义菜单,菜单直接链接到这个HTML5页面,获取当前位置后,页面中定好目的地,这样打开页面后直接进入导航页面 可以省下先发送位置信息后,点确定再出导航,省一步, <!DOCTYPE html> <html lang="zh-cmn-Hans"> <meta charset="UTF-8"> <meta name="viewpor

HTML5地理定位,百度地图API,知识点熟悉

判断浏览器的兼容问题: IE9+支持地理定位,FF Chrome新版支持地理定位  if (navigator.geolocation) { alert('支持地理定位'); } else { alert('不支持地理定位'); } 获取自己位置经纬度 <script> var x=document.getElementById("wrap"); function getLocation () { if (navigator.geolocation) { navigator

HTML5 利用百度地图API获取当前位置

由于项目需要定位到城市,研究了地理定位,做了一些手记,和大家分享一下~ 项目的开发需求是获取到当前用户的位置,然后为用户提供一些服务. 此时可以采用两种定位方式,一种是用GPS的定位,然后将定位到的经纬度传递到百度地图的API接口当中.另一种方法是利用百度API接口,使用IP地址定位,然后使用IP地址获取到的经纬度,传递到百度地图API接口中. 自己尝试使用了这两种方式进行定位.相对来说,IP地址定位,偏差比较大.GPS定位虽然还可以,但是也不足够精确.产生比较大偏差的原因有可能是以下几点造成的

利用百度地图API获取当前位置信息

利用百度地图API可以做很多事情,个人感觉最核心也是最基础的就是定位功能了.这里分享一个制作的JS可以实现登录网页后定位: 1 <script type="text/javascript"> 2 var map; 3 var gpsPoint; 4 var baiduPoint; 5 var gpsAddress; 6 var baiduAddress; 7 var x; 8 var y; 9 function getLocation() { 10 //根据IP获取城市 1

百度地图API定位+显示位置

1. 先在需要嵌入地图的页面引入map.js <script src="http://api.map.baidu.com/api?v=2.0&ak=你的秘钥"></script> 2. 地图定位并显示位置信息 // 百度地图API功能 var map = new BMap.Map("allmap"); var point = new BMap.Point(116.331398,39.897445); map.centerAndZoom

通过百度地图API显示当前位置在地图上(图标显示)--第三方开源--百度地图(二)

1.下载百度地图的demo,下载地址:http://lbsyun.baidu.com/sdk/download?selected=mapsdk_basicmap,mapsdk_searchfunction,mapsdk_lbscloudsearch,mapsdk_calculationtool,mapsdk_radar 2.把demo里面的BaiduMapsApiDemo解压,把BaiduMapsApiDemo文件夹里面的libs里面的所有文件都复制到自己的项目的libs里面 3.配置Andro

html5移动端根据百度地图api获取详细地址

<script type="text/javascript" src="js/BMap.js" ></script> <script type="text/javascript"> // 扩展API是否准备好,如果没有则监听"plusready"事件 if(window.plus){ plusReady(); }else{ document.addEventListener( "p

C#请求百度地图API 查询经纬度 摆脱js

public class BaiduPosition { public int status { get; set; } public Result result { get; set; } } public class Result { public Location location { get; set; } public int precise { get; set; } public int confidence { get; set; } public string level {

用百度地图API分析打交通大数据

百度地图API, 文档不全,例子不细致. 在网上还没有太多有用的例子.比如说下面几个需求的解决方案就找不到: 1. 如何用百度地图API查询一个地点的经纬度. 2. 如何用百度地图通过一个经纬度查询商圈和地址. 3.点击百度地图时, 获得点击位置的经纬度. 4. 如果按照时间轴动态显示热力图的变化. 我昨天玩了一下午百度地图javascript API,解决了上面的几个问题,顺道用少量打车用户的抽样数据做一个数据可视化, 给大家提供一个可以参考的例子 首先数据是来自北京市某个周日的出行数据, 其