Layer Z-fighting at poles

CesiumJS
1

1. A concise explanation of the problem you’re experiencing.

While trying to code a basic imagery layer switcher (OpenStreetMap and BingAearial at the moment) layer 0 at North Pole shows up in front of the top layer (layer 1); switching layers (0 with 1) and moving closer to the pole it happens again (please see attached screenshots).

2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.

In Sandcastle:

HTML Tab:

JS Code Tab:

var osm = Cesium.createOpenStreetMapImageryProvider({

url : ‘https://a.tile.openstreetmap.org/’

});

var viewer = new Cesium.Viewer(‘cesiumContainer’, {

imageryProvider : osm

});

var imageryLayers = viewer.imageryLayers;

var osmLayer = imageryLayers.get(0);

var bingAerialLayer = imageryLayers.addImageryProvider(Cesium.createWorldImagery());

imageryLayers.raiseToTop(bingAerialLayer);

Sandcastle.addToolbarMenu([{

text : ‘Bing Aerial’,

onselect : function() {

imageryLayers.raiseToTop(bingAerialLayer);

}

}, {

text : ‘OpenStreetMap’,

onselect : function() {

imageryLayers.raiseToTop(osmLayer);

}

}], ‘layerSwitcher’);

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

I have to code a basic map switcher (OSM and Bing for now). Is there a better way to accomplish that (the map switching) with Cesium without incurring in such an issue?

4. The Cesium version you’re using, your operating system and browser.

Cesium 1.50, Windows 7, Chrome Version 69.0.3497.100 (Official Build) (64-bit)

Thanks

north_pole-z-fight_01.jpg
north_pole-z-fight_01.jpg1127×571 90.2 KB

north_pole-z-fight_02.jpg
north_pole-z-fight_02.jpg1141×579 44 KB

2

I don’t think that’s z-fighting. I think what’s happening there is that those imagery layers don’t cover the full globe. What CesiumJS does by default in that case is stretch it to fill the poles.

However, when there’s a layer underneath, it lets the layer show through instead (usually you’d have a base layer that covers the whole globe and smaller imagery layers on top).

So in your case, it might be best to show/hide the layers (see the docs here), instead of putting them on top of each other. I modified your example to do this, so you can see what this looks like here.

This has the added benefit that it won’t load imagery tiles for layers that are hidden, so it can significantly speed up your application if you’re going to have a lot of layers. If you do absolutely want them both to load at the same time so switching between them is immediate, I think you can use the alpha property instead of show.

3

Hey Omar,

thanks very much.

That definitely makes sense and works like a charm.

I had the same performance concern in mind.

I’ll give the alpha channel a shot anyway.

Thanks again