Imagery Layers Manipulation - stop layer addition when provider is incorrect

CesiumJS
1

Hi,

I’m new to cesium and java script. Please bear with me.

In ‘Imagery Layers Manipulation’ i can see that,

     addAdditionalLayerOption(
        'TileMapService1 Image',
        new Cesium.TileMapServiceImageryProvider({
            url : '../images/cesium_maptiler/Cesium_Logo_Color'
        }),
        0.2);

adds a new layer to Cesium.Viewer.

Now, when the ImageryProvider - url is incorrect, say,

     addAdditionalLayerOption(
        'TileMapService1 Image',
        new Cesium.TileMapServiceImageryProvider({
            url : '../dsafsfgsfg/cesium_maptiler/Cesium_Logo_Color'
        }),
        0.2);

it still adds an empty layer. Is there any way to stop this?
That is, before calling, ‘imageryLayers.addImageryProvider(imageryProvider);’ is there a way to check if the provider holds correct data?

Thank you,
Moni

2

Do to the async nature of imagery, this can be a little tricky.

  1. Poll the provider until the ready property returns true. (You can use a postRender event or setTimeout for this)

  2. Once ready, request a tile with provider.requestImage (which returns a promise) and wait for it to succeed.

  3. Once it succeeds, you know it’s valid and you can add it to the collection. If the Promise is rejected, then you know it’s bad.

The tricky part is that you have to take minimumLevel into account when requesting tiles, and there’s no guarantee that a given level has a tile for everywhere on that level, so you have to worry about false negatives. However, for providers that have a 0,0 tile, it would definitely work.’

Out of curiosity, what’s your use case for trying to do this?

3

Thank you Matthew.

This is what i used,

    provider.errorEvent.addEventListener(function(e) {
        success = false;
    }, provider);
    var layer =  imageryLayers.addImageryProvider(provider);
       
    setTimeout(function () {
        if (success) {
            //Do something
        }
        else{
            imageryLayers.remove(layer, true);
            updateLayerList();
        }
        document.getElementById('spinnerImg').style.display = "none";
    }, 3000);

Worked like a charm :slight_smile: