Problema
¿Por qué no puedo rotar el ángulo de un objeto? (scene.rotation.x += 0.03;)
La cámara puede, pero el objeto de la escena no.
He estado buscando durante mucho tiempo y todavía no puedo encontrar la respuesta.
Aquí está el myCode:
import * as THREE from 'https://unpkg.com/three@0.126.1/build/three.module.js' import { OrbitControls } from 'https://unpkg.com/three@0.126.1/examples/jsm/controls/OrbitControls.js' import { GLTFLoader } from 'https://unpkg.com/three@0.126.1/examples/jsm/loaders/GLTFLoader.js' const canvas = document.querySelector('.fan1') // it is my class const scene = new THREE.Scene() var ourObj; const loader = new GLTFLoader() //load glb file loader.load('assets/fan.glb', function (glb) { const root = glb.scene; root.scale.set(10,10,10) scene.add(root); }, function (xhr) { //xhr console.log("xhr"); }, function (error) { //error console.log("error"); }) const light = new THREE.DirectionalLight(0xffffff, 1); light.position.set(2, 2, 5); scene.add(light); const size = { width: window.innerWidth, height: window.innerHeight } const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 100); camera.position.set(0, 1, 3); scene.add(camera); const renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true, canvas: canvas }) renderer.setClearColor("#DDDDDD"); renderer.setSize(size.width, size.height); renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2)) var render = function () { requestAnimationFrame(render); scene.rotation.x += 0.03; renderer.render(scene, camera); }; render()El control _x no es válido
El problema es que estás agregando la cámara a la escena con scene.add(camera); Esto significa que cuando giras la escena, la cámara gira con ella , por lo que no notarás mucho movimiento en el renderizado final.
No necesita agregar su cámara a su escena. Solo elimina la linea
scene.add(camera);para que tu cámara sea "libre" e independiente de cualquier transformación de escena.