Skip to content

相机旋转工具


ts
import { Viewer, CameraRotationTool } from "joDVF";
import { Cesium3DTileset, HeadingPitchRange } from "joCesium";

const { mapContainer, uiContainer } = createContainer();

const viewer = new Viewer(mapContainer);
const cameraRotationTool = new CameraRotationTool(viewer);
const options = {
  hpr: new HeadingPitchRange(Math.PI / 2.0, -Math.PI / 6.0, 200.0),
  speed: 30
};

/*
// 1. 绕某点旋转
const origin = new Cesium.Cartesian3(-2355020, 5372867, 2495186);
cameraRotationTool.surround(origin, options);
*/

// 2. 或者绕 3D tiles 旋转
try {
  const dataBaseURL = "./assets/3dtilesets/dayanta/tileset.json";
  const tileset = await Cesium3DTileset.fromUrl(dataBaseURL);
  viewer.scene.primitives.add(tileset);
  viewer.flyTo(tileset);
  cameraRotationTool.surround(tileset, options);
} catch (e) {
  console.log(e);
}

function createContainer() {
  const container = document.createElement("div");
  container.style.width = "100%";
  container.style.height = "100%";

  const uiContainer = document.createElement("div");
  uiContainer.style.position = "fixed";
  uiContainer.style.top = "5px";
  uiContainer.style.left = "5px";
  document.body.appendChild(container);
  document.body.appendChild(uiContainer);

  return {
    mapContainer: container,
    uiContainer
  };
}