编程 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 检测浏览器和操作系统的脚本

Dec 26 Javascript

Javascript Math ceil()、floor()、round()三个函数的区别

Mar 09 Javascript

js预载入和JavaScript Image()对象使用介绍

Aug 28 Javascript

js判断60秒以及倒计时示例代码

Jan 24 Javascript

jQuery使用hide方法隐藏元素自身用法实例

Mar 30 Javascript

javascript中返回顶部按钮的实现

May 05 Javascript

zTree异步加载展开第一级节点的实现方法

Sep 05 Javascript

基于vue中解决v-for使用报红并出现警告的问题

Mar 03 Javascript

react中使用swiper的具体方法

May 15 Javascript

JavaScript闭包原理与用法实例分析

Aug 10 Javascript

koa+jwt实现token验证与刷新功能

May 30 Javascript

从零开始用webpack构建一个vue3.0项目工程的实现

Sep 24 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