Skip to content

二三维联动


ts
import { Viewer, Hawkeye } from "joDVF";
import { Pane } from "tweakpane";

const { mapContainer, uiContainer } = createContainer();

const viewer = new Viewer(mapContainer);
const hawkeye = new Hawkeye(viewer, {});
addUI();
function addUI() {
  const pane = new Pane({
    container: uiContainer,
    title: "操作"
  });

  const btnOpen = pane.addButton({
    title: "开启"
  });

  btnOpen.on("click", () => {
    hawkeye.open();
  });

  const btnClose = pane.addButton({
    title: "关闭"
  });

  btnClose.on("click", () => {
    hawkeye.close();
  });
}

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