通过下拉列表选择 JavaScript 更改对象的尺寸答案

【问题标题】：change dimension of an object by drop-down list selection JavaScript通过下拉列表选择 JavaScript 更改对象的尺寸
【发布时间】：2018-06-26 06:05:25
【问题描述】：

我需要通过下拉列表选择更改 3D 模型中特定对象的尺寸。

var activities = document.getElementById("stand");   
var wallMaterial = new THREE.MeshLambertMaterial({color:resources.settings.wallColor});
var partitionLeft = new THREE.Mesh(geometries.partition, materials.partitionMaterial);

alert(activities);

activities.addEventListener("change", function() {
    if(activities.options[activities.selectedIndex].value=="stand1") {
        var footRight = new THREE.Mesh(new THREE.BoxGeometry(0.140, 0.15, 0.05), materials.footRightMaterial);
        partitionLeft.add(footRight);
        footRight.position.set(1.15,-1.85,0);

    } else {
        var footRight = new THREE.Mesh(new THREE.BoxGeometry(6.450, 4.15, 5.25), materials.footRightMaterial);
        partitionLeft.add(footRight);
        footRight.position.set(0.15,-0.85,0);
    }
});

此解决方案中的问题是，当从一个选项切换到另一个（下拉）选项时，选项 1 的前一个维度仍然存在。它没有隐藏。

选择第二个选项后，两个数字都出现在模型中。然后从下拉菜单中更改选项时不会发生任何事情。两个对象都出现在模型中。

我需要做的是在更改下拉列表的选择后隐藏 1 个对象。

有什么建议吗？

【问题讨论】：

标签： javascript 3d-modelling

【解决方案1】：

问题是您不断向partitionLeft 添加网格，但您从未删除它们。

试试这样的：

var activities = document.getElementById("stand");   
var wallMaterial = new THREE.MeshLambertMaterial({color:resources.settings.wallColor});
var partitionLeft = new THREE.Mesh(geometries.partition, 
materials.partitionMaterial);

alert(activities);


var footRight1 = new THREE.Mesh(new THREE.BoxGeometry(0.140, 0.15, 0.05), materials.footRightMaterial);
footRight1.position.set(1.15,-1.85,0);

var footRight2 = new THREE.Mesh(new THREE.BoxGeometry(6.450, 4.15, 5.25), materials.footRightMaterial);
footRight2.position.set(0.15,-0.85,0);

activities.addEventListener("change", function() {
    if(activities.options[activities.selectedIndex].value=="stand1") {
        partitionLeft.add(footRight1);
        partitionLeft.remove(footRight2);
    } else {
        partitionLeft.add(footRight2);
        partitionLeft.remove(footRight1);
    }
});

【讨论】：