Commit e0247a37 authored by Chunchi Che's avatar Chunchi Che

Merge branch 'feat/migrate/babylon.js' into 'main'

Feat/migrate/babylon.js

See merge request !7
parents 4211f144 8b40ef3d
Pipeline #17375 passed with stages
in 1 minute and 53 seconds
This source diff could not be displayed because it is too large. You can view the blob instead.
import React from "react";
import JoinRoom from "./JoinRoom";
import WaitRoom from "./WaitRoom";
import ThreeJs from "../ThreeJs";
import ThreeJs from "./ThreeJs";
import BabylonJs from "./BabylonJs";
import { Routes, Route } from "react-router-dom";
function App() {
......@@ -9,7 +10,8 @@ function App() {
<Routes>
<Route path="/" element={<JoinRoom />} />
<Route path="/:player/:passWd/:ip" element={<WaitRoom />} />
<Route path="/three.js" element={<ThreeJs />} />
<Route path="/three" element={<ThreeJs />} />
<Route path="/babylon" element={<BabylonJs />} />
</Routes>
);
}
......
import React, { useEffect, useRef } from "react";
import * as BABYLON from "@babylonjs/core";
export default function () {
const canvasRef = useRef<HTMLCanvasElement>(null);
useEffect(() => {
if (canvasRef.current) {
const canvasCurrent = canvasRef.current;
const engine = new BABYLON.Engine(canvasCurrent, true);
const scene = new BABYLON.Scene(engine);
const camera = new BABYLON.FreeCamera(
"camera1",
new BABYLON.Vector3(0, 5, -10),
scene
);
camera.setTarget(BABYLON.Vector3.Zero());
camera.attachControl(canvasCurrent, true);
const light = new BABYLON.HemisphericLight(
"light",
new BABYLON.Vector3(0, 1, 0),
scene
);
light.intensity = 0.7;
const sphere = BABYLON.MeshBuilder.CreateSphere(
"sphere",
{ diameter: 2, segments: 32 },
scene
);
sphere.position.y = 1;
const ground = BABYLON.MeshBuilder.CreateGround(
"ground",
{ width: 6, height: 6 },
scene
);
engine.runRenderLoop(() => {
scene.render();
});
}
}, [canvasRef]);
return <canvas ref={canvasRef} />;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment