ThreeJS TransformControl 釋放控件

Question

我正在使用 Typescript 和 Autodesk Forge Viewer 執行此操作。 我試圖限制 ThreeJS 變換控件的移動。 我有一個可以移動網格的定義區域（由 min max X、Y、Z 定義）。 我還使用 prev_pos 變量記錄了網格 position 的變化。

在變換控件的“更改”事件偵聽器中，我將根據最小最大 X、Y、Z 檢查當前網格 position。

在這里，檢查后，如果網格 position 在區域之外，我將網格 position 重置為限制。 我還將 prev_pos 設置為此限制 position。 但是，我還想從變換控件中釋放控件，以便變換控件將其 position 重置為附加的網格 position。

目前，附加的網格重置為限制，但仍可以拖動控件。 之后，控件的 position 從網格偏移，每次我將鼠標懸停在控件上時，網格都會自行移動，盡管沒有按下移動按鈕。 我還嘗試使用 transformControl.position.copy(mesh.position) 重置控件 position 但沒有奏效。 這是“更改”事件的代碼：

 public onTxChange() {
console.log("TxChange");
if (!this.allowUpdate) {
  return;
}
let position: THREE.Vector3 = new THREE.Vector3(0, 0, 0);
if (this.m_mesh !== null) {

  position.x = this.m_mesh.position.x;
  position.y = this.m_mesh.position.y;
  position.z = this.m_mesh.position.z;

}
else {
  return;
}
const scaffoldGroupInfo: scaffold_group_info = g_scaffold_docking_panel_cmn.getScaffoldGroupInfo();
const color: string = scaffoldGroupInfo.color;
let deltaX: number = position.x - this.m_prevPos.x;
let deltaY: number = position.y - this.m_prevPos.y;
let deltaZ: number = position.z - this.m_prevPos.z;
console.log("DeltaX");
console.log(deltaX);
if (deltaX > 0) {
  scaffold_cmn.cubeExpantion(g_scaffold_docking_panel_cmn.getsetHomePosition(), "X", false, color, deltaX);
}
else if (deltaX < 0) {
  scaffold_cmn.cubeExpantion(g_scaffold_docking_panel_cmn.getsetHomePosition(), "X", true, color, deltaX * -1);
}
if (deltaY > 0) {
  scaffold_cmn.cubeExpantion(g_scaffold_docking_panel_cmn.getsetHomePosition(), "Y", false, color, deltaY * 1);
}
else if (deltaY < 0) {
  scaffold_cmn.cubeExpantion(g_scaffold_docking_panel_cmn.getsetHomePosition(), "Y", true, color, deltaY * -1);
}
if (deltaZ > 0) {
  scaffold_cmn.cubeExpantion(g_scaffold_docking_panel_cmn.getsetHomePosition(), "Z", true, color, deltaZ);
}
else if (deltaZ < 0) {
  scaffold_cmn.cubeExpantion(g_scaffold_docking_panel_cmn.getsetHomePosition(), "Z", false, color, deltaZ * -1);
}

if (!scaffold_cmn.CubeResizable) {
  scaffold_cmn.ResetAttachedMeshPositionRotation();
  return;
}
this.m_prevPos = position;

}

Answer 1

您應該能夠通過簡單地限制被移動的 object 的 position 來實現這一點，例如，在change事件處理程序中使用此代碼（如此 three.js 討論線程中所建議的）：

const min = new THREE.Vector3(-100, -100, -100);
const max = new THREE.Vector3(100, 100, 100);
transformControl.object.position.clamp(min, max);

下次調用其update方法時，變換控件的 position 應更新為對象的 position，如下所示： TransformControls.js#L702 。

請注意，類似的