假設(shè)我在 Three.js 中有一個盒子,我想在不同的方向上遞增。我基本上想用矩形畫線,指向隨機位置。目前我只是增加 x 導(dǎo)致從左到右繪制一條線。是否可以旋轉(zhuǎn)我的矩形,使其朝不同的方向移動,而無需更改更新函數(shù)中 x 的增量。如果有某種“旋轉(zhuǎn)畫布”的方式,那確實會很方便。這是我在 codepen 上的代碼 https://codepen.io/haangglide/pen/vYGbQRm代碼:var scene, camera, renderer, material, plane;init();function init() { scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); camera.position.z = 100; renderer = new THREE.WebGLRenderer({ alpha: true, preserveDrawingBuffer: true }); renderer.autoClearColor = false; renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); scene = new THREE.Scene(); window.addEventListener('resize', onResize, false); drawLines(); update();}function drawLines() { var col = new THREE.Color(Math.random(), Math.random(), Math.random()); material = new THREE.LineBasicMaterial({ color: col, linewidth: 5 }) var geometry = new THREE.PlaneBufferGeometry(5, 20, 32); plane = new THREE.Mesh(geometry, material); scene.add(plane);}function update() { setTimeout(function () { requestAnimationFrame(update); }, 1000 / 60); plane.position.x += 1; if (plane.position.x > 50) drawLines() renderer.render(scene, camera);}function onResize() { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize(window.innerWidth, window.innerHeight);}
three.js中不同方向的繪制和旋轉(zhuǎn)
精慕HU
2023-03-24 16:20:06