three.js(七) 绘制到WebGLRenderTarget
2019獨角獸企業重金招聘Python工程師標準>>>
WebGLRenderTarget 是GPU 內部對象, 主要作用是存儲繪制結果,通常繪制結果直接顯示到屏幕上,但是也可以暫時存儲在GPU內部,以便于再次利用。對于OpenGL 來講, RenderTarget就是一個FrameBuffer, 在這個FrameBuffer之下附帶有一個顏色buffer通常即是一個Texture, ?還有一個renderBuffer 通常可以是存儲深度浮點信息,或者其它浮點信息。? ? target = new THREE.WebGLRenderTarget(WINDOW_W*0.5, WINDOW_H);這里聲明一個半個屏幕寬度, 整個高度的RenderTarget.接著在繪制場景的函數中:? ? renderer.setRenderTarget(target);? ? renderer.clear();? ? renderer.render(scene, camera, target);首先設定繪制目標,清理目標, 將場景繪制到目標上。接著我們就可以使用繪制的數據了, 例如最簡單的是,將繪制的場景顯示在另外一個場景中的某個平面上。? ? scene2 = new THREE.Scene();? ? m2 = new THREE.Mesh(new THREE.PlaneGeometry(2, 2), new THREE.MeshBasicMaterial());? ? m2.rotation.x = -Math.PI/4;? ? m2.rotation.y = -Math.PI/4;? ? normalCamera = new THREE.PerspectiveCamera(90, WINDOW_W*0.5/WINDOW_H, 0.5, 2000);? ? normalCamera.position.z = 3;? ? scene2.add(normalCamera);? ? scene2.add(m2);這里構建另外一個場景, 場景中有一個平面, 平面的紋理是上面的繪制結果,? ? m2.material.map = target;? ? m2.material.map.needUpdate = true;接著將這個新場景繪制到屏幕上, 只需要設定繪制目標為null, 就可以了。? ? renderer.setRenderTarget(null);? ? renderer.clear();? ? renderer.render(scene2, normalCamera);這樣就可以制作出類似于 顯示器的效果了。
轉載于:https://my.oschina.net/u/186074/blog/79062
總結
以上是生活随笔為你收集整理的three.js(七) 绘制到WebGLRenderTarget的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: openstack-keystone简记
- 下一篇: 这个例子主要展示了通过点击button实