mirror of
https://github.com/visgl/luma.gl.git
synced 2025-12-08 17:36:19 +00:00
49 lines
1.4 KiB
HTML
49 lines
1.4 KiB
HTML
<!doctype html>
|
|
<head>
|
|
<style>
|
|
body {
|
|
background: black;
|
|
margin: 0;
|
|
}
|
|
|
|
canvas {
|
|
height: 100% !important;
|
|
width: 100% !important;
|
|
transition: opacity 1s ease-in-out;
|
|
}
|
|
|
|
#model-select {
|
|
position: absolute;
|
|
left: 10px;
|
|
top: 10px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<script type="module">
|
|
import {luma} from '@luma.gl/core';
|
|
import {WebGLDevice} from '@luma.gl/webgl';
|
|
// import {WebGPUDevice} from '@luma.gl/webgpu';
|
|
import {makeAnimationLoop} from '@luma.gl/engine';
|
|
import AnimationLoopTemplate from './app.ts';
|
|
|
|
luma.registerDevices([WebGLDevice]);
|
|
// luma.registerDevices([WebGLDevice, WebGPUDevice]);
|
|
|
|
const resolution = 2;
|
|
const device = luma.createDevice({width: resolution * window.innerWidth, height: resolution * window.innerHeight});
|
|
makeAnimationLoop(AnimationLoopTemplate, {device}).start();
|
|
</script>
|
|
<body>
|
|
<!-- Some test models from https://github.khronos.org/glTF-Sample-Viewer-Release -->
|
|
<select id="model-select">
|
|
<option value="Avocado">Avocado</option>
|
|
<option value="BoomBox">BoomBox</option>
|
|
<option value="Corset">Corset</option>
|
|
<option value="DamagedHelmet">DamagedHelmet</option>
|
|
<option value="FlightHelmet">FlightHelmet</option>
|
|
<option value="GlassBrokenWindow">GlassBrokenWindow</option>
|
|
<option value="StainedGlassLamp">StainedGlassLamp</option>
|
|
<option value="WaterBottle">WaterBottle</option>
|
|
</select>
|
|
</body>
|