zoukankan      html  css  js  c++  java
  • 地址定位

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>地理位置测试</title>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
    <script type="text/javascript" src="http://developer.baidu.com/map/jsdemo/demo/convertor.js"></script>
    <script type="text/javascript" src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    </head>
    <body>
    <p>
    <button onclick="geoFindMe()">Show my location</button>
    </p>
    <div id="out"></div>
    <div id="xj"></div>
    </body>
    <script>
    if (navigator.geolocation) {
    var output = document.getElementById("out");
    /* 地理位置服务可用 */
    output.innerHTML = '地理位置服务可用';
    } else {
    var output = document.getElementById("out");
    /* 地理位置服务不可用 */
    output.innerHTML = '地理位置服务不可用';
    }

    function geoFindMe() {
    var output = document.getElementById("out");
    var xj = document.getElementById("xj");

    if (!navigator.geolocation) {
    output.innerHTML = "<p>您的浏览器不支持地理位置</p>";
    return;
    }

    function success(position) {
    var latitude = position.coords.latitude;
    var longitude = position.coords.longitude;

    output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';

    var img = new Image();
    img.src = "http://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";

    output.appendChild(img);
    };

    function error(e) {
    console.log(e);
    xj.innerHTML = e.message;
    output.innerHTML = "无法获取您的位置";
    if (e.message == '' || e.message == 'Not found GPS!') {
    output.innerHTML = "无法获取您的位置";
    }
    };

    output.innerHTML = "<p>Locating…</p>";

    navigator.geolocation.getCurrentPosition(success, error);
    }
    </script>
    </html>
  • 相关阅读:
    4.22日日常记录
    ajax再接触
    一些小姿势
    打星功能
    悟透javascript读书笔记
    初接触eclipse和前后端调试问题 待续
    python实现后台员工管理系统
    python实现增删改查操作
    python实现6种方法打印九九乘法表
    python实现猜数字游戏
  • 原文地址:https://www.cnblogs.com/xuanjiange/p/14727700.html
Copyright © 2011-2022 走看看