编程 Javascript

javascript使用百度地图api和html5特性获取浏览器位置

Posted in Javascript onJanuary 10, 2014

<!DOCTYPE html>
<html>
<body>
<p id="demo">点击这个按钮，获得您的位置：</p>
<button onclick="getLocation()">试一下</button>
<script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>
<script>
var x=document.getElementById("demo");
function getLocation(){
    if(navigator.geolocation){
       navigator.geolocation.getCurrentPosition(showPosition);
      }else{
       alert("您的浏览器不支持地理定位");
      }
   }
function showPosition(position){
    lat=position.coords.latitude;
    lon=position.coords.longitude;
    //var map = new BMap.Map("container");            // 创建Map实例
    var point = new BMap.Point(lon, lat);    // 创建点坐标
    //map.centerAndZoom(point,15);                     // 
    //map.enableScrollWheelZoom(); 
    var gc = new BMap.Geocoder();    
    gc.getLocation(point, function(rs){
       var addComp = rs.addressComponents;
       alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street);
      });
   }
</script>
</body>
</html>

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

改进：论坛UBB代码自动插入方式

Dec 22 Javascript

JQuery 绑定事件时传递参数的实现方法

Oct 13 Javascript

jQuery 工具函数学习资料

Apr 29 Javascript

简单的jquery左侧导航栏和页面选中效果

Aug 21 Javascript

Jquery中find与each方法用法实例

Feb 04 Javascript

jQuery改变form表单的action,并进行提交的实现代码

May 25 Javascript

javascript 操作cookies详解及实例

Feb 22 Javascript

AngularJS使用ocLazyLoad实现js延迟加载

Jul 05 Javascript

详解如何在react中搭建d3力导向图

Jan 12 Javascript

webpack打包node.js后端项目的方法

Mar 10 Javascript

JS函数节流和防抖之间的区分和实现详解

Jan 11 Javascript

Vue.js 实现地址管理页面思路详解(地址添加、编辑、删除和设置默认地址)

Dec 11 Javascript

javascript通过className来获取元素的简单示例代码

Jan 10 #Javascript

深入理解JSON数据源格式

Jan 10 #Javascript

文本框(input)获取焦点(onfocus)时样式改变的示例代码

Jan 10 #Javascript

Script标签与访问HTML页面详解

Jan 10 #Javascript

浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法

Jan 10 #Javascript

JQuery中使用Ajax赋值给全局变量异常的解决方法

Jan 10 #Javascript

jquery和javascript中如何将一元素的内容赋给另一元素

Jan 09 #Javascript