三.js WebGl调整对象的奇怪行为

Question

我的代码运行良好，但当我启用 WebGL 时它停止运行。 一般来说，我有一个函数可以在每帧速率调整我的对象大小。

function animate(){

     window.requestAnimationFrame(animate);
     s.setPosition(s.x - 1, s.y - 1, 0);
}

s.prototype.setPosition = function(x, y, z) {

this.x = x; 
this.y = y; 
this.z = z; 

this.squareMesh.geometry.vertices[0].set( x,  y, z);
this.squareMesh.geometry.vertices[1].set( x + this.w - 1, y, z);
this.squareMesh.geometry.vertices[2].set( x + this.w - 1, y - this.h + 1, z);
this.squareMesh.geometry.vertices[3].set( x,  y -  this.h + 1, z);
 }

这一切都很好，直到我启用了 WebGl。启用后，对象没有任何反应，似乎值没有更新。

当我使用像

这样的内置函数时

obj.position.x = s.x +1 有效。

但这会导致其他问题，例如每个对象的 0 0 0 位置。我在这里指的是那个问题：Three.js, WebGl Object position

Answer 1

见https://github.com/mrdoob/three.js/wiki/Updates

这应该告诉 Three.js 顶点已更改并需要刷新：

this.squareMesh.geometry.verticesNeedUpdate = true;