在 Three.js 中动态更改对象尺寸

Question

我在 three.js 中使用库 dat.gui 让用户与对象交互并修改其网格的尺寸。大多数在线示例在想要更改网格尺寸时都使用 scale：

mesh.onChange(function(value){mesh.scale.x = value;});

这个解决方案的问题是它对用户不是很友好，并且需要在更改值时也调整 object.position。除了这个还有其他可能吗？万一你能 post 一个合理的替代方案和一个有效的例子？预先感谢您的回答。

Answer 1

解决您的问题的一个线索是了解对象的原点在哪里：在对象的几何中心或某个角落。它还取决于规模运营的实施。

暂时忽略 three.js，如果手动完成缩放操作，可以将其视为三个不同的操作：

1 - translate the object center to the origin of your world coordinates
2 - multiply its vertex position matrix by your scale factor
3 - translate object back to original world location

因此需要解决两个假设：

- is the ~center~ of your object at its geographic center or 
  at one of its corners

- do you want to scale (stretch) your object by expanding outwards from 
  its origin in all dimensions or simply extend outwards by retaining
  its current origin and ballooning its shape outwards

你需要表达什么行为？

.. object.position 取决于您的回答

在 Three.js 中动态更改对象尺寸

Dynamically change object dimensions in Three.js

javascript

three.js