モバイル デバイスでユーザーの位置情報を取得してデータベースに送信し、jquery 関数を実行してマップ上にポインターをプロットします。
ただし、ユーザーの場所を更新する前にマップが常に読み込まれるようです。つまり、場所は以前に設定されたものです。
getGeoLocation は、正しい場所でデータベースを更新する関数ですが、jquery 関数の後にのみ実行されます。これを回避することはできません...呼び出しが行われた後にのみマップをロードするにはどうすればよいですか?
<script>
$(document).ready(function(){
getGeoLocation();
alert('map');
var result = JSON.parse('<?php usersWithinRadius(); ?>');
$('#map').gmap3({
marker:
{
values: result,
},
map:
{
options:
{
zoom:12,
mapTypeControl: false,
navigationControl: true,
streetViewControl: false
}
}
});
});
</script>
getGeoLocation が参照するコードは次のとおりです。
//Initialize geolocation
function getGeoLocation()
{
if(navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(
recordGeoLocation,
geoLocationErrorHandler, {
enableHighAccuracy: true,
timeout: 20000,
maximumAge: 120000
}
);
return true;
}
else
{
alert('Geolocation not supported');
return false;
}
}
//Map position retrieved successfully
function recordGeoLocation(position)
{
var data = new Object();
data.latitude = position.coords.latitude;
data.longitude = position.coords.longitude;
/** Other data
data.altitude = position.coords.altitude;
data.accuracy = position.coords.accuracy;
data.altitudeAccuracy = position.coords.altitudeAccuracy;
data.heading = position.coords.heading;
data.speed = position.coords.speed;
**/
recordUserGeoLocation(data.latitude, data.longitude);
}
//Send the latitude and longitude to database
function recordUserGeoLocation(latitude, longitude)
{
var BASE_URL = $('#BASE_URL').val();
var ajaxURL = BASE_URL + 'ajax/recordUserGeoLocation/';
$.ajax({
type: 'POST',
url: ajaxURL,
data: {
latitude: latitude,
longitude: longitude
},
dataType: 'json',
success: function(data){
//The record has been added
console.log('Recorded location: ' + latitude + ' , ' + longitude);
alert('Recorded location: ' + latitude + ' , ' + longitude);
}
});
}
//Error handler
function geoLocationErrorHandler(err)
{
var message;
switch(err.code)
{
case 0:
message = 'Unknown error: ' + err.message;
break;
case 1:
message = 'You denied permission to retrieve a position.';
break;
case 2:
message = 'The browser was unable to determine a position: ' + error.message;
break;
case 3:
message = 'The browser timed out before retrieving the position.';
break;
}
alert(message);
}