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监视器的更多相关文章

  1. Cesium案例解析(二)——ImageryLayers影像图层

    目录 1. 概述 2. 实例 2.1. ImageryLayers.html 2.2. ImageryLayers.js 2.2.1. 代码 2.2.2. 解析 3. 结果 1. 概述 Cesium支 ...

  2. Cesium案例解析(五)——3DTilesPhotogrammetry摄影测量3DTiles数据

    目录 1. 概述 2. 案例 3. 结果 1. 概述 3D Tiles是用于传输和渲染大规模3D地理空间数据的格式,例如摄影测量,3D建筑,BIM / CAD,实例化特征和点云等.与常规的模型文件格式 ...

  3. Cesium案例解析(四)——3DModels模型加载

    目录 1. 概述 2. 代码 3. 解析 4. 参考 1. 概述 Cesium自带的3D Models示例,展示了如何加载glTF格式三维模型数据.glTF是为WebGL量身定制的数据格式,在网络环境 ...

  4. Cesium案例解析(三)——Camera相机

    目录 1. 概述 2. 实例 2.1. Camera.html 2.2. Camera.js 2.2.1. 飞行至某一点 2.2.2. 飞行至某区域 2.2.3. 两地之间飞行 2.2.4. 设置视图 ...

  5. Cesium案例解析(一)——HelloWorld

    目录 1. 概述 2. 实例 2.1. HelloWorld.html 2.2. HelloWorld.js 3. 结果 1. 概述 感觉网上已经有不少关于cesium的教程了,但是学习一个框架最快的 ...

  6. 【Python五篇慢慢弹（5）】类的继承案例解析，python相关知识延伸

    类的继承案例解析,python相关知识延伸 作者:白宁超 2016年10月10日22:36:57 摘要:继<快速上手学python>一文之后,笔者又将python官方文档认真学习下.官方给 ...

  7. SQL Server 连接问题案例解析（1）

    SQL Server 连接问题案例解析(1) 转载自:http://blogs.msdn.com/b/apgcdsd/archive/2015/04/27/sql.aspx?CommentPosted ...

  8. 嵌入式OS入门笔记-以RTX为案例：六.RTX的任务调度

    嵌入式OS入门笔记-以RTX为案例:六.RTX的任务调度 上一篇笔记介绍了一些绕开排程器(或调度程序,scheduler)来进行时间管理的一些小方法.这一篇详细介绍RTX的任务调度原理. RTX主要有 ...

  9. Celery 源码解析六：Events 的实现

    在 Celery 中,除了远程控制之外,还有一个元素可以让我们对分布式中的任务的状态有所掌控,而且从实际意义上来说,这个元素对 Celery 更为重要,这就是在本文中将要说到的 Event. 在 Ce ...

随机推荐

  1. 第二阶段冲刺个人任务——three

    今日任务: 优化统计个人博客结果页面的显示. 昨日成果: 优化作业查询结果,按学号排列.

  2. tensorflow框架

    一.tensorflow的工作流程,实际上它体现出来的是一个”懒性“方法论 (1)构建一个计算图. (2)初始化变量 (3)创建一个会话 (4)在会话中运行图的计算 (5)关闭会话 二.神经网络搭建八 ...

  3. 定义可选URL片段 定义自定义片段变量 精通ASP-NET-MVC-5-弗瑞曼

  4. python，for循环的使用案例集

    1.循环执行某一系列操作.将该操作定义为一个def,然后使用for去循环执行该操作 思路,先把操作定义为一个函数,在for循环执行这个函数 比如下面案例,把微信好友列表内的好友,循环的方式依次调整到第 ...

  5. Python学习，第七课 - 文件操作

    Python中对文件的相关操作详解 文件的操作在今后的Python开发中也是使用非常频繁的. 先说下对文件操作的流程 打开文件,得到文件的一个句柄,赋值给一个变量 然后通过句柄对文件进行操作(内容的增 ...

  6. CSS-05-伪类及伪元素选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. Linux 安装Jenkins

    1.安装jdk1.8 下载地址:https://github.com/frekele/oracle-java/releases 下载 root@123:~/my_java# wget https:// ...

  8. PyCharm安装和使用教程（Windows系统）

    说明: PyCharm 是一款功能强大的 Python 编辑器, 本文简单的介绍下PyCharm 在 Windows下是如何安装的. PyCharm 的下载地址:http://www.jetbrain ...

  9. 透过现象看webpack处理css文件中图片路径转换的具体过程

    webpack是目前使用比较流行的一个前端模块打包器,前端的任何资源都被当成一个模块来处理,如图片.css文件等等.在基于webpack构建的前端项目中,一般都会配置有关css文件处理的规则,这其中也 ...

  10. Exception:Request processing failed; nested exception is org.apache.ibatis.binding.BindingException

    异常 在测试Spring MVC+Mybatis整合时,运行 Maven build -> tomcat7:Run 遇到如下异常 从异常信息上看,是找不到mapper对应的xml文件,于是我到t ...