import { CameraFlyTo } from "resium";
import { Cartesian3 } from "cesium";
import MapLayout from "@/components/map/Layout";
import CustomToolbar from "@/components/common/CustomToolbar";
import CustomClock from "@/components/common/CustomClock";
import ViewerImageLayer from "./ViewerImageLayer";
import WavePoint from "@/components/common/WavePoint";

function ViewerOne({ children }) {
  return (
    <div className="domain-viewer">
      <MapLayout>
        <div className="title" style={{ zIndex: 999 }}>
          两极协同—连接南极和北极的热带大西洋经向模的媒介作用
        </div>
        <CustomToolbar />
        <CustomClock />
        <CameraFlyTo
          duration={5}
          destination={Cartesian3.fromDegrees(80, -85, 10000000)}
        />

        <WavePoint stationLon={88} stationLat={-85} labelText={"南极"} />
        <ViewerImageLayer name="4_3_1_antnew" opacity={1.0} />
        {children}
      </MapLayout>
    </div>
  );
}

export default ViewerOne;