A帧中标记上的3D模型缩放

Question

我正在使用a框架在标记上加载3d模型。我想知道如何进行3D模型的动态缩放，例如当3D模型出现在标记上时，如何放大和缩小。 请帮助我。

Answer 1

您可以通过设置scale属性来放大/缩小3d模型。 将模型放入参考`let model = document.querySelector（“＃model”）：

 model.setAttribute("scale", "2 2 2")

将其放大。

 model.setAttribute("scale", "0.5 0.5 0.5") 

将其缩小。

---

您可以使用鼠标滚动键来连接它，也可以使用addEventListener来连接任何其他事件，并根据读数来更改刻度。

MouseWheel示例：

window.addEventListener("wheel", (e) => {
    let scaleFactor = e.deltaY > 0 ? 0.9 : 1.1  //check if we scroll up, or down
    let scale = this.el.getAttribute("scale").clone() // clone the scale vector
    scale.multiplyScalar(scaleFactor)                 
    this.el.setAttribute("scale", scale)              // apply new scale
  })

小提琴here。