package.json
+3
-1
diff --git a/package.json b/package.json
index 96c0d19..ec081b5 100644
@@ -9,9 +9,11 @@
"preview": "vite preview"
},
"devDependencies": {
"@mkkellogg/gaussian-splats-3d": "^0.4.7",
"@types/three": "^0.185.1",
"three": "^0.185.1",
"typescript": "~6.0.2",
"vite": "^8.1.1"
"vite": "^8.1.1",
"vite-plugin-cross-origin-isolation": "^0.1.6"
}
}
pnpm-lock.yaml
+20
-0
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e4b184a..b0b217a 100644
@@ -8,6 +8,9 @@ importers:
.:
devDependencies:
'@mkkellogg/gaussian-splats-3d':
specifier: ^0.4.7
version: 0.4.7(three@0.185.1)
'@types/three':
specifier: ^0.185.1
version: 0.185.1
@@ -20,6 +23,9 @@ importers:
vite:
specifier: ^8.1.1
version: 8.1.5
vite-plugin-cross-origin-isolation:
specifier: ^0.1.6
version: 0.1.6
packages:
@@ -35,6 +41,11 @@ packages:
'@emnapi/wasi-threads@1.2.2':
resolution: {integrity: sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==}
'@mkkellogg/gaussian-splats-3d@0.4.7':
resolution: {integrity: sha512-0vy9/i9sJLFH/v3WJZ4axCsqjkToe8UsV3xY7bvK5EUC0akiRsWZODoCiSzpxhTLNyzSKTsyQKozIFeNA5RWRA==}
peerDependencies:
three: '>=0.160.0'
'@napi-rs/wasm-runtime@1.1.6':
resolution: {integrity: sha512-ZLv/JdUfkvOy9eCnnBaGfiO+XimbjebAeO+MRQqD/B+FR1tnRN0tpKSJHRbE8sFfS6aqsXZ67TQjfwfsxULVbg==}
peerDependencies:
@@ -295,6 +306,9 @@ packages:
engines: {node: '>=14.17'}
hasBin: true
vite-plugin-cross-origin-isolation@0.1.6:
resolution: {integrity: sha512-OY0naW9nPUDrKTffYnY7FRYXOgZdHoNwMGpPxUmj/n32mGZi01fcq+J536jkmwGWX7DLT95XBQVHHbrAJzTvrw==}
vite@8.1.5:
resolution: {integrity: sha512-7ULLwsCdYx/nRyrpiEwvqb5TFHrMVZyBt+rg/OAXT7rgj/z+DtTDyKFeLAdDkubDVDKD8jOsndmy7m55XcfUsw==}
engines: {node: ^20.19.0 || >=22.12.0}
@@ -358,6 +372,10 @@ snapshots:
tslib: 2.8.1
optional: true
'@mkkellogg/gaussian-splats-3d@0.4.7(three@0.185.1)':
dependencies:
three: 0.185.1
'@napi-rs/wasm-runtime@1.1.6(@emnapi/core@1.11.1)(@emnapi/runtime@1.11.1)':
dependencies:
'@emnapi/core': 1.11.1
@@ -547,6 +565,8 @@ snapshots:
typescript@6.0.3: {}
vite-plugin-cross-origin-isolation@0.1.6: {}
vite@8.1.5:
dependencies:
lightningcss: 1.33.0
public/bedroom.ply
+0
-0
diff --git a/public/bedroom.ply b/public/bedroom.ply
new file mode 100644
index 0000000..b7b241a
Binary files /dev/null and b/public/bedroom.ply differ
src/main.ts
+55
-13
diff --git a/src/main.ts b/src/main.ts
index b1841aa..cd7ca05 100644
@@ -1,5 +1,12 @@
import "./style.css";
import { AmbientLight, PerspectiveCamera, Scene, WebGLRenderer } from "three";
import {
Viewer,
WebXRMode,
RenderMode,
SceneRevealMode,
LogLevel,
} from "@mkkellogg/gaussian-splats-3d";
import { OrbitControls } from "three/addons/controls/OrbitControls.js";
import { OBJLoader } from "three/addons/loaders/OBJLoader.js";
import { MTLLoader } from "three/addons/loaders/MTLLoader.js";
@@ -7,24 +14,24 @@ import { MTLLoader } from "three/addons/loaders/MTLLoader.js";
declare const view: HTMLCanvasElement;
declare const progress: HTMLProgressElement;
const scene = new Scene();
const threeScene = new Scene();
const mtlLoader = new MTLLoader();
const materials = await mtlLoader.loadAsync("me.mtl");
materials.preload();
const objLoader = new OBJLoader();
objLoader.setMaterials(materials);
const marten = await objLoader.loadAsync(
"me.obj",
(e) => (progress.value = e.loaded / e.total),
);
marten.scale.setScalar(0.001);
marten.rotateX(-Math.PI / 2);
marten.rotateZ(-Math.PI / 4);
scene.add(marten);
const martenTask = objLoader
.loadAsync("me.obj", (e) => (progress.value = e.loaded / e.total))
.then((marten) => {
marten.scale.setScalar(0.001);
marten.rotateX(-Math.PI / 2);
marten.rotateZ(-Math.PI / 4);
threeScene.add(marten);
});
const ambientLight = new AmbientLight(0xfffdf1);
scene.add(ambientLight);
threeScene.add(ambientLight);
const camera = new PerspectiveCamera(75, view.width / view.height, 0.001, 10.0);
camera.position.y = 0.6;
@@ -42,12 +49,45 @@ const renderer = new WebGLRenderer({
canvas: view,
});
renderer.setSize(view.width, view.height, false);
renderer.setAnimationLoop(animate);
progress.hidden = true;
const splatViewer = new Viewer({
selfDriveMode: false,
renderer,
camera,
threeScene,
useBuiltInControls: false,
ignoreDevicePixelRatio: false,
gpuAcceleratedSort: false,
enableSIMDInSort: true,
sharedMemoryForWorkers: false,
integerBasedSort: true,
halfPrecisionCovariancesOnGPU: false,
dynamicScene: false,
webXRMode: WebXRMode.None,
renderMode: RenderMode.Always,
sceneRevealMode: SceneRevealMode.Instant,
antialiased: false,
focalAdjustment: 1.0,
logLevel: LogLevel.Debug,
sphericalHarmonicsDegree: 0,
inMemoryCompressionLevel: 2,
freeIntermediateSplatData: false,
});
await splatViewer.addSplatScenes([
{
path: "bedroom.ply",
scale: [0.4, 0.4, 0.4],
rotation: [0.9997838, 0, 0, 0.0207948],
position: [0, 0.55, 0],
},
]);
await martenTask;
requestAnimationFrame(animate);
let prevTime: number | null = null;
function animate(time: number) {
progress.hidden = true;
const rect = view.getBoundingClientRect();
view.width = rect.width;
view.height = rect.height;
@@ -62,7 +102,9 @@ function animate(time: number) {
controls.target.y = Math.min(Math.max(-1, controls.target.y), 1);
}
renderer.render(scene, camera);
splatViewer.update();
splatViewer.render();
prevTime = time;
requestAnimationFrame(animate);
}
src/types.d.ts
+1
-0
diff --git a/src/types.d.ts b/src/types.d.ts
new file mode 100644
index 0000000..c01d18d
@@ -0,0 +1 @@
declare module "@mkkellogg/gaussian-splats-3d";
vite.config.js
+16
-0
diff --git a/vite.config.js b/vite.config.js
new file mode 100644
index 0000000..bcadb08
@@ -0,0 +1,16 @@
import { defineConfig } from "vite";
export default defineConfig({
plugins: [
{
name: "configure-response-headers",
configureServer: (server) => {
server.middlewares.use((_req, res, next) => {
res.setHeader("Cross-Origin-Embedder-Policy", "require-corp");
res.setHeader("Cross-Origin-Opener-Policy", "same-origin");
next();
});
},
},
],
});