Cesium案例解析(六)——3DTilesInspector监视器
1. 概述
3D Tiles作为传输和渲染大规模3D地理空间数据的格式,应对的都是大规模数据的场景,Cesium提供了一个监视3D Tiles数据的监视器,可以通过这个监视器观察3D Tiles数据的效果。
2. 案例
HTML页面3DTilesInspector.html代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <meta name="description" content="Use the 3D Tiles inspector as a debugging tool for different tilesets.">
    <meta name="cesium-sandcastle-labels" content="Beginner, Tutorials, Showcases">
    <title>Cesium Demo</title>
    <script type="text/javascript" src="../Build/Cesium/Cesium.js"></script>
    <style>
        @import url(../Build/Cesium/Widgets/widgets.css);
        html,
        body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
            font-family: sans-serif;
            background: #000;
        }
        .fullSize {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            border: none;
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
    <div id="cesiumContainer" class="fullSize"></div>
    <script src="3DTilesInspector.js"></script>
</body>
</html>
主要的javascript代码3DTilesInspector.js如下:
'use strict';
var viewer = new Cesium.Viewer('cesiumContainer', {
    terrainProvider: Cesium.createWorldTerrain()
});
viewer.scene.globe.depthTestAgainstTerrain = true;
viewer.extend(Cesium.viewerCesium3DTilesInspectorMixin);
var inspectorViewModel = viewer.cesium3DTilesInspector.viewModel;
var tileset = new Cesium.Cesium3DTileset({
    url: "../dayanta/tileset.json"
});
viewer.scene.primitives.add(tileset);
tileset.readyPromise.then(function () {
    viewer.zoomTo(tileset);
});
可以看到添加3DTiles监视器的代码比较简单,将Cesium.viewerCesium3DTilesInspectorMixin对象传入拓展函数viewer.extend()即可。最终显示的效果如下:

可以看到右边出现了一个3D Tiles Inspector窗体,里面包含了与3D Tiles格式相关的状态参数:

其中勾选Performance,就可以显示当前的具体帧数;Screen Space Error也是个很重要的参数,决定了当前模型细分的层级。参数设置的越小,细分的层度就会越高,相应的也会耗费更多的性能。
Cesium案例解析(六)——3DTilesInspector监视器的更多相关文章
- Cesium案例解析(二)——ImageryLayers影像图层
		
目录 1. 概述 2. 实例 2.1. ImageryLayers.html 2.2. ImageryLayers.js 2.2.1. 代码 2.2.2. 解析 3. 结果 1. 概述 Cesium支 ...
 - Cesium案例解析(五)——3DTilesPhotogrammetry摄影测量3DTiles数据
		
目录 1. 概述 2. 案例 3. 结果 1. 概述 3D Tiles是用于传输和渲染大规模3D地理空间数据的格式,例如摄影测量,3D建筑,BIM / CAD,实例化特征和点云等.与常规的模型文件格式 ...
 - Cesium案例解析(四)——3DModels模型加载
		
目录 1. 概述 2. 代码 3. 解析 4. 参考 1. 概述 Cesium自带的3D Models示例,展示了如何加载glTF格式三维模型数据.glTF是为WebGL量身定制的数据格式,在网络环境 ...
 - Cesium案例解析(三)——Camera相机
		
目录 1. 概述 2. 实例 2.1. Camera.html 2.2. Camera.js 2.2.1. 飞行至某一点 2.2.2. 飞行至某区域 2.2.3. 两地之间飞行 2.2.4. 设置视图 ...
 - Cesium案例解析(一)——HelloWorld
		
目录 1. 概述 2. 实例 2.1. HelloWorld.html 2.2. HelloWorld.js 3. 结果 1. 概述 感觉网上已经有不少关于cesium的教程了,但是学习一个框架最快的 ...
 - 【Python五篇慢慢弹(5)】类的继承案例解析,python相关知识延伸
		
类的继承案例解析,python相关知识延伸 作者:白宁超 2016年10月10日22:36:57 摘要:继<快速上手学python>一文之后,笔者又将python官方文档认真学习下.官方给 ...
 - SQL Server 连接问题案例解析(1)
		
SQL Server 连接问题案例解析(1) 转载自:http://blogs.msdn.com/b/apgcdsd/archive/2015/04/27/sql.aspx?CommentPosted ...
 - 嵌入式OS入门笔记-以RTX为案例:六.RTX的任务调度
		
嵌入式OS入门笔记-以RTX为案例:六.RTX的任务调度 上一篇笔记介绍了一些绕开排程器(或调度程序,scheduler)来进行时间管理的一些小方法.这一篇详细介绍RTX的任务调度原理. RTX主要有 ...
 - Celery 源码解析六:Events 的实现
		
在 Celery 中,除了远程控制之外,还有一个元素可以让我们对分布式中的任务的状态有所掌控,而且从实际意义上来说,这个元素对 Celery 更为重要,这就是在本文中将要说到的 Event. 在 Ce ...
 
随机推荐
- python读取json文件
			
比如下图json数据,场景需要读取出wxid这项数据,然后传给后面的函数去使用 具体的脚本为 import json f =open('d:\\1024.json',encoding='utf-8') ...
 - GIMP(Linux下的Photoshop),Centos7下安装过程
			
点当然是上官网:https://www.gimp.org/ 这英语看不懂,果断用谷歌的网页翻译. 点下载,就会有 看到这个,就点 下载一个安装的包 用命令行打上 [root@localhost 下载] ...
 - MySql配置环境变量
			
完成后安装好MySQL,为MySQL配置环境变量. 0)在我的电脑上点击右键选择属性-->高级系统设置-->环境变量1)新建MYSQL_HOME变量,并配置:D:\Develop\mysq ...
 - Android教程2020 - RecyclerView显示多种item
			
Android教程2020 - 系列总览 本文链接 前面我们已经用RecyclerView显示一些数据.也知道如何获取滑动的距离. 前面我们的列表中显示的都是同类数据.如果要在一个列表中显示不同类别的 ...
 - CSS-- 实用CSS样式
			
自用实用CSS样式 1.清除DIV浮动 <span style="font-family:KaiTi_GB2312;">clear: both;</span> ...
 - <背包>solution-POJ1742_Coins
			
POJ1742 - Coins People in Silverland use coins.They have coins of value A1,A2,A3...An Silverland dol ...
 - (5千字)由浅入深讲解动态规划(JS版)-钢条切割,最大公共子序列,最短编辑距离
			
斐波拉契数列 首先我们来看看斐波拉契数列,这是一个大家都很熟悉的数列: // f = [1, 1, 2, 3, 5, 8] f(1) = 1; f(2) = 1; f(n) = f(n-1) + f( ...
 - scrapy-redis分布式爬虫实战
			
Scrapy-Redis代码实战 Scrapy 是一个通用的爬虫框架,但是不支持分布式,Scrapy-redis是为了更方便地实现Scrapy分布式爬取,而提供了一些以redis为基础的组件(仅有组件 ...
 - Java的Integer与int互转
			
int转Integer ; Integer wrapperi = new Integer(i); Integer转int ); int i = wrapperi.intValue(); JDK1.5以 ...
 - python pip使用报错:  Fatal error in launcher: Unable to create process using '"c:\python27\python.exe"  "C:\Python27\Scripts\pip.exe" '
			
在一个系统中,如果同时存在python2和python3,在cmd.exe程序下执行pip.pip2或者pip3均会报错. 如何解决: 如果是在python3环境下,使用pip安装扩展库,可以使用以下 ...