遍历数组并为每个条目将对象添加到场景将对象添加到相同位置

Question

我正在尝试为数组中的每个项目向我的 three.js 场景添加一个对象。我无法判断是否所有对象都添加到场景中，因为它们都添加到同一位置，而且我无法弄清楚如何更改每个对象的位置。

下面是循环代码并为数组中的每个项目添加一个立方体：

var geometry = new THREE.BoxGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
var cube = new THREE.Mesh( geometry, material );

getData()
async function getData() {
    const response = await fetch('/api/indexvr');
    const data = await response.json();
    console.log(data)

    for (var i=0; i<data.length; i++) {
        try {
        scene.add( cube );
        // cube.position.y = i //1++
        } catch (e) {
            console.error(e)
        }
    }
}   

camera.position.z = 5;

我也试过在 for 循环中声明立方体及其位置，但这也没有用。我需要所有对象都是可见的，并且它们的位置是动态的，具体取决于数组中的数量，例如像相机周围的圆圈，如果超过 10/15，将 y 轴增加 4，然后再次继续圆圈。我不知道如何或找不到文档来帮助。有什么想法或链接可以帮助吗？提前致谢。

编辑：使用从 Mugen87 收到的代码，立方体现在看起来像这样。

Answer 1

像这样尝试（如果@gman 执行反馈）：

var geometry = new THREE.BoxGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );

getData()
async function getData() {
    const response = await fetch('/api/indexvr');
    const data = await response.json();
    console.log(data)

    for (var i=0; i<data.length; i++) {

        var cube = new THREE.Mesh( geometry, material );
        cube.position.y = i;
        scene.add( cube );

    }
}   

camera.position.z = 5;

遍历数组并为每个条目将对象添加到场景将对象添加到相同位置

Looping through array and adding object to scene for each entry adds objects to the same position

three.js

virtual-reality