IssueTracker

Thanks, I've notified the team of your request.

The undocumented 'size' option seems to be gone since version 23 was introduced.

However 'Status: FixedNotReleased' probably indicates that it is coming back. Great.

Update:
In the upcoming release, the team decided to address this issue without the use
explicitly defining a 'size' property under MapOptions.  This property has been
removed as a result.  Map container dimensions are better tracked and updated.
Triggering the Map 'resize' event should work properly once again after toggling the
container's display field.

Esa, is there a group thread around the difficulty with triggering the resize event
after a tab is selected?  This is somewhat trivial to do with toolkits like jQuery.

There are even tab 'scripts' without any javascript. Pure CSS implementations with
:target pseudoselector.
http://tutorials.mezane.org/tabbed-navigation-using-css/

One påossible generic recommendation might be to register a 'click' handler by
addDomListener() to the map tab. Some timeOut may be needed.

In the case of a tabbed UI without JavaScript, can you register a 'click' listener
onto the tab's HTML element and have the event handler function trigger the Map
resize event?


Do you have a link to a sample application for which this is a problem?  I'm certain
we can find a reasonable solution.

Just to clarify what was "Fixed" in the release, here are the notes again from my
comment above:

"In the upcoming release, the team decided to address this issue without the use
explicitly defining a 'size' property under MapOptions.  This property has been
removed as a result.  Map container dimensions are better tracked and updated.
Triggering the Map 'resize' event should work properly once again after toggling the
container's display field."

No "size" property was added or documented.  The Map "resize" event should be
triggered, which should now work correctly for map containers initially hidden with
display:none.

I know the case was closed but would you please consider the 'size' option once again.

thanks,
Esa

This still does not work properly in Chrome...even with optimized set to false. I also tried a suggestion above of removing the shadow by setting the marker 'flat' property to true. The markers still flicker!

Any updates please???

This is certainly not a critical problem, but I too reproduce this on Version 25.0.1326.0 canary on Mac OS X.6.8 and setting optimized to false did not help for me either.  One further observation, flicker seems to only happen with second and later markers added to map.

confirm #11
http://gmaps-samples-v3.googlecode.com/svn/trunk/markeranimations/markeranimations.html
and start adding more markers
Chrome Version 26.0.1410.65 on OS X 10.8.3 (12D78)

Still having this issue.  Optimized: false does not fix.

Still having this issue.

Started making an internal maps project for my company and I can confirm this issue on the newest version of Chrome. It's really bothering me cause I'm going to pretty serious lengths to ensure that only new pins in the searched area drop so as to better visually inform the user of what is outside the intersection of the new and past search results. The flicker fights that slightly :/

Same issue here.

Happens on Chrome with custom PNG icons (other than default red marker), even with no shadows.

Happens in Chrome version 28.0.1500.71 with red default markers

Confirm on OSX, Version 28.0.1500.71

[Comment deleted]

Confirmed on Chrome 28.0.1500.95, Windows 7
Both with custom PNG draggable marker within my own project and the default red marker at http://gmaps-samples-v3.googlecode.com/svn/trunk/markeranimations/markeranimations.html
I've tried making my marker non-optimized but the issue persists.
The issue is not fixed.

I still vote for a fix!  But, here is somewhat of what you may consider a workaround...rather than using DROP, try the BOUNCE animation, and then change it to null after a certain period of time to simulate a drop.  It's not as dramatic as the drop, but it creates at least a nice, smooth animation.  I found that setting animation to null after 1150ms creates a nice smooth bounce:

marker = new google.maps.Marker({
    map:map,
    animation: google.maps.Animation.BOUNCE,
    position: leverage,
    icon: image
  });
 
  setTimeout(function() {
    marker.setAnimation(null); // this stops the bouncing
  }, 1150);

You can see a live example here if you scroll to the bottom: https://leveragenewagemedia.com/

Same issue on Chrome 28 on Ubuntu 13.04.

Setting optimized to false helped.

Confirmed issue on Chrome Version 31.0.1650.48 using Mac OS X 10.9 (13A603)

Reproduced in Chrome v 30.0.1599.101 on OS X 10.9 (13A603).

Setting the marker's optimized flag to false *didn't* help in my case.

Same here, setting optimized flag helps a bit but flickering still happens

[Comment deleted]

Reproduced in Chrome Version 32.0.1700.107 on Ubuntu 12.04 and Chrome Version 32.0.1700.107 on Windows 7.

Setting the optimized flag to false did not help.

This is proudly becoming a three year bug.

Please fix this!

Issue can be seen at this fiddle:

http://jsfiddle.net/4HS3R/

Can confirm still an issue Mac 10.8.5. Chrome Version 36.0.1985.125

I figured out a hacky workaround. Just set the map marker icon as an invisible .png, then setTimeout 100-150 ms and set the marker icon to be something else.

It fixes it for most computers, obviously not ideal tho. Hope that helps

create the image fist and put some additional infos about the markers:
var image = {
    url: 'images/map_marker.png',
    // This marker is 20 pixels wide by 30 pixels tall.
    size: new google.maps.Size(20, 30),
    // The origin for this image is 0,0.
    origin: new google.maps.Point(0,0),
    // The anchor for this image is the base of the image at 0,30.
    anchor: new google.maps.Point(10, 30)
};

Mac OS 10.10 Chrome Version 40.0.2214.115 (64-bit)
Still flickers before the bounce.

Still flickers on Mac OS 10.10.2, Chrome Version 41.0.2272.104 (64-bit).
Why is this issue marked as fixed?

Problem still not fixed.

And still not fixed, running Version 44.0.2403.157 m of Chrome.

Works fine in Edge (WOWWOWWOWWOWWOWWOW)

So I guess MS > Google?

FYI comment #21 solved it, but I decreased the timeout to 775MS.

Comment #32 worked for me, to clarify:

var image = {
    url: 'images/map_marker.png',
    // This marker is 20 pixels wide by 30 pixels tall.
    size: new google.maps.Size(20, 30),
    // The origin for this image is 0,0.
    origin: new google.maps.Point(0,0),
    // The anchor for this image is the base of the image at 0,30.
    anchor: new google.maps.Point(10, 30)
};

var marker = new google.maps.Marker({
    ...
    icon: image,
    animation: google.maps.Animation.DROP
});

still not fixed

I observe the same flickering behavior! So still not fixed I guess.

re-opened as issue #10254, maybe this year... 8o)

As stated multiple times, #32 solves the issue as also explained more detailled in #38. Thanks for posting.

...but why not just fix an obvious bug instead of making people search for a workaround..?

sadly, I've just wasted a day on a known issue (marked as Fixed!)

at least adding my google queries through the day here, so it is better discoverable once indexed.
"gmaps custom marker icon problem animation drop"
"gmaps custom icon fouc"
"gmaps custom icon blink"
"google maps markers flash before drop"
"maps marker displayed before the map"

shame on the person that marked it as fixed
http://code.google.com/apis/maps/documentation/javascript/examples/marker-animations-iteration.html 
still displays the flicker eight years later