编程 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 相关文章推荐

优化javascript的执行速度

Jan 23 Javascript

jQuery中的.bind()、.live()和.delegate()之间区别分析

Jun 08 Javascript

jQuery文本框(input textare)事件绑定方法教程

Apr 24 Javascript

基于JavaScript 下namespace 功能的简单分析

Jul 05 Javascript

JS常见问题整理(持续更新)

Aug 06 Javascript

jquery.autocomplete修改实现键盘上下键自动填充示例

Nov 19 Javascript

用unescape反编码得出汉字示例

Apr 24 Javascript

百度地图自定义控件分享

Mar 04 Javascript

基于jQuery实现的向下滑动二级菜单效果代码

Aug 31 Javascript

详解JavaScript中|单竖杠运算符的使用方法

May 23 Javascript

新入门node.js必须要知道的概念(必看篇)

Aug 10 Javascript

微信js-sdk预览图片接口及从拍照或手机相册中选图接口用法示例

Oct 13 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