开发者

gwt-maps -- dynamically change marker offset

开发者 https://www.devze.com 2023-02-03 01:32 出处:网络
At my site, http://www.foodtrucksmap.com/, the marker sizes are determined by the number of 开发者_开发百科open food trucks in that city.The problem is that when the marker for Los Angeles gets too la

At my site, http://www.foodtrucksmap.com/, the marker sizes are determined by the number of 开发者_开发百科open food trucks in that city. The problem is that when the marker for Los Angeles gets too large, it looks like the point of the marker is either in the ocean or in Mexico. This could be solved by simply offsetting the CENTER of the marker along the y-axis by half of the marker height. I can't figure out how to write this code!!

Another (bad) option would be to double the height of the image and leave the button half transparent. the problem with this method is that the transparent portion of the image would be clickable!

Please help me find a solution, thanks!


creating-custom-google-maps-overlays-with-gwt-widgets

custom Overlay class

Since you are using markers, the links may not help. In my app I stopped using markers and started using customer overlays.


Check out this example using the javascript API.

Basically you can define the anchor point coordinate of your custom icon to act as the centre of the marker. Instead of using the middle, use the bottom tip/edge of your truck icon. Look at the "iconAnchor" property:

// Create a base icon for all of our markers that specifies the
// shadow, icon dimensions, etc.
var baseIcon = new GIcon(G_DEFAULT_ICON);
baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(20, 34);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34); // THIS IS WHAT YOU CARE ABOUT
baseIcon.infoWindowAnchor = new GPoint(9, 2);

In your case you would set the anchor value to something like:

// Assuming the tip is exactly in the middle at the bottom of the icon
.iconAnchor = new GPoint(iconWidth/2, 0);

I haven't used the gwt-maps you mention - but since they will invariably just wrap the javascript API you should be able to find the equivalent property to set. Can you link to the gwt-maps implementation you are using?

0

精彩评论

暂无评论...
验证码 换一张
取 消