【问题标题】:How can I set the position of a mesh before I add it to the scene in three.js在three.js中将网格添加到场景之前如何设置网格的位置
【发布时间】:2012-12-22 19:02:58
【问题描述】:

在three.js中,我想在场景中的某个位置添加一个网格

我试过了:

// mesh is a THREE.Mesh
scene is a THREE.Scene
scene.add(mesh)
scene.updateMatrixWorld(true)
mesh.matrixWorld.setPosition(new THREE.Vector3(100, 100, 100))
scene.updateMatrix()

但它没有影响任何东西。

我该怎么办?

【问题讨论】:

    标签: javascript three.js


    【解决方案1】:

    如果有人正在寻找从 Vector3 更新位置的方法

    const V3 = new THREE.Vector3(0,0,0)            // Create variable in zero position
    const box = new THREE.Mesh(geometry, material) // Create an object
    Object.assign(box.position, V3)                // Put the object in zero position
    

    const V3 = new THREE.Vector3(0,0,0)            // Create variable in zero position
    const box = new THREE.Mesh(geometry, material) // Create an object
    box.position.copy(V3)
    

    【讨论】:

      【解决方案2】:

      我更喜欢使用 Vector3 来设置位置。

         let group = new THREE.Group();
      
         // position of box
         let vector = new THREE.Vector3(10, 10, 10);
         
           // add wooden Box
         let woodenBox = new THREE.Mesh(boxGeometry, woodMaterial);
      
          //update postion
          woodenBox.position.copy(vector);
      
        // add to scene
         group.add(woodenBox)
         this.scene.add(group);
      

      【讨论】:

      • 你在哪里使用position
      • 在向量 10,10,10
      • 这个例子真的把一个 Vector3 作为输入并一次性设置它
      【解决方案3】:

      我之前在 github 上看到过。 (三.js r71)

      mesh.position.set(100, 100, 100);
      

      并且可以为个人完成

      mesh.position.setX(200);  
      mesh.position.setZ(200); 
      

      参考:https://threejs.org/docs/#api/math/Vector3

      详细解释如下:

      因为 mesh.position 是“Vector3”。 Vector3() 有 setX() setY() 和 setZ() 方法。我们可以这样使用它。

      mesh.position = new THREE.Vector3() ; //see position is Vector3()
      vector1 = new THREE.Vector3();   
      
      mesh.position.setX(100);  //or  this
      vector1.setX(100)         // because all of them is Vector3()
      camera1.position.setZ(100); // or this
      light1.position.setY(100)   // applicable to any object.position
      

      【讨论】:

      • 这对我有用,而 chysmann 的答案却没有,尽管我无法解释为什么它不会/不会。您能否详细说明“在 github 上看到”是什么意思?
      • 我在 github three.js 页面上看到了它。但我现在找不到源
      • 这是正确答案。使用mesh.position.set(x,y,z) 因为你不需要强制更新,如果你设置mesh.position = xxx,你只改变对象属性,并不总是在场景中实时移动对象。 position.set 更加复杂,并且总是将对象移动到目的地并刷新缓冲区、灯光、阴影等......一次。
      • 这是正确答案。从 R69(Google CDN 提供的最新发行版)开始,不应将值分配给 mesh.position,因为它是 read only,导致 Uncaught TypeError: Cannot assign to read only property 'position' of [object Object]
      【解决方案4】:

      我建议您在此处查看文档: http://threejs.org/docs/#Reference/Objects/Mesh 正如您在文档页面顶部看到的那样,Mesh 继承自“Object3D”。这意味着您可以使用 Object3D 提供的所有方法或属性。因此,单击文档页面上的“Object3D”链接并检查属性列表。你会发现属性“.position”。点击“.position”查看它是什么数据类型。 Paha..它的 Vector3

      所以尝试执行以下操作:

      //scene is a THREE.Scene
      scene.add(mesh);
      mesh.position.set(100, 100, 100);
      

      【讨论】:

      • 这是正确答案。使用mesh.position.set(x,y,z) 因为你不需要强制更新,如果你设置mesh.position = xxx,你只改变对象属性,并不总是在场景中实时移动对象。 position.set 更加复杂,并且总是将对象移动到目的地并刷新缓冲区、灯光、阴影等......一次。
      • 我试过这个,但无法弄清楚它实际上在做什么。如果我画一个点,它就在正确的位置。但如果我创建一个网格并尝试设置位置,它只会出现在某个明显随机的位置。
      • 在我的情况下:mesh.position 不会改变位置。但是 Martin 提到的 mesh.position.set(x,y,z) 效果很好。
      • 在复杂网格的情况下,position 指的是什么?某种“中心”?
      • setVector3 类定义中定义。为了找到它,您必须像这样导航:Mesh > Object3d > Object3d.position > Vector3 > Vector3.set - 幸运的是,作者还提供了一个工作代码示例。
      猜你喜欢
      • 1970-01-01
      • 2012-06-21
      • 2014-08-18
      • 1970-01-01
      • 2020-05-30
      • 1970-01-01
      • 1970-01-01
      • 2014-09-25
      相关资源
      最近更新 更多