点击查看:最新Cesium可视化系统实战视频课程

20250206184229b036a02eb31f53b712b7d500c13a360d168Cesium 是一个强大的开源地理信息系统 (GIS) 框架,广泛应用于三维地图可视化、地理数据的展示与分析等领域。在 Cesium 中,CZML(Cesium Language)是一个用于表示时间动态地理数据的标准格式,常用于传输和展示复杂的三维对象、动画和路径。本文将深入讲解 CZML 的应用及其在 Cesium 中的实际操作,帮助读者更好地理解如何在项目中使用 CZML 来实现动态和交互式的三维地理数据可视化。

1. CZML 介绍

CZML 是一种基于 JSON 格式的标记语言,用于在 Cesium 中描述时间序列的空间数据。它支持对地理对象、模型、路径等进行时间动态的描述。CZML 的核心目的是在 Cesium 中高效地加载和呈现动态数据。

一个典型的 CZML 文件包括多个对象,每个对象可以包含关于位置、方向、尺寸、材质、时间变化等信息。通过对这些对象进行描述,开发者能够创建如飞行路径、物体动画、动态天气等复杂场景。

CZML 文件的基本结构

一个 CZML 文件是由多个对象组成的,每个对象都有唯一的 id,并包含一个或多个属性,常见的属性有:

  • id:对象的唯一标识符。
  • name:对象的名称。
  • position:物体的地理位置。
  • boxmodelpath 等:对象的几何形态与外观。

每个对象也可以根据时间变化进行更新,这使得 CZML 文件在展示动态数据时具有很大的灵活性。

2. 示例代码解析

让我们以以下的代码为例,详细讲解如何使用 CZML 在 Cesium 中加载多个动态地理对象。


const czml = [
  {
    id: "document",
    name: "box",
    version: "1.0",
  },
  {
    id: "shape1",
    name: "Blue box",
    position: {
      cartographicDegrees: [-114.0, 40.0, 300000.0],
    },
    box: {
      dimensions: {
        cartesian: [400000.0, 300000.0, 500000.0],
      },
      material: {
        solidColor: {
          color: {
            rgba: [0, 0, 255, 255],
          },
        },
      },
    },
  },
  {
    id: "shape2",
    name: "Red box with black outline",
    position: {
      cartographicDegrees: [-107.0, 40.0, 300000.0],
    },
    box: {
      dimensions: {
        cartesian: [400000.0, 300000.0, 500000.0],
      },
      material: {
        solidColor: {
          color: {
            rgba: [255, 0, 0, 128],
          },
        },
      },
      outline: true,
      outlineColor: {
        rgba: [0, 0, 0, 255],
      },
    },
  },
  {
    id: "shape3",
    name: "Yellow box outline",
    position: {
      cartographicDegrees: [-100.0, 40.0, 300000.0],
    },
    box: {
      dimensions: {
        cartesian: [400000.0, 300000.0, 500000.0],
      },
      fill: false,
      outline: true,
      outlineColor: {
        rgba: [255, 255, 0, 255],
      },
    },
  },
];

const dataSource = Cesium.CzmlDataSource.load(czml);
viewer.dataSources.add(dataSource);
viewer.zoomTo(dataSource);

2.1 CZML 数据结构

这段代码定义了一个 CZML 数组,包含了三个不同的物体(shape1shape2shape3),每个物体具有不同的外观和属性。下面是这些物体的基本特性解析:

2.1.1 shape1 – 蓝色的盒子


{
  "id": "shape1",
  "name": "Blue box",
  "position": {
    "cartographicDegrees": [-114.0, 40.0, 300000.0]
  },
  "box": {
    "dimensions": {
      "cartesian": [400000.0, 300000.0, 500000.0]
    },
    "material": {
      "solidColor": {
        "color": {
          "rgba": [0, 0, 255, 255]
        }
      }
    }
  }
}

  • 位置shape1 物体的位置通过 cartographicDegrees 属性定义,其值是 [经度, 纬度, 高度],即 [-114.0, 40.0, 300000.0]。
  • 尺寸:盒子的尺寸是通过 cartesian 定义的,表示盒子在三维空间中的长、宽、高分别为 400000, 300000 和 500000。
  • 材质shape1 物体的颜色是蓝色,通过 rgba 属性指定其颜色为纯蓝色。

2.1.2 shape2 – 红色盒子,带黑色轮廓


{
  "id": "shape2",
  "name": "Red box with black outline",
  "position": {
    "cartographicDegrees": [-107.0, 40.0, 300000.0]
  },
  "box": {
    "dimensions": {
      "cartesian": [400000.0, 300000.0, 500000.0]
    },
    "material": {
      "solidColor": {
        "color": {
          "rgba": [255, 0, 0, 128]
        }
      }
    },
    "outline": true,
    "outlineColor": {
      "rgba": [0, 0, 0, 255]
    }
  }
}


  • 颜色:该盒子的填充颜色是半透明的红色,通过 rgba 颜色值 [255, 0, 0, 128]
  • 轮廓:通过 outline 设置为 true,表示盒子有轮廓。轮廓的颜色通过 outlineColor 设置为黑色 [0, 0, 0, 255]

2.1.3 shape3 – 只有轮廓的黄色盒子


{
  "id": "shape3",
  "name": "Yellow box outline",
  "position": {
    "cartographicDegrees": [-100.0, 40.0, 300000.0]
  },
  "box": {
    "dimensions": {
      "cartesian": [400000.0, 300000.0, 500000.0]
    },
    "fill": false,
    "outline": true,
    "outlineColor": {
      "rgba": [255, 255, 0, 255]
    }
  }
}


  • 颜色:这个盒子没有填充(fill: false),仅有黄色的轮廓。轮廓颜色是纯黄色 [255, 255, 0, 255]

2.2 加载和显示 CZML


const dataSource = Cesium.CzmlDataSource.load(czml);
viewer.dataSources.add(dataSource);
viewer.zoomTo(dataSource);
  • Cesium.CzmlDataSource.load(czml):加载包含在 czml 变量中的 CZML 数据。
  • viewer.dataSources.add(dataSource):将加载的数据源添加到 Cesium 的 viewer 中,显示在地图上。
  • viewer.zoomTo(dataSource):将视角缩放至包含数据源的区域,确保用户可以看到所有加载的物体。

3. CZML 的应用场景

CZML 格式非常适合展示需要动态变化的三维地理对象,如以下几种场景:

3.1 动态路径与轨迹展示

使用 CZML,可以展示飞机、车辆等移动物体的轨迹。例如,飞机的飞行路径可以通过动态位置数据来描述,从而实现航迹线的实时展示。

3.2 动态地理对象展示

对于一些需要在地理空间中动态展示的对象,如地震、风速、气候数据等,CZML 能够通过时间戳来描述这些对象随时间变化的状态。

3.3 时序动画效果

CZML 支持将时间属性与物体属性关联,开发者可以实现物体的动态变换。例如,物体的大小、颜色、材质等可以根据时间变化动态调整,适用于模拟天气变化、爆炸效果等复杂场景。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注