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

【问题标题】：Is it possible for an Object3D child to update with the parent's position and rotation but not scale?Object3D 子项是否可以使用父项的位置和旋转进行更新，但不能进行缩放？
【发布时间】：2019-06-20 04:48:15
【问题描述】：

我将一个 Object3D 作为另一个 Object3D 的父对象，该 Object3D 通过动画改变位置、旋转和缩放。我希望子 Object3D 相对于父对象的位置和旋转移动，但我根本不希望子对象缩放。这可能吗？有什么方法可以“锁定”孩子的比例，或者覆盖它，这样无论父母如何，它总是一个恒定的比例？

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

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

提前致谢！

【问题讨论】：

标签： three.js

【解决方案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;
}

&lt;script src="https://threejs.org/build/three.min.js"&gt;&lt;/script&gt;

【讨论】：