Home Ask Login Register

Developers Planet

Your answer is one click away!

Satch3000 February 2016

Iframe Google Map Passing the Geolocation in the url

I am using this code to draw and google map. It works but I'd like to add a tweak where instead of getting a popup to get the geolocation I want to pass it in the url.

Here is the html page:

<!DOCTYPE html>
<html lang="en">
    <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>

        div.location {
             width: 100%;
             height: 400px;
    <div id="page">
        <div class="location"></div>
    <!-- [/page] -->

        (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        


brenzy February 2016

If I understand you question correctly, you can simply pass the parameters into the iframe as described here: How to pass parameters through iframe from parent html?

<iframe src="mywebsiteurlhere/map.html?param=geolocation" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

Post Status

Asked in February 2016
Viewed 1,806 times
Voted 8
Answered 1 times


Leave an answer

Quote of the day: live life