# WMTS REMOVE/CHANGE

**URL:** <https://community.cesium.com/t/wmts-remove-change/6556>\
**Category:** CesiumJS\
**Created:** [February 9, 2018, 2:43am UTC](https://community.cesium.com/t/wmts-remove-change/6556 "2018-02-09T02:43:49Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Chao\_Xu](https://avatars.discourse-cdn.com/v4/letter/c/2bfe46/32.png) [@Chao\_Xu](https://community.cesium.com/u/Chao_Xu)\
**Post date:** [February 9, 2018, 2:43am UTC](https://community.cesium.com/t/wmts-remove-change/6556/1 "2018-02-09T02:43:49Z")

</div>

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

I have used Cesium for a couple days and it is so amazing.Recently I gonna try to load wmts in Cesium and it works fine for me.But when I try to reset/remove/change my first wmts layers to show another one..it doesn't show well. I don't know how to solve it.

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

var viewer = new Cesium.Viewer('cesiumContainer',{  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;.....  
&nbsp;&nbsp;&nbsp;&nbsp;Cesium.WebMapTileServiceImageryProvider({  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: "[http://t0.tianditu.com/vec\_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=vec&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles](http://t0.tianditu.com/vec_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=vec&tileMatrixSet=w&TileMatrix=%7BTileMatrix%7D&TileRow=%7BTileRow%7D&TileCol=%7BTileCol%7D&style=default&format=tiles)",  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;layer: "tdtVecBasicLayer",  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;style: "default",  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;format: "image/jpeg",  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tileMatrixSetID: "GoogleMapsCompatible",  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;show: true  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;})  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
&nbsp;&nbsp;&nbsp;&nbsp;});

var testProvider1 =new Cesium.WebMapTileServiceImageryProvider({  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: url+'/geoserver/gwc/service/wmts',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;layer: 'obt:changjian\_2016',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;style: '',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;format: 'image/png',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tileMatrixSetID: 'EPSG:4326',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tilingScheme:new Cesium.GeographicTilingScheme(),  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;maximumlevel: 15,  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tileMatrixLabels : ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2','EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5','EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8','EPSG:4326:9', 'EPSG:4326:10', 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15'],  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alpha: 1.0,  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;show: true  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
var testProvider2=new Cesium.WebMapTileServiceImageryProvider({  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;url: url+'/geoserver/gwc/service/wmts',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;layer: 'obt:changjian\_2016\_f',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;style: '',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;format: 'image/png',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tileMatrixSetID: 'EPSG:4326',  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tilingScheme:new Cesium.GeographicTilingScheme(),  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;maximumlevel: 15,  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tileMatrixLabels : ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2','EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5','EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8','EPSG:4326:9', 'EPSG:4326:10', 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15'],  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alpha: 1.0,  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;show: true  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});  
function cjtoumingWMTS() {  
&nbsp;&nbsp;&nbsp;&nbsp;viewer.imageryLayers.addImageryProvider(testProvider1)  
}  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
function cjyingyangWMTS() {  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;viewer.imageryLayers.addImageryProvider(testProvider2)  
}  
....  
//I use billboard to change wmts layers  
[//viewer.imageryLayers.removeAll](https://viewer.imageryLayers.removeAll)(); removed my glob also,so terrible  
//  
Sandcastle.reset = function() {  
&nbsp;&nbsp;&nbsp;&nbsp;viewer.dataSources.removeAll();  
&nbsp;&nbsp;&nbsp;&nbsp;viewer.entities.removeAll();  
&nbsp;&nbsp;&nbsp;viewer.imageryLayers.removeAll();  
&nbsp;&nbsp;&nbsp;  
&nbsp;&nbsp;&nbsp;&nbsp;viewer.clock.clockRange = Cesium.ClockRange.UNBOUNDED;  
&nbsp;&nbsp;&nbsp;&nbsp;viewer.clock.clockStep = Cesium.ClockStep.SYSTEM\_CLOCK;  
};

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

I have some KML files to show also,when I change,the Sandcastle.reset works fine.  
I use viewer.dataSources.add(Cesium.KmlDataSource.load(url, options)) to load kml  
and viewer.dataSources.removeAll(); to remove

4. The Cesium version you're using, your operating system and browser.  
"version": "1.40.0",  
system:win7,  
browser:chrome

---

<div class="post-metadata">

**Author:** ![Gabby\_Getz](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/gabby_getz/32/7838_2.png) [@Gabby\_Getz](https://community.cesium.com/u/Gabby_Getz)\
**Post date:** [February 9, 2018, 4:35pm UTC](https://community.cesium.com/t/wmts-remove-change/6556/2 "2018-02-09T16:35:59Z")

</div>

Hi there,

Instead of adding imagery layers with **addImageryProvider** and removing all the layers when switching, just add both layers initially and toggle their visibility with [**ImageryLayer.show**](https://cesiumjs.org/Cesium/Build/Documentation/ImageryLayer.html?classFilter=imagerylayer#show).

Thanks,

Gabby

---

<div class="post-metadata">

**Author:** ![Chao\_Xu](https://avatars.discourse-cdn.com/v4/letter/c/2bfe46/32.png) [@Chao\_Xu](https://community.cesium.com/u/Chao_Xu)\
**Post date:** [February 10, 2018, 12:37pm UTC](https://community.cesium.com/t/wmts-remove-change/6556/3 "2018-02-10T12:37:44Z")

</div>

wow. Nice idea.I will try.