我终于自己找到了解决方案。three.js 完全没有问题,实际的问题是我不小心在一个场景中添加了几个平面而不是一个。那是因为我的 initScene() 方法不止一次被调用,因为我没有检查所有着色器等仍在加载的情况(我正在通过异步 AJAX 请求加载我的着色器)。我刚刚检查了“根本没有加载”和“完全加载并可以使用”。
这正在工作:
/**
* Adds geometry to the scene and attaches previously loaded material.
*
* @param {Number} wavelength of the first octave of the height map
* @param {Number} frequency of the first octave of the height map
* @param {Number} number of octaves (has to be an integer)
*/
HeightMap.prototype.initScene = function(wavelength, frequency, lacunarity, persistency, octaves) {
this.material = HeightMap.settings.templateMaterial.clone();
this.updateUniforms(wavelength, frequency, lacunarity, persistency, octaves);
HeightMapOctave.prototype.addPlane.call(this);
this.initialized = true;
};
/**
* Updates values for HeightMap.
*
* @param {Number} wavelength of the first octave of the height map
* @param {Number} frequency of the first octave of the height map
* @param {Number} number of octaves (has to be an integer)
*/
HeightMap.prototype.updateScene = function(wavelength, frequency, lacunarity, persistency, octaves) {
if (this.initialized) {
this.updateUniforms(wavelength, frequency, lacunarity, persistency, octaves);
Canvas3D.prototype.render.call(this);
} else if (!this.initializing) {
this.initializing = true;
this.loadShaders(function() {
this.initScene(wavelength, frequency, lacunarity, persistency, octaves);
Canvas3D.prototype.render.call(this);
});
}
};
我知道这是一个非常具体的问题,但也许这篇文章对犯同样错误的其他人仍然有帮助。我基本上花了一周的时间来追踪这个错误......