Declarative THREE.js in Angular

Building 3D scenes with Angular has never been easier. Learn how Angular's powerful features like Dependency Injection and Content Projection bring what's possible to the table.
Slides: slides.com/cha...
GitHub Repo: github.com/nar...
Angular Three Demo: stackblitz.com...
ThreeJS Website: threejs.org/
ThreeJS+Svelte in play: / 1422753774096031750

[@nguyenhoa7759]

Cool, the great idea makes the great library. I was surprised by the way creating all those stuff inside the canvas! Thanks for your contribution 👍

[@greeffer]

Good presentation! I was learning threejs with React. OMG, what a nightmare! I'm switching to Angular.

[@theotherme9965]

😍 Awesome 😍

[@angularkenya]

Thanks 🤗

[@sryvenky376]

ViewChild('canvasElement', {static:true}) canvasElementRef:ElementRef< HTMLCanvasElement >; not working

[@mostafakamel4475]

first i installed this package npm install --save @types/three
second add this in ts :-
import * as THREE from 'three';
const w = window.innerWidth;
const h = window.innerHeight;
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(60, w / h, 1, 1000);
const renderer = new THREE.WebGLRenderer();
renderer.setSize(w, h);
document.body.appendChild(renderer.domElement);
const geometry = new THREE.BoxGeometry();
const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
const cube = new THREE.Mesh(geometry, material);
scene.add(cube);
camera.position.z = 5;
const animate = function () {
requestAnimationFrame(animate);
cube.rotation.x += 0.01;
cube.rotation.y += 0.01;
renderer.render(scene, camera);
};
animate();
and when i serve i had this problem in console "Module not found: Error: Can't resolve 'three' in 'M:\\projects\\ang-proj\\book-shop\\src\\app\\three'"
can you help me