当前位置: 首页 > 面试题库 >

将three.js背景更改为透明或其他颜色

景阳曜
2023-03-14
问题内容

我一直在尝试将画布的默认背景颜色从黑色更改为透明/其他任何颜色-但没有运气。

我的HTML:

<canvas id="canvasColor">

我的CSS:

<style type="text/css">
#canvasColor {
 z-index: 998;
opacity:1;
background: red;
}
</style>

正如您在下面的在线示例中看到的那样,我在画布上附加了一些动画,因此不能仅执行不透明度:0; 在id上。

实时预览:http
//devsgs.com/preview/test/particle/

任何想法如何覆盖默认黑色?


问题答案:

当我也开始使用three.js时,我遇到了这个问题。这实际上是一个JavaScript问题。您目前有:

renderer.setClearColorHex( 0x000000, 1 );

在您的threejsinit函数中。更改为:

renderer.setClearColorHex( 0xffffff, 1 );

更新: 感谢HdN8提供的更新解决方案:

renderer.setClearColor( 0xffffff, 0);

更新#2:
正如WestLangley在[另一个类似的问题中]指出的那样-现在,在与setClearColor()功能一起创建新的WebGLRenderer实例时,必须使用以下代码:

var renderer = new THREE.WebGLRenderer({ alpha: true });

更新#3:
doob先生指出,由于r78您可以选择使用以下代码来设置场景的背景色,因此:

var scene = new THREE.Scene(); // initialising the scene
scene.background = new THREE.Color( 0xff0000 );


 类似资料:
  • 本文向大家介绍将three.js背景更改为透明或HTML中的另一种颜色,包括了将three.js背景更改为透明或HTML中的另一种颜色的使用技巧和注意事项,需要的朋友参考一下 如果要在three.js中使用透明背景,则需要在下面给出的代码中将alpha参数传递给WebGLRenderer构造函数- 但是,要设置背景色,

  • 问题简短版: 我想让我的CardView和RecyclView背景透明,所以片段/活动背景应该是可见的。 解释: 我有一个带有背景图像的活动A,片段B在其框架布局上被替换,在片段B中我有recyclerView,现在有了CardView,问题是我想让每个背景都透明,这样只有CardView才能在活动的实际背景下可见 活动(A) 片段(B)RecyclerView CardView/项目布局 提问原

  • 如何将背景颜色设置为透明

  • 我有一个带有文本块的div元素和一个父div,我在其中设置了一个背景图像。现在我想降低背景图像的不透明度。请建议我怎么做。 提前谢谢。 编辑: 我希望通过编辑 html 内容来改变我的博客文章看待 blogger.com 的方式。html 代码如下所示: 我试图用 div 元素包围上面的整个代码,并分别设置每个 div 的不透明度,如下所示: 但它不起作用。

  • 通过使用启用透明背景功能,可以使用自定义图片作为背景。 controller.setTransparentBackground( true );

  • 我正在将PNG转换为JPG。透明背景默认变为黑色。我需要它是白色的。