Use static resource in Javascript/Google Maps

Question

Anyone know if its possible to use static resources to store the marker image for a VF/Google maps combo, e.g. loading the icon below.

marker = new google.maps.Marker({position: latlng, map: map, title: storeMarkers[i].fascia, icon:"http://labs.google.com/ridefinder/images/mm_20_orange.png"} );

Answer 1

Download the image and upload it as a static resource, e.g. mm_20_orange and the following should work for you

marker = new google.maps.Marker({position: latlng, map: map, title: storeMarkers[i].fascia, icon:"{!$Resource.mm_20_orange}"} );

Answer 2

Any valid path to an image should work.

If the path similar to "{!$Resource.myResourceImage}" works for you (just embed it somewhere else on the page and check if you can reach your image with it. Or within <apex:image value="{!$Resource.myResourceImage}"/>), then

marker = new google.maps.Marker({position: latlng, map: map, title: storeMarkers[i].fascia, icon:"{!$Resource.myResourceImage}"} );

should work too.