html5关于定位功能的实现

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <!--meta name="format-detection" content="telephone=no"/>

    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"-->

    <title>定位</title>

    <script type="text/javascript" src="./js/jquery-2.0.3.min.js"></script>

<!--    <link href="./css/style.css" rel="stylesheet" type="text/css"/>-->

    <script>

function getUserLocation(){

        //check if the geolocation object is supported,if so get position

if(navigator.geolocation)

navigator.geolocation.getCurrentPosition(displayLocation,displayError);

else

document.getElementById("locationData").innerHTML="Sorry-your browser doesn‘t support geolocation !";

}


function displayLocation(position){


$.post(‘process.php‘,‘latitude=‘ + position.coords.latitude + ‘&longitude=‘ + position.coords.longitude,function(d){

console.log(d);

var arr = JSON.parse(d);

                    //alert(arr[0].name);

                var x;

                for (x in arr)

                {

                    document.write(‘id:‘+ arr[x].id + ‘ 店名:‘+arr[x].name + ‘ 距离‘+arr[x].distance + ‘ 地址‘+arr[x].address + "<br />")

                }

                //document.getElementById("locationData").innerHTML=arr;

});

}


function displayError(error) {

//get a reference to the HTML element forwriting result

var locationElement =$("locationData");

//find out which error we have, output message accordingly

switch(error.code) {

case error.PERMISSION_DENIED:

locationElement.innerHTML= "Permission was denied";

break;

case error.POSITION_UNAVAILABLE:

locationElement.innerHTML= "Location data not available";

break;

case error.TIMEOUT:

locationElement.innerHTML= "Location request timeout";

break;

case error.UNKNOWN_ERROR:

locationElement.innerHTML= "An unspecified error occurred";

break;

default:

locationElement.innerHTML= "Who knows what happened…";

break;

}

}

</script>

</head>

<body>

<input type="button" value="get location" onclick="getUserLocation()"/>

<div id="locationData">

Location data here

</div>


</body>

</html>


<?php

/**

 * 后台处理

 * 附近分店 API  For 麦当劳

 */

header(‘Content-Type: application/json; charset=utf-8‘);

require "config.php";

require "android_get_mkq_shop_controller.php";


$latitude   = $_REQUEST[‘latitude‘];    //维度

//$latitude   = 39.90403;    //维度

$longitude  = $_REQUEST[‘longitude‘];   //经度

//$longitude  = 116.4075;   //经度

$data = get_mkq_shop($latitude,$longitude);

$memcache = new Memcache;

if ($memcache->connect(‘localhost‘, 11211) && USE_MEMCACHE) {

    $memcache_key = ‘android_mkq_get_mkq_shop‘.$latitude.‘_‘.$longitude;

    if (!$data = $memcache->get($memcache_key)) {

        $data = get_mkq_shop($latitude,$longitude);

        $memcache->set($memcache_key,$data,false,900); // cache time 15 mins

    }

}else{

    $data = get_mkq_shop($latitude,$longitude);

}

echo json_encode($data);

?>



郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。