Staffan Estberg
Staffan Estberg

Reputation: 7035

Google Maps custom marker doesn't show up

I have two Google Maps setups on a site that I'm developing, and I want to apply custom markers to both of them. This is what I have written -

    var coordinates_1 = new google.maps.LatLng(x, x);
    var coordinates_2 = new google.maps.LatLng(x, x);
    var map_1_options = {
        zoom: 14,
        center: coordinates_1,
        mapTypeControl: false,
        streetViewControl: false,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map_2_options = {
        zoom: 14,
        center: coordinates_2,
        mapTypeControl: false,
        streetViewControl: false,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var marker_1 = new google.maps.Marker({
        position: coordinates_1, 
        map: map_1,
        icon: '/images/marker.png'
    });
    var marker_2 = new google.maps.Marker({
        position: coordinates_2, 
        map: map_2,
        icon: '/images/marker.png'
    });
    var map_1 = new google.maps.Map(document.getElementById('location_1'), map_1_options);
    var map_2 = new google.maps.Map(document.getElementById('location_2'), map_2_options);

I guess the script can be optimised but that's not the important issue here. What happens is I don't get any error messages (or missing images), and I get both maps displayed at their right location but no markers are showing. The images are 32x32px if that matters. Any help would be appreciated.

Upvotes: 0

Views: 1090

Answers (1)

Dr.Molle
Dr.Molle

Reputation: 117364

You must first create map_1 and map_2 before you use them as map-property for the markers.

Upvotes: 2

Related Questions