在cesium中我们可以手动在地图中添加3d模型,通过准备好的资源进行添加,我们这里以飞机为例

// 定义一个名为 createModel 的函数,用于在 Cesium 场景中创建和显示一个 3D 模型
// 参数 url 是模型文件的路径,height 是模型的初始高度
function createModel(url, height) {
  // 清除场景中已有的所有实体,避免模型过多导致混乱
  viewer.entities.removeAll();

  // 根据给定的经纬度和高度,计算模型在地球上的初始位置
  // 这里使用了 Cesium 提供的 Cartesian3.fromDegrees 方法,将经纬度和高度转换为笛卡尔坐标
  const position = Cesium.Cartesian3.fromDegrees(
    -123.0744619, // 经度
    44.0503706,   // 纬度
    height,       // 高度
  );

  // 定义模型的初始朝向,这里使用了四元数来表示方向
  // heading 是绕 z 轴的旋转角度,单位是弧度,这里设置为 135 度
  const heading = Cesium.Math.toRadians(135);
  const pitch = 0;  // pitch 是绕 y 轴的旋转角度,这里设置为 0
  const roll = 0;   // roll 是绕 x 轴的旋转角度,这里设置为 0
  const hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
  // 根据位置和朝向计算模型的四元数方向
  const orientation = Cesium.Transforms.headingPitchRollQuaternion(position, hpr);

  // 在场景中添加一个新的实体,用于表示模型
  const entity = viewer.entities.add({
    name: url, // 将模型文件的路径作为实体的名称,方便识别
    position: position, // 设置实体的位置
    orientation: orientation, // 设置实体的方向
    model: { // 配置模型的相关属性
      uri: url, // 模型文件的路径
      minimumPixelSize: 128, // 模型在屏幕上的最小像素大小,保证模型在远处也能清晰显示
      maximumScale: 20000, // 模型的最大缩放比例,防止模型过大
    },
  });

  // 将新添加的模型实体设置为当前跟踪的实体,使场景的视角聚焦在该模型上
  viewer.trackedEntity = entity;
}

保存运行后如下

Logo

电影级数字人,免显卡端渲染SDK,十行代码即可调用,工业级demo免费开源下载!

更多推荐