Skip to content Skip to sidebar Skip to footer

How To Show A Map Focused On A Marker Using A Click Event On Google Maps Javascript Api V3?

I created a map that focuses on a user's location. The map has a single marker with an info window. When a user clicks on the info window it gives him a hyperlink to an info page (

Solution 1:

What about using a hash in the url?

Try using "http://students.example.com/test.html#one":

$(function() {

    var places = {
        one: [40.59622788325198, -73.50334167480469],
        two: [50.59622788325198, -71.50334167480469]
    };

    var div = $('#map-canvas');

    var map = new google.maps.Map(div.get(0), {
        center: map,
        zoom: 9,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    var markers = {};

    $.each(places, function(name) {

        markers[name] = new google.maps.Marker({
            position: new google.maps.LatLng(this[0], this[1]),
            map: map
        });

    });

    var place = location.hash.substr(1);

    if(place in places) {

        map.setCenter(markers[place].getPosition());

    }

});

Post a Comment for "How To Show A Map Focused On A Marker Using A Click Event On Google Maps Javascript Api V3?"