-1
Я использую этот код для рисования и карты google. Он работает, но я хотел бы добавить настройки, вместо того, чтобы всплывать, чтобы получить геолокацию, я хочу передать ее в URL-адресе.Iframe Google Map Передача геолокации по URL-адресу
Вот HTML-страница:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>HTML5 Geo Location API</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=myApiKeyHere&sensor=true"></script>
<style>
div.location {
width: 100%;
height: 400px;
}
</style>
</head>
<body>
<div id="page">
<div class="location"></div>
</div>
<!-- [/page] -->
<script>
(function ($) {
$.fn.GeoLocation = function(options) {
var settings = $.extend({
home: { latitude: 52.89770, longitude: -1.15596 },
}, options);
var home = new google.maps.LatLng(settings.home.latitude, settings.home.longitude);
return this.each(function() {
var element = $(this);
element.text('Attempting to find your location');
function displayCurrentPosition(data) {
element.html('<div class="map-canvas"></div>');
var current = new google.maps.LatLng(data.coords.latitude, data.coords.longitude);
var options = {
center: current,
mapTypeId: google.maps.MapTypeId.HYBRID,
zoom: 10,
};
var map = new google.maps.Map(element[0], options);
var directions = {
origin: current,
destination: home,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
display = new google.maps.DirectionsRenderer({ map: map });
service = new google.maps.DirectionsService();
service.route(directions, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
display.setDirections(response);
}
else
alert ('failed to get directions');
});
}
function onError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
element.text('Access to location API denied by user');
break;
case error.POSITION_UNAVAILABLE:
element.text('Unable to determine location');
break;
case error.TIMEOUT:
element.text('Unable to determine location, the request timed out');
break;
case error.UNKNOWN_ERROR:
element.text('An unknown error occurred!');
break;
}
}
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(displayCurrentPosition, onError);
} else {
element.text('Geolocation is not supported by this browser, please upgrade to a more recent version');
}
});
};
}(jQuery));
jQuery(document).ready(function() {
jQuery('div.location').GeoLocation();
});
</script>
</body>
</html>
А вот как я называю это:
<iframe src="mywebsiteurlhere/map.html" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
Как я могу это сделать?
связанный с этим вопрос: [Как я могу получить значения строки запроса в JavaScript?] (HTTP://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript) – geocodezip