Cesium案例解析(十)——CZML点
1. 概述
CZML是Cesium中用于描述动态图形场景的JSON格式,它们的关系类似于Google Earth与KML之间的关系,一般会认为KML是一种矢量格式,但KML或者CZML绝不是矢量格式那么简单,它可以描述线,点,广告牌,模型和其他图形图元,并指定其如何随时间变化。
CZML Point这个案例描述了如何通过CZML格式来描述一个点。
2. 案例
CZML是一种JSON格式,因此可以直接在程序中描述成对象字面量。具体实现代码如下:
'use strict';
var czml = [{
"id": "document",
"name": "CZML Point",
"version": "1.0"
}, {
"id": "point 1",
"name": "point",
"position": {
"cartographicDegrees": [-111.0, 40.0, 0]
},
"point": {
"color": {
"rgba": [255, 255, 255, 255]
},
"outlineColor": {
"rgba": [255, 0, 0, 255]
},
"outlineWidth": 4,
"pixelSize": 20
}
}];
var viewer = new Cesium.Viewer('cesiumContainer');
var dataSourcePromise = Cesium.CzmlDataSource.load(czml);
viewer.dataSources.add(dataSourcePromise);
viewer.zoomTo(dataSourcePromise);
Cesium中直接定义了一个CzmlDataSource对象处理Czml,通过load函数返回了一个CzmlDataSource的Promise。然后将其加入到Viewer成员变量dataSources,它是一个DataSource数据源的集合DataSourceCollection。DataSourceCollection的add函数能够接受CzmlDataSource的Promise,也就是一旦CZML被正确读取,就会加载到视景器Viewer中。
这里的CZML定义也是比较直观的:
- 属性cartographicDegrees表示点的位置由经度、纬度以及高程来表示,且以度为单位;
- color表示点的颜色;
- outlineColor表示点的边框颜色;
- outlineWidth表示点的边框宽度;
- pixelSize表示点的像素大小。
3. 结果
最后的显示效果如下:

Cesium案例解析(十)——CZML点的更多相关文章
- Cesium案例解析(二)——ImageryLayers影像图层
目录 1. 概述 2. 实例 2.1. ImageryLayers.html 2.2. ImageryLayers.js 2.2.1. 代码 2.2.2. 解析 3. 结果 1. 概述 Cesium支 ...
- Cesium案例解析(六)——3DTilesInspector监视器
目录 1. 概述 2. 案例 1. 概述 3D Tiles作为传输和渲染大规模3D地理空间数据的格式,应对的都是大规模数据的场景,Cesium提供了一个监视3D Tiles数据的监视器,可以通过这个监 ...
- 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的教程了,但是学习一个框架最快的 ...
- Cesium 案例(九)示例中小程序集合(1)
因为这几天在忙一些客观上无法逃脱的事,没有大块时间对中大型案例进行学习,所以对官方案例中的代码不超过40行的程序进行了学习.我把他们放在一到两个随笔中. 注:[所有案例中最前面务必加上] 1 Cesi ...
- 【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 ...
- 【java设计模式】(6)---迭代器模式(案例解析)
设计模式之迭代器模式 一.java迭代器介绍 1.迭代器接口 在jdk中,与迭代器相关的接口有两个:Iterator 与 Iterable. Iterator:迭代器,Iterator及其子类通常是迭 ...
随机推荐
- 安装k8s
完成安装k8s集群以后,推荐使用https://github.com/512team/dhorse发布应用. 准备环境 准备两台服务器节点,如果需要安装虚拟机,可以参考<wmware和cento ...
- splay + 垃圾回收 知识点与例题的简要讲解
splay 简要讲解 前置芝士:普通二叉树 splay tree是一个越处理越灵活的数据结构,通过splay(伸展)操作,使整棵树的单次查询时间复杂度接近于O(log n),整棵树的高度也接近于log ...
- ASP.NET Core+Vue3 实现SignalR通讯
从ASP.NET Core 3.0版本开始,SignalR的Hub已经集成到了ASP.NET Core框架中.因此,在更高版本的ASP.NET Core中,不再需要单独引用Microsoft.AspN ...
- 【pwn】[SDCTF 2022]Horoscope--栈溢出,atoi函数绕过
checksec检查一下,发现只开了nx,然后ida打开直接看主函数 发现fgets函数往s里面读入320个字节的数据,此处可造成溢出,再看看test和debug函数 void debug(){ t ...
- nodejs 实现MQTT协议的服务器端和客户端的双向交互
一.项目背景 公司和第三方合作开发一个传感器项目,想要通过电脑或者手机去控制项目现场的传感器控制情况.现在的最大问题在于,现场的边缘终端设备接入的公网方式是无线接入,无法获取固定IP,所以常规的HTT ...
- 记一次有趣的hwclock写RTC的PermissionDenied错误
PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 环境说明 无 前言 稍微接触过嵌入式板卡的,基本都知道嵌 ...
- 逻辑回归(Logistic Regression) ----转载
概要: 1. 介绍Logistic Regression的数学模型,推导并详细解释求解最优回归系数的过程:2. Python实现Logistic Regression的基本版:3. 介绍sklearn ...
- HBuilderx 创建 、运行uniapp项目
uni-app官网介绍的 通过 HBuilderX 可视化界面 跟着小颖来创建一个自己的小程序 创建小程序 依次点击HBuilderx 左上方的按钮:文件->新建->项目 然后打开该界面, ...
- 【uniapp】【外包杯】图片跳转到页面
<navigator class="swiper-item":url="'/subpkg/goods_detail/goods_detail'">
- 通过.NET Core+Vue3 实现SignalR即时通讯功能
.NET Core 和 Vue3 结合使用 SignalR 可以实现强大的实时通讯功能,允许实时双向通信.在这个示例中,我们将详细说明如何创建一个简单的聊天应用程序,演示如何使用 .NET Core ...