如何正确控制Cesium3DTileset
中基元的可见性?
首先,我在HTML
中创建一个复选框元素,并在addEventListener
中创建一个复选框,以控制本地geojson
文件中DataSource的可见性。而且进展顺利。
然后,我做了同样的事情来控制是否需要显示我的铯离子帐户中的3DTile
。在第一手检查和取消检查时,一切进行顺利。但是,当我第二次选中该框时,场景中没有任何显示。而且第二次取消选中时也不执行任何操作,也没有错误。
//this is my checkbox elements
<input type="checkbox" id="showCheckbox1" > geojson1<br>
<input type="checkbox" id="showCheckbox2" > geojson2<br>
<input type="checkbox" id="showCheckbox_1" > ion_1<br>
<input type="checkbox" id="showCheckbox_2" > ion_2<br>
//this is my first try to control the visibility of geojson, and it goes well
var obj1 = new Cesium.GeoJsonDataSource();
obj.load('../DataSource/GeoJson/airport_cesium2.geojson')
var obj2 = new Cesium.GeoJsonDataSource();
obj2.load('../DataSource/GeoJson/LiangMau.geojson')
function handleCheckbox(id,datasource){
var checkbox = document.getElementById(id);
checkbox.addEventListener('change', function() {
// Checkbox state changed.
if (checkbox.checked) {
// Show if not shown.
if (!viewer.dataSources.contains(datasource)) {
viewer.dataSources.add(datasource);
}
} else {
// Hide if currently shown.
if (viewer.dataSources.contains(datasource)) {
viewer.dataSources.remove(datasource);
}
}
}, false);
}
handleCheckbox('showCheckbox1',obj1)
handleCheckbox('showCheckbox2',obj2)
//then I try to control the visibility of 3DTile
var obj_1 = new Cesium.Cesium3DTileset({
url: Cesium.IonResource.fromAssetId(35386)
})
var obj_2 = new Cesium.Cesium3DTileset({
url: Cesium.IonResource.fromAssetId(35381)
})
function handleCheckbox_(id,datasource){
var checkbox = document.getElementById(id);
checkbox.addEventListener('change', function() {
// Checkbox state changed.
if (checkbox.checked) {
// Show if not shown.
if (!scene.primitives.contains(datasource)) {
scene.primitives.add(datasource);
}
} else {
// Hide if currently shown.
if (scene.primitives.contains(datasource)) {
scene.primitives.remove(datasource);
}
}
}, false);
}
handleCheckbox_('showCheckbox_1',obj_1)
handleCheckbox_('showCheckbox_2',obj_2)
我可以在第一次检查和取消检查时控制
3DTile
的可见性,但是在第二次没有任何反应。这确实让我感到困惑,因为没有显示错误,而且我不知道下一步该怎么做。 最佳答案
正如评论中提到的,答案是设置dataSource.show
标志以切换可见性。问题是多次添加和删除相同的dataSource,因为通常在删除dataSource时会销毁它。因此,最好使用show
标志切换可见性。
关于javascript - 如何从Cesium3DTileset控制图元的可见性,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/57377459/