切換帆布/渲染目標在three.js所

我有我的頁面上有兩個畫布元素，我開始渲染我：切換帆布/渲染目標在three.js所

new THREE.WebGLRenderer({canvas:myFirstCanvas});

和3D場景呈現正確，因爲我希望

但這時如果我嘗試通過使用該渲染器指向的canvas元素更改爲：

renderer.domElement = mySecondCanvas;

或

renderer.setRenderTarget({canvas:mySecondCanvas});

我看過github上的文檔，但是setRenderTarget（）很不幸地說TODO。是否可以切換渲染器正在使用的畫布元素？如果是的話，我會怎麼做呢？目前我嘗試做什麼，但在模糊的原始canvas元素的形象大概是因爲我也有調整渲染：

renderer.setSize(mySecondCanvas.width,mySecondCanvas.height);

當我試圖切換到其他畫布。

來源

2012-05-19 0xor1

不幸的是，這是由於WebGL的工作原因，與Three.js細節無關，但是每個WebGL上下文（由WebGL渲染器代表的Three.js中）都綁定到一個canvas元素，而且你不能更改WebGL上下文應呈現的元素。

所以：製作兩個THREE.WebGLRenderers，每個canvas元素一個。

來源

2012-05-20 06:03:07 MikaelEmtinger

順便說一句：渲染目標是你渲染的紋理。 – MikaelEmtinger

謝謝，我想我可能必須這樣做，所以我只需在渲染器之間交換場景和相機以交換內容，或者我可以輕鬆地交換場景。我也應該在同一個requestAnimationFrame（）中調用renderer1.render（scene1，camera1）和renderer2.render（scene2，camera2），還是應該使用兩個單獨的requestAnimationFrame調用？ – 0xor1

你可以使用相同的requestAnimationLoop回調，沒問題。每個WebGL上下文都可以看作是兩個不同的內存塊，它們不能訪問對方，並且可能會添加到場景中的屬性/場景對象/相機對象，這些屬性指向特定的內存並因此失敗。我的直覺是，場景中的物體（以及場景本身）最難再使用，但相機應該可以重複使用。 – MikaelEmtinger

切換帆布/渲染目標在three.js所

回答

相關問題