Cesium--旋转3dtiles

以下代码来自Cesium 论坛:3DTileset rotation - CesiumJS - Cesium Community

在1.118中测试可行,可直接在Sandcastle中运行:

复制代码
const viewer = new Cesium.Viewer("cesiumContainer", {
  terrain: Cesium.Terrain.fromWorldTerrain(),
});

// Disable the ("globe") rotation for left mouse drags
viewer.scene.screenSpaceCameraController.enableRotate = false;

let tileset = viewer.scene.primitives.add(
  await Cesium.Cesium3DTileset.fromIonAssetId(40866)
);

// Store the transform of the root node of the
// tileset as the "root transform", assign this
// as the initial model matrix, and set the
// transform of the root node to be the identity
const rootTransform = Cesium.Matrix4.clone(tileset.root.transform);
tileset.modelMatrix = Cesium.Matrix4.clone(rootTransform);
tileset.root.transform = Cesium.Matrix4.clone(Cesium.Matrix4.IDENTITY);
const fullRotationMatrix = Cesium.Matrix4.clone(Cesium.Matrix4.IDENTITY);

let selectedTileset;
let initialMousePosition;
const enableTransformEditor = true;

const handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);

handler.setInputAction(async (click) => {
  const pickedObject = viewer.scene.pick(click.position);
  if (enableTransformEditor && pickedObject && !pickedObject.id) {
    selectedTileset = pickedObject.primitive;
    initialMousePosition = Cesium.Cartesian2.clone(click.position);
  }
}, Cesium.ScreenSpaceEventType.LEFT_DOWN);

handler.setInputAction((click) => {
  selectedTileset = null;
  initialMousePosition = null;
}, Cesium.ScreenSpaceEventType.LEFT_UP);

handler.setInputAction((movement) => {
  if (selectedTileset && initialMousePosition) {
    const translation = new Cesium.Cartesian3();
    Cesium.Matrix4.getTranslation(selectedTileset.modelMatrix, translation);

    const dx = movement.endPosition.x - initialMousePosition.x;
    const yaw = Cesium.Math.toRadians(dx);

    // Compute the rotation matrix, and multiply it
    // to the "full rotation matrix"
    const rotation3 = Cesium.Matrix3.fromRotationZ(yaw);
    const rotationMatrix = Cesium.Matrix4.fromRotation(rotation3);

    Cesium.Matrix4.multiply(
      fullRotationMatrix,
      rotationMatrix,
      fullRotationMatrix
    );

    // Compute the new model matrix from the
    // root transform and the full rotation matrix
    const newModelMatrix = Cesium.Matrix4.clone(Cesium.Matrix4.IDENTITY);
    Cesium.Matrix4.multiply(rootTransform, fullRotationMatrix, newModelMatrix);

    // Apply the new model matrix
    selectedTileset.modelMatrix = newModelMatrix;

    // Update initialMousePosition for the next movement
    initialMousePosition = Cesium.Cartesian2.clone(movement.endPosition);
  }
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);

viewer.zoomTo(tileset);
相关推荐
daifgFuture18 小时前
Android 3D球形水平圆形旋转,旋转动态更换图片
android·3d
牧子川1 天前
【论文解读】CVPR2023 PoseFormerV2:3D人体姿态估计(附论文地址)
3d·cvpr2023·poseformerv2
资深设备全生命周期管理1 天前
优化版本,增加3D 视觉 查看前面的记录
3d
m0_748250741 天前
GPUCUDA 发展编年史:从 3D 渲染到 AI 大模型时代(上)
人工智能·3d
少林6592 天前
谷歌地图高清卫星地图2026中文版下载|谷歌地图3D卫星高清版 V7.3.6.9796 最新免费版下载 - 前端工具导航
3d·谷歌地图
LeonDL1682 天前
HALCON 深度学习训练 3D 图像的几种方式优缺点
人工智能·python·深度学习·3d·halcon·halcon训练3d图像·深度学习训练3d图像
xhload3d3 天前
图扑软件 | 带你体验 Low Poly 卡通三维世界
物联网·3d·智慧城市·html5·webgl·数字孪生·可视化·工业互联网·三维建模·工控·轻量化·中国风·卡通动画·写实风格·科技风·low poly
图扑数字孪生3 天前
基于 HT for Web 轻量化 3D 数字孪生数据中心解决方案
3d·数字孪生·三维可视化·数据中心·智慧机房
njsgcs3 天前
PolyGen:一个用于 3D 网格的自回归生成模型 论文阅读
3d
Angel Q.3 天前
PnP(Perspective-n-Point)算法 | 用于求解已知n个3D点及其对应2D投影点的相机位姿
数码相机·算法·3d·pnp