Autodesk Forge Viewer中PDF与标记图层同步旋转问题求助

问题根源 #

直接通过model.setPlacementTransform()旋转PDF模型时，标记扩展（MarkupsCore）的图层不会自动同步模型变换——标记的坐标系统独立于模型的放置变换，导致旋转后标记与文档位置错位。

可行方案1：同步标记图层的变换矩阵 #

通过将模型的旋转平移矩阵直接应用到标记根节点，实现模型与标记的坐标系统统一。

代码实现

viewer.loadModel("TestSheet.pdf", {}, (model) => {
  // 原有PDF旋转逻辑
  const bb = model.getBoundingBox();
  const mx = new THREE.Matrix4();
  mx.makeRotationZ(90 * Math.PI / 180);
  mx.elements[12] = bb.max.y; // 平移修正位置
  model.setPlacementTransform(mx);

  // 同步标记图层变换
  const markupsExt = viewer.getExtension('Autodesk.Viewing.MarkupsCore');
  if (markupsExt) {
    const markupsRoot = markupsExt.markupsRoot;
    // 将模型变换矩阵同步到标记根节点
    markupsRoot.matrix.copy(mx);
    markupsRoot.matrix.decompose(markupsRoot.position, markupsRoot.quaternion, markupsRoot.scale);
    markupsRoot.matrixAutoUpdate = false;
    // 强制刷新标记渲染
    markupsExt.render();
  }
});

关键说明

• MarkupsCore的标记根节点markupsRoot是THREE.Object3D实例，支持直接应用矩阵变换
• 禁用matrixAutoUpdate避免Viewer自动覆盖自定义变换
• 同步后标记的交互坐标（如点击选择）会与旋转后的PDF完全匹配

可行方案2：旋转相机而非模型 #

通过旋转相机视角并调整导航参数，让视图呈现PDF旋转的效果，标记会随视图自动同步（无需修改标记坐标）。

代码实现

// 加载PDF后执行旋转相机逻辑
const model = viewer.model;
const nav = viewer.navigation;
const bb = model.getBoundingBox();
const modelCenter = bb.center();

// 设置旋转轴心为模型中心
nav.setPivotPoint(modelCenter);
// 绕Z轴旋转相机90度
const rotateAngle = THREE.MathUtils.degToRad(90);
nav.rotateAroundPivot(new THREE.Vector3(0, 0, rotateAngle));
// 适配视图到旋转后的模型
viewer.fitToView();

适用场景

• 仅需临时旋转视图，无需修改模型的持久化坐标
• 避免修改标记系统的底层变换逻辑

为什么CSS旋转不可行？ #

CSS旋转仅对Viewer的DOM渲染层做视觉变换，标记的实际交互坐标仍基于原始模型空间，会导致点击选择、编辑标记时出现严重错位，无法保证交互稳定性。

内容的提问来源于stack exchange，提问作者Chrissy Semens