倾斜压平

---

import { Viewer, Flatting } from "joDVF";
import { Pane } from "tweakpane";
import { Cesium3DTileset, HeadingPitchRange } from "joCesium";

const { mapContainer, uiContainer } = createContainer();

const viewer = new Viewer(mapContainer);

const scene = viewer.scene;
// scene.globe.depthTestAgainstTerrain = true;
const dataBaseURL = "./assets/3dtilesets/dayanta/tileset.json";
let flatting;
Cesium3DTileset.fromUrl(dataBaseURL).then((tile) => {
  const boundingSphere = tile.boundingSphere;
  const radius = boundingSphere.radius;

  viewer.scene.primitives.add(tile);
  viewer.zoomTo(tile, new HeadingPitchRange(-1.2, -0.6, radius * 4.0));

  flatting = new Flatting(viewer, {
    layer: tile,
    clampToGround: true
  });
});

const PARAMS = {
  chkShow: true,
  height: 0
};

addUI(uiContainer);

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
  };
}

function addUI(uiContainer) {
  const pane = new Pane({
    container: uiContainer,
    title: "参数"
  });
  pane.addBinding(PARAMS, "chkShow");
  pane.addBinding(PARAMS, "height");

  const startBtn = pane.addButton({
    title: "start",
    label: "倾斜压平" // optional
  });

  startBtn.on("click", () => {
    flatting.start(PARAMS.height);
  });

  const clearBtn = pane.addButton({
    title: "clear",
    label: "清除"
  });

  clearBtn.on("click", () => {
    flatting.clear();
  });

  pane.on("change", (ev: any) => {
    if (ev.target.key === "height") {
      const height = parseFloat(ev.value);
      flatting.updateHeight(height);
    }

    if (ev.target.key === "chkShow") {
      flatting.setVisibility(ev.value);
    }
  });
}