shx-3d-render

main
Jan Umbach 2024-06-13 21:15:38 +02:00
parent 5d57010d46
commit 59992075b9
1 changed files with 6 additions and 3 deletions

View File

@ -99,6 +99,7 @@
this.container = this.querySelector('.shx-input-forms-container');
let container = this.container;
let threeJS = null;
let tJS_scene = null;
let tJS_camera = null;
let tJS_renderer = null;
@ -122,13 +123,15 @@
console.log('threejs loaded');
import("{{ 'three.module.min.js' | asset_url }}").then(THREE => {
threeJS = THREE;
// calc width and height
const width = container.offsetWidth;
const height = width;
// Your Three.js code goes here
tJS_scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
tJS_camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
tJS_renderer = new THREE.WebGLRenderer();
@ -145,12 +148,12 @@
const cube = new THREE.Mesh(geometry, material);
tJS_scene.add(cube);
camera.position.z = 5;
tJS_camera.position.z = 5;
function animate() {
cube.rotation.x += 0.01;
cube.rotation.y += 0.01;
tJS_renderer.render(tJS_scene, camera);
tJS_renderer.render(tJS_scene, tJS_camera);
}
});