问题描述
我有一个典型的用户界面 - 两个垂直窗口.左边为画布 &渲染器，适合 UI.
I have a typical UI - two vertical windows.The left for the canvas & renderer, the right for the UI.
在此 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....
alpha 方法( renderer = new THREE.WebGLRenderer( { alpha: true } );) 可能是解决方案，但我不知道这是否是最佳解决方案(性能如何)或者有什么方法可以编程(增强)与视口相关的东西?剪刀.
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 ?)
推荐答案
使用这个完全没问题:
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 );
这篇关于Three.js 为什么渲染器带有视口 &剪刀和我有一个完整的黑色画布的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！