New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.
Starred by 16 users
Status: WontFix
Owner: ----
Closed: Oct 2015
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 2
Type: Bug



Sign in to add a comment
Chrome misrenders entire page when viewing openlayers with vector layers
Reported by kjeld...@gmail.com, Dec 3 2013 Back to list
Chrome Version       : 31.0.1650.57
URLs (if applicable) : http://jsfiddle.net/tHWV6/2/
Other browsers tested:
Add OK or FAIL after other browsers where you have tested this issue:
     Safari 6: OK
  Firefox 20: OK
       IE 7/8/9/10: OK

What steps will reproduce the problem?
1. View http://jsfiddle.net/tHWV6/2/
2. Set the VECTOR_LAYERS_COUNT to 45
3. Increase the size of the window

What is the expected result?
The map and entire page continue to display in an ordinary way.

What happens instead?
Essentially, the entire page stops rendering.

Please provide any additional information below. Attach a screenshot if
possible.

This has been happening for several major versions and the problem has been getting worse version-by-version.  In the most recent version (listed above), I experience the bug with the VECTOR_LAYERS_COUNT set to 25.  In my previous version (28 series), I would have to adjust it to 40 or above to experience the same problem.

There is a corresponding bug[1] filed for OpenLayers.

Screenshots attached.

[1] https://github.com/openlayers/openlayers/issues/1181#issuecomment-29693277
 
Screen Shot 2013-12-03 at 10.20.25 AM.png
126 KB View Download
Screen Shot 2013-12-03 at 10.20.06 AM.png
47.1 KB View Download
Cc: agautam@chromium.org
Labels: Needs-Feedback
what OS did you see this issue in ?
i could not reproduce this issue in 32.0.1700.41 (Official Build 238477) beta OS=mac 
Comment 2 by Deleted ...@, Dec 6 2013
I've seen this issue on Windows 8 with Chrome version 31.0.1650.57. A colleague saw it on MaC using the same Chrome version.  
Comment 3 by kjeld...@gmail.com, Dec 6 2013
I just reproduced it again on MacOS 10.9 with a new update, version 31.0.1650.63.  I have been able to reproduce it in MacOS 10.7 as well.  My windows-using coworker also sees this issue.
Cc: rponnada@chromium.org
Labels: -Needs-Feedback OS-All M-33 Cr-Blink-Compositing
Status: Untriaged
Able to repro this issue on windows7 using 31.0.1650.63 (Official Build 238485). In this case, I have adjusted VECTOR_LAYERS_COUNT to 45. 

Same behavior is observed in current beta: 32.0.1700.55 (Official Build 239786) Aura and Dev channels: 33.0.1750.3 (Official Build 241270) 

Considering this as non-regression, observed the same behavior in M29: 29.0.1547.76 (Official Build 223446
Comment 5 by Deleted ...@, Dec 20 2013
Can not reproduce this on Windows 7 machine inside WMWare Player (4.0.4 build-744019) using Chrome 31.0.1650.63 m

I am having an old Ubuntu 11.10 installation where Chrome is not able to update itself. Thus stuck with version 27.0.1453.93. I can not provoke the problem even with 10000 layers. 
Comment 6 by rus...@gmail.com, Jan 15 2014
I've had this issue on and off for quite a while in our web app, but I thought it was related to my own machine. 

I've just had clients confirm that they have the same issue on all machines running Chrome since the 32.0.1700.76 update.

It is worse when the browser is full-screen.
Broken on Windows XP, 7 and 8 with Chrome 31, 32 and 33.
The map needs to be of a certain size. 
A collegue found out that if the map is small enough it's rendering properly.


Comment 8 by kjeld...@gmail.com, Jan 22 2014
Correct.  There is both a threshold of layers needed to trigger this bug and a threshold of window size.  These two are related as well, so a larger number of layers triggers on a smaller window size than a map with less layers.
Comment 9 by Deleted ...@, Jan 24 2014
Hi all

I've gotten closer to the cause of the problem. The file OpenLayers-2.13.1/theme/default/style.css contains the style configuration

.olTileImage {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -o-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -ms-perspective: 1000;
    perspective: 1000;
}


From what I can see then the webkit specific CSS configurations
-webkit-transform: translateZ(0);
-webkit-backface-visibility: hidden;
are causing the problem

If I remove these using the Google Chrome Developer Tools. Then the problem disappears. I will now create a custom CSS without these and try to run it in our test environments. 
Comment 10 by kjeld...@gmail.com, Jan 24 2014
Thank you Jesper!

I added the following to my site CSS file and it has reduced the problem to only blinking/flashing when resizing:

/* work around conflict of Chrome and OpenLayers */
.olTileImage {
	-webkit-backface-visibility: visible !important;
	-webkit-transform: none !important;
}
Comment 11 by Deleted ...@, Mar 11 2014
Hi

Just wondered whether anyone has come up with a solution other than (or in addition to) the .olTileImage which has some quite noticeable flashing, especially with larger map extents (in px) and significant zooming.

I've applied the following as suggested:

/* work around conflict of Chrome and OpenLayers */
.olTileImage {
	-webkit-backface-visibility: visible !important;
	-webkit-transform: none !important;

Thanks in advance

Andy
}
Comment 12 Deleted
Comment 13 by Deleted ...@, Mar 20 2014
Hi all,
I commented out those two lines and I still experienced that annoying flashing when panning and zooming.
To avoid it, u can disabled the tile opacity transition in the style.css. Just, comment out:

.olLayerGrid .olTileImage {
    #-webkit-transition: opacity 0.2s linear;
    -moz-transition: opacity 0.2s linear;
    -o-transition: opacity 0.2s linear;
    #transition: opacity 0.2s linear;
}
Thanks all of you, For sharing this work around, I was facing the same issue with my map config after implementing suggested work around it's working 100% fine for me. Thanks once again. :D
Hey, I've just tested this on 38.0.2125.101 beta-m and it looks like it's resolved. Anyone can test with the stable version.

Anybody else can valide my discovery?
Comment 16 by Deleted ...@, Oct 22 2014
this is NOT resolved.. still happening int he lastest v38 release.
travisdmathis: you need to provide more information than that. What OS? Reproduce with the jsfiddle given in the first message, or some other way?

I cannot reproduce this on 39.0.2171.27 (Official Build) beta, Ubuntu 14.04.
Status: WontFix
I can't reproduce this either. Closing the bug. Please- open a new bug if you have a new testcase.
Sign in to add a comment