如何为Three.js粒子（PointsMaterial）实现鼠标交互扭曲物体形状

我需要用Three.js实现一个效果：当鼠标在粒子上移动时，粒子组成的物体形状会产生扭曲变形。当前我已经实现了基于simplex噪声的粒子波动效果，但还没完成鼠标交互的扭曲逻辑，恳请提供可行的解决思路。

当前代码如下：

import * as THREE from "three";
import { SimplexNoise } from "three/addons/math/SimplexNoise.js";

// general setup, boring, skip to the next comment

console.clear();

var scene = new THREE.Scene();
scene.background = new THREE.Color("dimgray");

// var camera = new THREE.PerspectiveCamera(30, innerWidth / innerHeight);
// camera.position.set(4, 2, 8);
// camera.lookAt(scene.position);

const camera = new THREE.PerspectiveCamera(
  30,
  window.innerWidth / window.innerHeight,
  0.1,
  1000
);

camera.position.z = 8;
camera.lookAt(scene.position);

var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(innerWidth, innerHeight);
renderer.setAnimationLoop(animationLoop);
document.body.appendChild(renderer.domElement);

window.addEventListener("resize", (event) => {
  camera.aspect = innerWidth / innerHeight;
  camera.updateProjectionMatrix();
  renderer.setSize(innerWidth, innerHeight);
});

// next comment

// some waves with simplex noise

var geometry = new THREE.PlaneGeometry(6, 4, 150, 100),
  pos = geometry.getAttribute("position"),
  simplex = new SimplexNoise();

var waves = new THREE.Points(
  geometry,
  new THREE.PointsMaterial({ size: 0.02 })
);
waves.rotation.x = -Math.PI / 2;
scene.add(waves);

// that's all folks

function animationLoop(t) {
  for (var i = 0; i < pos.count; i++) {
    var x = pos.getX(i),
      y = pos.getY(i),
      z = 0.5 * simplex.noise3d(x / 2, y / 2, t / 2000);

    pos.setZ(i, z);
  }
  pos.needsUpdate = true;

  renderer.render(scene, camera);
}

内容的提问来源于stack exchange，提问作者Tommy Wolfheart