Question

我可以拖放单个GLTF元素。但是我不能拖动一组元素。我正在使用以下代码

var loader = new THREE.GLTFLoader();
                loader.load( 'W3030/W3030.gltf', ( gltf ) => {

                    gltf.scene.traverse( function( child ) {
                        if(child.type === "Group")
                        {
                            newObject = true;
                            GLTFobjects.push(child);
                        }
                        if ( child.isMesh ) {
                            child.receiveShadow = true;
                            child.castShadow = true;
                            child.material.transparent = true;
                            child.material.opacity = 1;
                        }

                    });
                     scene.add(GLTFobjects);
                     gltf.scene.scale.set(1, 1, 1);

                });

Answer 1

嗨，谢谢您的支持。现在我拖了。使用以下代码拖动多网格GLTF。对我来说这是工作。

var wmsLayer= L.tileLayer.wms("http://localhost:8080/geoserver/visualization/wms", {
layers: 'visualization:GPR',
format: 'image/png',
transparent: true,
CQL_FILTER:  "branchCode='N01821'"

//结束初始化功能代码 //在init函数之后或之前添加以下函数

 var dragobjects =[];
 //add following code in init function
 var gltfobject = addGLTFObjectIntoScene();
 scene.add(gltfobject);

dragControls = new THREE.DragControls(dragobjects, camera, renderer.domElement);
dragControls.addEventListener('dragstart', onDragStart, false);
dragControls.addEventListener('drag', onDrag , false);
dragControls.addEventListener('dragend', onDragEnd, false);

Answer 2

由于没有Group方法，恐怕DragControls不支持Group.raycast()的实例。

您可以通过用不可见的网格替换组来实现解决方法。但是，不是将Object3D.visible设置为false，而是对Material.visible执行此操作。否则，光线投射逻辑将不会执行相交测试。然后必须使用足够大的几何体来包围各个子级。

three.js R110

如何将GLTF元素分组并拖放到3js中

2 个答案: