nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Google Chrome Screen blanking issue

JeffreySchmidt

Hi All,

I have a map app built on api v3.8 and I have noticed that when using chrome/opera the screen flickers when zooming in and out of a map. I have a dojo layout with a header/footer/left/center/right panes... and what occurs is the map will populate tiles, blank out for a second, the other content panes blank and then back to normal. Not an issue with firefox, ie, even safari. A good amount of data gets accessed during these moves and it only seems to occur when the map is nearly maximized. It may be a dojo issue, it may be a arcgis api issue, but it didnt seem to occur until a recent chrome update... 32.0.1700.76 m is my current... anyways thought it would be worth it to see if anyone else has seen this... I'll admit my coding style is still 'legacy'... so maybe there is something there... either way... thanks for looking...

Jeff

Encontre mais publicações marcadas com

Accepted answers

JosephVrabel

I was able to solve the problem by setting navigationMode:'classic' (and NOT using 'css-transforms')
when creating the map (map = new Map...).

Before doing this the problem was very bad - not just flickering, but 80% of the page randomly blanked out to the
page background color.
Now works fine and I don't notice a difference in pan-zoom behavior when 'classic' is used.
Work fine on on Safari (at least v5.1.7).

All comments

bbieb

I noticed flashing in Chrome when we upgraded from JS 2.5 to JS 3.9. I concur with greenlaw with the number of layers (4 in my case), maximized browser, and a 24" display were the variables that triggered the flashing. I did check this morning using the "classic" navigationMode and that seemed to clear up the problem. Thanks AMUSGSjvrabel for providing a workaround.

JasonGreenlaw

I have also been noticing this issue for some time now (since early 2013), and in fact I submitted a bug report about a year ago which resulted in creation of "Bug NIM091638: The BorderContainer flashes white in Google Chrome when zooming out on a map".

The problem seems to be directly related to both the number of layers being displayed and the size of the map, i.e., it happens when I have 5+ layers added to the map and the browser maximized on a 24" display. When I restore the window to a smaller size or overlay fewer layers, the problem does not occur. I have been able to recreate the issue on the ArcGIS.com map viewer by adding 5 or 6 different services to the map.

I have found that removing an individual ContentPane from the BorderContainer and re-adding it, e.g.:

borderContainer.removeChild(contentPane);
borderContainer.addChild(contentPane);

results in that ContentPane not flickering (you can still see the basemap flash white, but it does not obscure the ContentPane).

ESRI has insisted that it is a bug with Chrome, which is certainly possible but unconfirmed.

Last year I recall setting navigationMode: 'classic' not fixing the issue, but I must have tested incorrectly because it now seems to resolve the problem after all, so thank you AMUSGSjvrabel for providing that workaround.

MarkRucker

I have the problem, but only on Google Maps, and only in Firefox, believe it or not. Plus I'm on an Apple, using OSX Mavericks. No issue with Safari. On this forum and everywhere else I've looked on global searches, looks like about 95% of those having this problem are using Chrome on a PC...?

Initially when first arriving to the page, the map is clean, normal. But once I try to slide it with the mouse button using the cursor to slide the map, it goes either mostly, or completely black. Sometimes remaining that way, and sometimes returning partly, or even totally back to normal. Every inch of the map, apart from the controls, is affected. Same by using the slider to navigate viewing distance of the ground from above.

JeffreySchmidt

Thanks USGSjvrabel! I set the navigationMode property to 'classic' and it seems to have resolved the issue. 🙂

- Jeff

PhilReese1

I was able to solve the problem by setting navigationMode:'classic' (and NOT using 'css-transforms')
when creating the map (map = new Map...).

Before doing this the problem was very bad - not just flickering, but 80% of the page randomly blanked out to the
page background color.
Now works fine and I don't notice a difference in pan-zoom behavior when 'classic' is used.
Work fine on on Safari (at least v5.1.7).

I can confirm that this resolves my issue as well.

JosephVrabel

