2013-11-27 61 views
0

我目前正在使用Three.js基於Web的高度圖生成器。我使用一個畫布來顯示實際生成的高度圖,其他幾個用於顯示高度圖由單獨的八度組成,另一個用於演示高度圖'實際上',它直接應用於平面網格。Three.js場景在第一次傳遞後似乎不呈現

到目前爲止這麼好。所有預定義參數(波長等)都可以完美呈現。實際的問題是,在最初的渲染過程之後畫布沒有更新,這使得我的程序完全無用,因爲我的程序的目的是能夠使用滑塊操縱高度圖的幾個參數並且看到真實的效果時間。

不幸的是,唯一可以更新的畫布是具有平面網格的「真實」3D場景。但是在這裏它似乎有點像來自第一個渲染通道的數據從來沒有被清除,但至少看起來噪聲參數的制服更新正確 - 顯然這不是所有其他畫布的情況。

在我終於渲染一個場景之前,我總是將網格素材的needsUpdate字段設置爲true,但它似乎只適用於最後得到初始化的那個畫布。我完全迷失在這裏,也無法找到關於這個問題的任何信息。

+0

任何代碼顯示? – ThisIsSparta

+0

這是'基類的用於控制所有帆布: https://github.com/heartdisease/HeightMapGenerator/blob/master/js/Canvas3D.js 此類呈現高度圖的八度: https://github.com/heartdisease/HeightMapGenerator/blob/master/js/HeightMapOctave.js – heartdisease

回答

0

我終於找到了解決方案。根本不存在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); 
     }); 
    } 
}; 

我知道這是一個非常具體的問題,但也許這個職位仍然可能是其他人誰犯同樣的錯誤有幫助。我花了我基本上一個星期來跟蹤這個bug ...

相關問題