Object3D 子项是否可以使用父项的位置和旋转进行更新，但不能使用缩放进行更新？

Question

我正在将一个Object3D设置为另一个Object3D的父级，该Object3D通过动画更改位置，旋转和缩放。我希望子项 Object3D 相对于父项的位置和旋转移动，但我根本不希望子项缩放。这可能吗？有没有办法我可以"锁定"孩子的尺度，或者覆盖它，这样无论父母如何，它始终是一个恒定的尺度？

最坏的情况是，当对象的缩放或转换更新时，是否有某种钩子或回调，我可以侦听然后重新缩放对象？

我正在使用parent.add(child(进行育儿，然后将孩子的位置更新到一定的偏移量。

提前感谢！

Answer 1

类似的东西：

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 1000);
camera.position.set(0, 5, 10);
camera.lookAt(scene.position);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
scene.add(new THREE.GridHelper(10, 10));
var parentObj = new THREE.Mesh(new THREE.SphereBufferGeometry(1, 16, 8), new THREE.MeshBasicMaterial({
  color: "red",
  wireframe: true
}));
scene.add(parentObj);
var childObj = new THREE.Mesh(new THREE.SphereBufferGeometry(1, 16, 8), new THREE.MeshBasicMaterial({
  color: "blue",
  wireframe: true
}));
childObj.position.set(2, 0, 0);
parentObj.add(childObj);
var clock = new THREE.Clock();
var time = 0;
var scale = 1;
var invScale = 1;
renderer.setAnimationLoop(() => {
  time = clock.getElapsedTime();
  scale = 1 + Math.sin(time) * 0.5 + 0.5;
  invScale = 1 / scale;
  parentObj.scale.setScalar(scale);
  childObj.scale.setScalar(invScale);
  renderer.render(scene, camera)
});

body {
  overflow: hidden;
  margin: 0;
}

<script src="https://threejs.org/build/three.min.js"></script>