blockly3d/src/components/ThreeView.tsx

18 lines
605 B
TypeScript

import { Canvas } from '@react-three/fiber';
import { observer } from 'mobx-react-lite';
import { state } from '../state';
import { WorldView } from './WorldView';
export const ThreeView = observer(function () {
return (
<div style={{ width: '800px', height: '600px', border: '1px solid #333', borderRadius: '8px', overflow: 'hidden' }}>
<Canvas
camera={state.world.character.camera}
onPointerMissed={() => state.worldEditor.setSelectedObjectId(undefined)}
>
<WorldView />
</Canvas>
</div>
)
});