Question

我创建了一个小场景，其中包含3个球体和一个连接球体3个中心的三角形，即三角形顶点位置与球体位置相同。现在我预计如果我改变其中一个球体的位置，三角形顶点应该与它一起移动（因为它是相同的位置对象），因此仍然连接三个球体。但是，如果我在调用渲染器后执行此坐标更改，则不会更改三角形。（虽然如果在调用渲染器之前移动球体，它确实会改变。）这似乎表明渲染器不使用原始位置对象，而是使用它们的克隆。

问：有没有办法避免这种克隆行为（或者是独立位置的原因）所以我仍然可以通过一个变量更改来改变两个对象？或者我做错了什么？

代码：

var width = window.innerWidth;
var height = window.innerHeight;
var renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(width, height);
document.body.appendChild(renderer.domElement);
var scene = new THREE.Scene;

var camera = new THREE.PerspectiveCamera(30, width / height, 0.1, 10000);
camera.position=new THREE.Vector3(50,50,50);
camera.lookAt(new THREE.Vector3(0,0,0));
scene.add(camera);

var pointLight = new THREE.PointLight(0xffffff);
pointLight.position=camera.position;
scene.add(pointLight);

var sphere=[];
var sphereGeometry = new THREE.SphereGeometry(1,8,8);
var sphereMaterial = new THREE.MeshLambertMaterial({ color: 0xff0000 });
var triGeom = new THREE.Geometry();
for (var i=0; i<3; i++) {
    sphere[i] = new THREE.Mesh(sphereGeometry, sphereMaterial);
    sphere[i].position=new THREE.Vector3(10*i,20+5*(i-1)^2,0);
    scene.add(sphere[i]);
    triGeom.vertices.push(sphere[i].position);
}
triGeom.faces.push( new THREE.Face3( 0, 1, 2 ) );
triGeom.computeFaceNormals();
var tri= new THREE.Mesh( triGeom, new THREE.MeshLambertMaterial({side:THREE.DoubleSide, color: 0x00ff00}) );
scene.add(tri);

sphere[0].position.x+=10; // this changes both sphere and triangle vertex
renderer.render(scene, camera);
sphere[1].position.x+=10; // this changes only the sphere
renderer.render(scene, camera);

Answer 1

这可能是因为几何缓存功能。每次更改顶点位置时都必须设置 triGeom.verticesNeedUpdate = true 。

three.js渲染器是否克隆对象位置？

1 个答案: