I'm using Three.js to load multiple 3D models and store them in an array behind the scenes. I have multiple buttons with unique IDs that add that specific model to the scene. Now I want to compare the button ID and variable name so that I can load only that specific model and remove any other models added to the scene. I wrote a for loop to loop through all the variables to compare to the ID of the button that was clicked, but I can't access just the variable name in order to compare it to the button ID.
The following is my code:
function modelShow() { let m; var models = [mandi_0, maxi_0, mandi_1, maxi_1, mandi_2, maxi_2]; for (m = 0; m < models.length; m++) { if(models[m].name == event.target.id){ scene.add(models[m]); } else { scene.remove(models[m]); } } } let j; for (j = 0; j < buttons.length; j++) { buttons[j].addEventListener('click', modelShow); }
How to compare only the variable name with the button ID without comparing the content within the variable?
Use objects with computed property names, not arrays.
Now you have an object like
modelsByName["mandi_0"] === modelsByName.mandi_0 === mandi_0
and so on for other variables. But since you're not using an array, you can't iterate by index anymore, so change the loop.