How do I add custom marker images to Google Maps using the GWT Maps API?

Question

I'm working on a GWT app that's using Google Maps. I'm trying to add many lettered markers to my map. Originally, I had:

Marker marker = new Marker(point);
marker.setImage("http://www.google.com/mapfiles/markerA.png");
map.addOverlay(marker);

But that didn't work. The call to setImage caused an exception in the maps API and nothing showed up on the map. I searched and found some half-answers talking about MarkerOptions, so I tried:

Icon icon = Icon.newInstance(Icon.DEFAULT_ICON);
icon.setImageURL("http://www.google.com/mapfiles/markerA.png");
MarkerOptions ops = MarkerOptions.newInstance(icon);
ops.setIcon(icon);
Marker marker = new Marker(point, ops);
map.addOverlay(marker);

This was a bit better in that my app was not throwing exceptions anymore and I was seeing marker shadows, but still no custom marker images.

I would prefer a non-JSNI solution to this problem.

Thanks!

Answer 1

This sample seems to cover what you want to achieve: IconDemo.java.

// Create our "tiny" marker icon
Icon icon = Icon.newInstance(
    "http://labs.google.com/ridefinder/images/mm_20_red.png");
icon.setShadowURL("http://labs.google.com/ridefinder/images/mm_20_shadow.png");
icon.setIconSize(Size.newInstance(12, 20));
icon.setShadowSize(Size.newInstance(22, 20));
icon.setIconAnchor(Point.newInstance(6, 20));
icon.setInfoWindowAnchor(Point.newInstance(5, 1));

MarkerOptions options = MarkerOptions.newInstance();
options.setIcon(icon);

// LatLng point; MapWidget map;
map.addOverlay(new Marker(point, options));

The live demo can be seen here: http://gwt.google.com/samples/HelloMaps-1.0.4/HelloMaps.html#Creating%20Icons

Answer 2

Here's my new working solution (thx again igro):

Icon icon = Icon.newInstance("http://www.google.com/mapfiles/markerA.png");
icon.setIconSize(Size.newInstance(20, 34));
MarkerOptions ops = MarkerOptions.newInstance(icon);
Marker marker = new Marker(point, ops);
map.addOverlay(marker);