'how to change a CesiumJS viewer's baselayer url

i am using a CesiumJS instance to display a base map of the earth using a imageryProvider from source A.

var viewer = new Cesium.Viewer('cesiumContainer', imageryProvider:providerA);

Now while using the Viewer I would like to be able to change this map to get images from providerB at a certain event.

I tried: 

viewer.scene.imageryLayers.get(0).imageryProvider.url = providerB.url

However that does not seem to work and also feels quite like hack anyway. I could not find anything in Cesium's documentation . Is this at all possible without restarting / recreating the viewer instance? I know that there is a Cesium.BaseLayerPicker (https://cesium.com/docs/cesiumjs-ref-doc/BaseLayerPicker.html) However I do not see what method this picker calls on "select" )

Thanks a lot.

cesium


Solution 1:[1]

The BaseLayerPicker widget calls this code when the user selects a new layer.

There's a lot of boilerplate widget management in that block of code, but for your sake, only a couple of the lines are critical. First, the old existing active imagery layer is searched for, and removed:

    imageryLayers.remove(layer);

Then, a new imagery provider is constructed and added at index 0, the first position, which is the base imagery layer:

    imageryLayers.addImageryProvider(newProviders, 0);

Solution 2:[2]

You can directly change the URL of the provider but you should also change appropriate parameters("layers" in case of WMS, "layer", "style", "format", "tileMatrixSetID " ... in case of WMTS) depending on the type of provider(WMS or WMTS).

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 ZhefengJin

Related Questions