Question

我要在两个3D模型之间进行切换。目前，我可以在第一页加载后单击一个按钮以显示两个3d对象中的任何一个，但是当我尝试在它们之间切换时，它们总是同时加载两个对象。

我该如何解决？

$(".choice:not(a)").click(function(){


    // get the id of chosen item


    let id = $(".chosen").attr("id");
    id = id.match(/\d+$/)[0];

    let item;

        // change variables for id

        if(id == 1){

            item = 'first.mtl';
            objects = 'first.obj';

        }else if(id == 2){

            item = 'second.mtl';
            objects = 'second.obj';

        }

        // Problem is here they keep loading at the same time.


            new THREE.MTLLoader()
            .setPath( 'models/obj/' )
            .load( gun, function ( materials ) {
                materials.preload();
                new THREE.OBJLoader()
                    .setMaterials( materials )
                    .setPath( 'models/obj/' )
                    .load( objects, function ( object ) {
                        object.position.y = 0;
                        scene.add( object );

                            object.visible = botonsON;


                    }, onProgress, onError );

            } );


   });

Answer 1

您的代码按预期工作。对象的所有可见性属性都共享相同的布尔值botonsON。如果属实，则只显示所有这些。每当用户切换时，您也正在加载模型，这是没有意义的。我建议您一次加载对象，将它们添加到场景中并保存到一些变量中。使其中一个在开始时不可见。只要用户单击，就可以

object1.visible != object1.visible
object2.visible != object2.visible

为什么我的Three.js对象同时显示而不是单独显示？

1 个答案: