Three.jsのパーティクルで画像のように均等に並んでいるパーティクルを作るのはどうしたらよろしいでしょうか?
また左上から順にフェードインさせる方法がありましたら何かアドバイス頂けると助かります。
■現在のコード
javascript
const canvas = document.getElementById('canvas'); const scene = new THREE.Scene(); const renderer = new THREE.WebGLRenderer(); renderer.setClearColor(new THREE.Color(0xffffff, 1)); renderer.setSize(400, 400); canvas.appendChild(renderer.domElement) const camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000); camera.position.x = 0; camera.position.y = 0; camera.position.z = 150; createSprites(); ref(); function createSprites() { let material = new THREE.SpriteMaterial(); for(let x = -5; x < 5; x++) { for(let y = -5; y < 5; y++) { let sprite = new THREE.Sprite(material); sprite.position.set(x * 10, y * 10, 0); scene.add(sprite); } } } function ref() { requestAnimationFrame(ref); renderer.render(scene, camera); }
まだ回答がついていません
会員登録して回答してみよう