PhilReese1

I'll add my voice to the chorus as well - I just discovered this issue. Happens in the newest version of Chrome on Windows 7 and Windows 8.1. Firefox and IE work fine.

I've traced the issue to the basemap I'm using for my application. The map service I'm using only covers a relatively small area. The flickering occurs when the basemap image tiles extend underneath of DOM elements on the page, whether those elements are within the map div or not. The zoom simpleslider increment/decrement buttons are a good example: if I use them to zoom in and out while there are tiles directly underneath of the buttons, the page will flash. If I drag the basemap out of the way so that the zoom buttons are no longer over top of image tiles from the map service, the page doesn't flash.

This also happens for bootstrap elements that are outside of the map div - if I drag the basemap so that image tiles extend beyond the border of the map div and underneath of those bootstrap elements (a bootstrap-select selectpicker, for example), when I click on those selectpickers, the page will flash. If I drag the basemap so that there aren't any image tiles under the bootstrap elements, the page will not flash when clicking those elements.

JeffreySchmidt

I rebuilt my app to utilize the 'amd' coding syntax and I am still seeing the same issue with both Chrome and Opera. I want to say I notice it more often when I am zooming out a few levels at a time... ex. going from level 16 to 13...

JosephVrabel

Problem for me is occurring under Windows 7 (SP1).
If the problem is graphics card related, would that mean users would
need to adjust their computer settings to view the site for new versions of Chrome?
Hopefully another workaround exists...

Are you using Windows XP (still) by any chance?

WE've had exactly this (well it sounds like it) flashing black screen when over various panels.

It turns out to be graphics card related with XP - to fix it we turned down the Graphic Hardware Acceleration - we found two notches down from the lowest worked fine.

Credit here to Martin on our internal help desk, who had seem similar issues with other applications.

Not an issue with Windows 7 (afaik)

ACM

RobertBorchert

It it does not happen with firefox or IE then it is chrome. Chrome is more streamlined to run faster and it may not be allowing certain scripts or tools to load in it's environment.

Are you using Windows XP (still) by any chance?

WE've had exactly this (well it sounds like it) flashing black screen when over various panels.

It turns out to be graphics card related with XP - to fix it we turned down the Graphic Hardware Acceleration - we found two notches down from the lowest worked fine.

Credit here to Martin on our internal help desk, who had seem similar issues with other applications.

Not an issue with Windows 7 (afaik)

ACM

adrian.marsden_DevonCC

Are you using Windows XP (still) by any chance?

WE've had exactly this (well it sounds like it) flashing black screen when over various panels.

It turns out to be graphics card related with XP - to fix it we turned down the Graphic Hardware Acceleration - we found two notches down from the lowest worked fine.

Credit here to Martin on our internal help desk, who had seem similar issues with other applications.

Not an issue with Windows 7 (afaik)

ACM

JosephVrabel

I am having the exact problem you describe.
Problem started with Chrome Version 32.0.1700.76 m as you mention.
I recently upgraded to Chrome Version 32.0.1700.102 m, but problematic behavior is the same.

Problem exists and is identical in our applications using the older ESRI JSAPI v2.8 as well as the newer v3.7.
The 3.7 version we have uses pure AMD and no legacy constructs (to my knowledge).

Didn't realize this is also an issue in Opera, which is bad news.
But hopefully it is the same problem and resolution in Chrome will solve both.

I do not have a solution yet, but I suspect it has to do with the page layout and/or CSS.
Our app has a feature where you can popup a new browser tab with just the map as a print-friendly version.
This map works perfectly fine (you can pan and zoom it) even though it has embedded JS to create it exactly as the main mapper interface page does.
So I'm guessing there in something about the html / css styling of the mapper interface page that Chrome is choking on ?

If anyone has also run into this issue and found a solution, please pass it along!
Thanks!

Participe da Conversa

Membros conectados podem postar, seguir atualizações e mais. Novo aqui? Registre uma conta gratuita.

Links Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.