アプリケーションを作成していますが、ユーザーの場所から最寄りのレンタカーを検索するため、または郵便番号を入力するためにアプリが必要です。現在、スタックオーバーフローに関する以前の投稿を調べたところ、ユーザーの現在の場所を見つける以下が見つかりました。私はこれに慣れていないので、事前に謝罪しますが、ここからデータを表示する方法がわかりません。
<!DOCTYPE html>
<html>
<head>
<title>HTML5 Geolocation</title>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
// Integration with google maps
function loadMap(lat, lng) {
var latlng = new google.maps.LatLng(lat, lng);
var settings = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'), settings);
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: 'Your Position!'
});
document.getElementById('status').innerHTML = 'Position Found!';
}
// Initialize geolocation
function initialize() {
if (navigator.geolocation) {
document.getElementById('status').innerHTML = 'Checking...';
navigator.geolocation.getCurrentPosition(
onSuccess,
onError, {
enableHighAccuracy: true,
timeout: 20000,
maximumAge: 120000
});
}
else {
document.getElementById('status').innerHTML = 'Geolocation not supported.';
}
}
// Map position retrieved successfully
function onSuccess(position) {
var data = '';
data += 'latitude: ' + position.coords.latitude + '<br/>';
data += 'longitude: ' + position.coords.longitude + '<br/>';
data += 'altitude: ' + position.coords.altitude + '<br/>';
data += 'accuracy: ' + position.coords.accuracy + '<br/>';
data += 'altitudeAccuracy: ' + position.coords.altitudeAccuracy + '<br/>';
data += 'heading: ' + position.coords.heading + '<br/>';
data += 'speed: ' + position.coords.speed + '<br/>';
document.getElementById('data').innerHTML = data;
loadMap(position.coords.latitude, position.coords.longitude);
}
// Error handler
function onError(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;
}
document.getElementById('status').innerHTML = message;
}
</script>
</head>
<body onload="initialize()">
<div id="status"></div>
<div id="data"></div>
<div id="map_canvas" style="width: 640px; height: 480px"></div>
</body>
</html>
ユーザーが現在の場所を選択するか、郵便番号を入力したときに、アプリに最寄りのレンタカーのリストを表示するにはどうすればよいですか?
ありがとうございました。