CODEWITHSUNDEEP
jsongoogle-mapsgoogle-maps-api-3maps
Ian Gooch
Ian Gooch

Reputation: 53

Adding custom icons with Google Maps using JSON

I can't get a custom icon to display using this code below. It just defaults to the default Google maps marker.

Any ideas where I'm going wrong?

$(function() {
$('#map_canvas').gmap({ 
'center':new google.maps.LatLng(54.5,-4.0),
'zoom':6, 
'streetViewControl': false,
'callback': 


function() {
setInterval( function() {       
$.getJSON( 'URL/data_sets/json/sfuk47.php?'+ new     Date().getTime(), 'category=activity',    function(data) { 
$.each( data.markers, function(i, m) {
$('#map_canvas').gmap(
'addMarker',{
'position': new google.maps.LatLng(m.lat, m.lng) });
});             
});
}, 5000);                               
}
});
}); 

 setInterval( function() {
$.ajax({
url:'URL/data_sets/json/sfuk47.php',
success: function(data) {
if (data == "refresh"){
window.location.reload();
}
}
});
}, 600000);

The JSON {"markers":[ {"lat":59.889,"lng":1.249,"icon":"URL/icons/gl_icons/Red.png"},{"lat":59.892,"lng":1.235,"icon":"URL/icons/gl_icons/Red.png"},{"lat":56.778,"lng":-5.702,"icon":"URL/icons/gl_icons/Red.png"},{"lat":49.534,"lng":-1.814,"icon":"URL/icons/gl_icons/Red.png"},{"lat":56.608,"lng":-8.324,"icon":"URL/icons/gl_icons/Red.png"},{"lat":49.286,"lng":-2.183,"icon":"URL/icons/gl_icons/Red.png"},{"lat":49.289,"lng":-2.192,"icon":"URL/icons/gl_icons/Red.png"},{"lat":59.051,"lng":-7.525,"icon":"URL/icons/gl_icons/Red.png"},{"lat":58.965,"lng":-7.439,"icon":"URL/icons/gl_icons/Red.png"},{"lat":57.531,"lng":-6.895,"icon":"URL/icons/gl_icons/Red.png"}, {"lat":56.895,"lng":-6.372,"icon":"URL/icons/gl_icons/Red.png"}]}

Many thanks,

Upvotes: 0

Views: 1295

Answers (1)

ChrisSwires
ChrisSwires

Reputation: 2723

At first glance you're not setting the icon in the markers call. Try doing:

'addMarker',{
'position': new google.maps.LatLng(m.lat, m.lng),
'icon': m.icon });

But be aware you appear to be using API v2 which is deprecated.

Some relevant examples for API V3.

Upvotes: 1

Related Questions