javascript - 如何让多个 .gltf 模型在 three.js webxr_ar_hittest 示例中工作？

Question

我正在使用来自three.js的这个示例https://threejs.org/examples/?q=webxr#webxr_ar_hittest并且该示例运行良好，但是当我将圆柱体更改为模型时，它只会让我放置一个模型而不是让我把几个模型放在我点击的地方。有谁知道如何解决这个问题？

在文件中，我使用了他们将气缸放在地板上的部分，但是我想用 .gltf 模型替换它。

            var geometry = new THREE.CylinderBufferGeometry( 0.1, 0.1, 0.2, 32 ).translate( 0, 0.1, 0 );
            function onSelect() {

                if ( reticle.visible ) {

                    var material = new THREE.MeshPhongMaterial( { color: 0xffffff * Math.random() } );
                    var mesh = new THREE.Mesh( geometry, material );
                    mesh.position.setFromMatrixPosition( reticle.matrix );
                    mesh.scale.y = Math.random() * 2 + 1;
                    scene.add( mesh );

                }

            }

我替换为：

var loader = new GLTFLoader().setPath('examples/models/gltf/Duck/glTF' );
                function onSelect() {
                    if ( reticle.visible ) {
                        loader.load('Duck.gltf', function ( gltf ) {
                            scene.add( gltf.scene );
                        });
                    }
                }

此示例使用相机将虚拟对象放置在地板上。先感谢您！