#three.js #rendering
#three.js #визуализация
Вопрос:
Прежде чем я начну выдергивать волосы, я хотел спросить, что именно я делаю не так. Сейчас поздняя ночь, и все, что я хочу сделать, это нарисовать куб, который я могу перемещать с помощью мыши. Я понятия не имею, почему вообще ничего не помогает, и любая помощь была бы очень признательна.
import * as THREE from "../node_modules/three/build/three.module.js"; import { TrackballControls } from '../node_modules/three/examples/jsm/controls/TrackballControls.js'; const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.6, 1200); camera.position.z = 10; const renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setClearColor("#233143"); renderer.setSize(window.innerWidth,window.innerHeight); document.body.appendChild(renderer.domElement); window.addEventListener('resize', () =gt; { renderer.setSize(window.innerWidth, window.innerHeight); camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); }) const boxGeometry = new THREE.BoxGeometry(2,2,2); const boxMaterial = new THREE.MeshLambertMaterial({color: 0xFFFFFF}); const boxMesh = new THREE.Mesh(boxGeometry,boxMaterial); boxMesh.rotation.set(40,0,40); scene.add(boxMesh); const light = new THREE.PointLight(0xFFFFFF,1,100); light.position.set(5,5,5); scene.add(light); // Lights const lights = []; const lightValues = [ {colour: 0x14D14A, intensity: 8, dist: 12, x: 1, y: 0, z: 8}, {colour: 0xBE61CF, intensity: 6, dist: 12, x: -2, y: 1, z: -10}, {colour: 0x00FFFF, intensity: 3, dist: 10, x: 0, y: 10, z: 1}, {colour: 0x00FF00, intensity: 6, dist: 12, x: 0, y: -10, z: -1}, {colour: 0x16A7F5, intensity: 6, dist: 12, x: 10, y: 3, z: 0}, {colour: 0x90F615, intensity: 6, dist: 12, x: -10, y: -1, z: 0} ]; for (let i=0; ilt;6; i ) { lights[i] = new THREE.PointLight( lightValues[i]['colour'], lightValues[i]['intensity'], lightValues[i]['dist']); lights[i].position.set( lightValues[i]['x'], lightValues[i]['y'], lightValues[i]['z']); scene.add(lights[i]); } const rendering = function() { requestAnimationFrame(rendering); controls.update(); // Constantly rotate box scene.rotation.z -= 0.005; scene.rotation.x -= 0.01; renderer.render(scene, camera); } rendering();
Я перепробовал почти все, что мог придумать, чтобы решить свои проблемы, но ничего не работает. Мое лучшее предположение состоит в том, что это как-то связано с константой визуализации, но я ни за что на свете не могу понять, что я написал в ней неправильно.
Комментарии:
1. У вас есть
controls.update()
цикл анимации, но у вас нет экземпляра элементов управления.