46 lines
1 KiB
TypeScript
46 lines
1 KiB
TypeScript
"use client";
|
|
|
|
import { useContext, useEffect, useRef } from "react";
|
|
import {
|
|
SceneViewContext,
|
|
SceneViewContextType,
|
|
} from "../providers/scene-view-provider";
|
|
|
|
async function lazyLoad() {
|
|
const { SceneView } = await import("../three/SceneView");
|
|
return SceneView;
|
|
}
|
|
|
|
export function Map({ modelId }: { modelId: string }) {
|
|
const divRef = useRef<HTMLDivElement>(null);
|
|
const { setSceneView } = useContext(SceneViewContext) as SceneViewContextType;
|
|
|
|
useEffect(() => {
|
|
let ignore = false;
|
|
if (!divRef.current) return;
|
|
|
|
async function loadScene() {
|
|
if (divRef.current) {
|
|
const SceneView = await lazyLoad();
|
|
const _sceneView = await SceneView.create(divRef.current, modelId);
|
|
if (_sceneView) {
|
|
setSceneView(_sceneView);
|
|
}
|
|
}
|
|
}
|
|
|
|
if (!ignore) {
|
|
loadScene();
|
|
}
|
|
|
|
return () => {
|
|
ignore = true;
|
|
};
|
|
}, [divRef, setSceneView, modelId]);
|
|
|
|
return (
|
|
<div className="w-full h-full">
|
|
<div className="w-full h-full" ref={divRef}></div>
|
|
</div>
|
|
);
|
|
}
|