问题
I have a typical UI - two vertical windows. The left for the canvas & renderer, the right for the UI.
Inside this UI I will have special viewers, for example a simple top view window.
I have used the viewports && scissors approach. All works fine.
The question is that I miss some special parameter to avoid the complete canvas black-filled that covers all I have (my UI) behind. I expected that viewport & scissors were going to let me have 'clean' areas (not filled) inside my canvas. But not....
The alpha approach ( renderer = new THREE.WebGLRenderer( { alpha: true } );) could be the fix but I don't know if this is the best solution (what about performance) or is there any way to program (enhancement) something related with the viewport & scissors.
If I'm going to use viewports there is no sense to fill all with black.
(Also the main question is ... If I have a viewport & scissor, why and who fill the canvas with black ?)
回答1:
It is totally okay to use this:
var renderer = new THREE.WebGLRenderer({ alpha: true });
It is a common approach as you can read also here in this answer
You can change only the color like this:
renderer.setClearColor( 0xffffff );
来源：https://stackoverflow.com/questions/35030997/three-js-why-renderer-with-viewport-scissor-and-i-have-a-complete-black-canvas