Google places API icons

I work with the Google Places API (http://code.google.com/apis/maps/documentation/places/). I would like to use the icons that Google conveys as part of the places result set, but they look huge and off scale.

According to Google’s docs on the Marker object, the Marker.setIcon method should automatically scale the image to fit the map.

I am using something like this:

var marker = new google.maps.Marker({ map: map, position: place.geometry.location }); marker.setIcon(place.icon); 

and it works, but the image does not scale. It seems about a square of ~ 75 pixels, no matter what. I also tried writing this image to a new MarkerImage object, which I could scale, but that seems pretty complicated.

Is there any trick to displaying the icon image correctly?

+4
source share
2 answers

Well, I had no ideas, so I went ahead and created a new MarkerImage object and scaled it. It works fine, not quite elegant, but here it is:

 // pass in the place object returned by the Google Place API query function createPlace(place){ var gpmarker = new google.maps.MarkerImage(place.icon, null, null, null, new google.maps.Size(25, 25)); var marker = new google.maps.Marker({ map: map, position: place.geometry.location, title: place.name, icon: gpmarker }); } } 
+7
source

Updated way to do this:

 var image = { url: place.icon, size: new google.maps.Size(71, 71), origin: new google.maps.Point(0, 0), anchor: new google.maps.Point(17, 34), scaledSize: new google.maps.Size(25, 25) }; 
+5
source

All Articles