Блог

Я пытаюсь дублировать массив строк, но когда я это делаю, предыдущие каким-то образом становятся темными или невидимыми. К предыдущим строкам все еще можно получить доступ со всеми их свойствами, и я проверил, что они также имеют правильное расположение. Я сдвигаю оба набора строк, и предыдущие не видны. Кто-нибудь знает, в чем может быть проблема?

 var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

var lines = []

currentIndex = 0;

addLines()

duplicateLines(0)

var lineColorGradientList = [
    0x100FFF,
    0x0F76FF,
    0x0FE0FF,
    0x0FFFB3,
    0x0FFF4A,
    0x3DFF0F,
    0xA7FF0F,
    0xFFED0F
]

function addLines(){

    var linesArray = []

    for(i=0; i<8;   i){

        var geometry = new THREE.Geometry();
        geometry.vertices.push(
                new THREE.Vector3(0, 0, 2),
                new THREE.Vector3(3, 0, 0));
    
    
        var color = lineColorGradientList[i]
            
        var material = new THREE.LineBasicMaterial({
            color: color
        });
            
        var line = new THREE.Line( geometry, material );
        line.geometry.verticesNeedUpdate = true;
        line.material.needsUpdate = true

        linesArray.push(line)
        
    }
    
    linesArray.forEach(function(line) {
        line.frustumCulled = false;
        scene.add(line);
    });

    
    lines.push(linesArray)
    
}


function duplicateLines(selectedIndex){

    currentIndex  = 1
    
    var linesArray = []
    for(i=0; i<8;   i){
        var line = lines[selectedIndex][i].clone()
        line.geometry.verticesNeedUpdate = true;
        line.material.needsUpdate = true
        linesArray.push(line)
    }
    lines.push(linesArray)
    
    lines[currentIndex].forEach(function(line) {
        line.frustumCulled = false;
        scene.add(line);
    });
    
}
  

Вам также необходимо клонировать геометрию, чтобы она работала.

Моя исправленная функция duplicateLinesFunction:

 function duplicateLines(selectedIndex){

    currentIndex  = 1
    
    var linesArray = []
    for(i=0; i<8;   i){
        var line = lines[selectedIndex][i].clone()
        line.geometry = lines[selectedIndex][i].geometry.clone()
        line.geometry.verticesNeedUpdate = true;
        line.material = lines[selectedIndex][i].material.clone()
        line.material.needsUpdate = true
        linesArray.push(line)
    }
    lines.push(linesArray)
    
    lines[currentIndex].forEach(function(line) {
        line.frustumCulled = false;
        scene.add(line);
    });
    
}