cesium自带的组件显示与隐藏

简介: 这篇文章讲解了如何控制Cesium中自带组件的显示与隐藏,包括了各个组件的属性名称及其对应的显示隐藏操作方法。

Cesium有很多自带的工具栏,这些工具栏可以实现隐藏与现实,这里介绍一下具体有哪些工具栏,以及属性名是什么,如何进行隐藏与显示,下面提供源码,源码中会对每个工具栏的介绍,值设置为false为不显示,设置true为显示,默认都是显示的。可以对照着源码的注释试一试。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <!-- Include the CesiumJS JavaScript and CSS files -->
  <script src="https://cesium.com/downloads/cesiumjs/releases/1.100/Build/Cesium/Cesium.js"></script>
  <link href="https://cesium.com/downloads/cesiumjs/releases/1.100/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
  <div id="cesiumContainer"></div>
  <div id="credit"></div>
  <script>
    // 设置token
    Cesium.Ion.defaultAccessToken = 'token';

    // 初始化一个id为 `cesiumContainer`的HTML元素作为我们的容器,这里不传ID传DO .
    var viewer = new Cesium.Viewer('cesiumContainer',{
        geocoder:false,//查找位置工具
        homeButton:false,//返回视角的初始位置
        sceneModePicker:false,//选择视角的模式:2D,3D,哥伦布视图
        baseLayerPicker:false,//图层选择选择地图服务还是地形服务
        navigationHelpButton:false,//导航帮助按钮
        animation:false,//动画器件,可以旋转地球
        creditContainer:"credit",//
        timeline:false,//下方的时间轴,默认指示当前时间,允许用户点击跳转到指定时间
        fullscreenButton:false,//全屏显示
        vrButton:true // VR 按钮,右下角有个戴眼镜的按钮,点击可以看下效果
    });

  </script>
 </div>
</body>
</html>

图片1.png

相关文章
|
定位技术
干货!解决Cesium中Entity移动漂移的问题
案例场景:在Cesium开发三维场景展示中,肯定会碰到加载Entity的需求,如果在你的gis应用中,带了地形的展示。那么在旋转切换画面时,Entity是否跟着一起动了起来,感觉像漂移一样呢?
4270 0
干货!解决Cesium中Entity移动漂移的问题
cesium添加实体不被地形遮挡的参数设置
disableDepthTestDistance:指定从相机到禁用深度测试的距离,关于深度测试我们将在后面的文章中介绍到,由于深度测试的存在,我们的对象很多时候会被地形挡住,如下:
2872 0
cesium添加实体不被地形遮挡的参数设置
|
JavaScript 前端开发
JavaScriptDOM操作:怎样获取或修改一个元素的样式?
JavaScriptDOM操作:怎样获取或修改一个元素的样式?
696 0
|
11月前
|
前端开发 JavaScript API
(前端3D模型开发)网页三维CAD中加载和保存STEP模型
本文介绍了如何使用`mxcad3d`库在网页上实现STEP格式三维模型的导入与导出。首先,通过官方教程搭建基本项目环境,了解核心对象如MxCAD3DObject、Mx3dDbDocument等的使用方法。接着,编写了加载和保存STEP模型的具体代码,包括HTML界面设计和TypeScript逻辑实现。最后,通过运行项目验证功能,展示了从模型加载到保存的全过程。此外,`mxcad3d`还支持多种其他格式的三维模型文件操作。
973 116
Cesium给物体添加贴图
这篇文章讲解了在Cesium中如何为3D模型添加贴图,并提供了具体的实现步骤和代码示例。
766 2
|
7月前
|
JSON 前端开发 JavaScript
搞定 XLSX 预览?别瞎找了,这几个库(尤其最后一个)真香!
本文来自【沉浸式趣谈】,探讨前端处理Excel的三大主流库:xlsx、Handsontable和ExcelJS。 - **xlsx**:轻量高效,适合简单读写数据,但样式支持有限。 - **Handsontable**:功能强大,提供类Excel在线编辑体验,但商用需付费且性能消耗较大。 - **ExcelJS**:现代全能,API友好,支持复杂样式与公式,免费开源,推荐用于精细处理场景。
560 0
搞定 XLSX 预览?别瞎找了,这几个库(尤其最后一个)真香!
|
JavaScript 算法 定位技术
利用Cesium和JS实现地点点聚合功能
利用Cesium和JS实现地点点聚合功能
615 0
|
JavaScript 前端开发 数据格式
Cesium案例解析(四)——3DModels模型加载
Cesium案例解析(四)——3DModels模型加载
708 0
Cesium自动生成建筑物3D轮廓模型
这篇文章讲解了如何使用Cesium根据地形和建筑物的高度数据自动生成3D轮廓模型的方法。
640 2