在 Three.js 中,setClearColor 的值为白色,但是当我调用外部 html 文件时它呈现黑色:
外部文件代码:
<div id="3d-modal"></div>
<script src="juicer/js/three.js"></script>
3D 模态脚本:
<script>
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75,
window.innerWidth/window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer({antialias : true});
// renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor(0xffffff);
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
// Appending Webgl to the "container" Div...
// document.body.appendChild( renderer.domElement );
var container = document.getElementById("3d-modal");
var canvas_width = 290;
var canvas_height = 165;
var renderer = new THREE.WebGLRenderer();
renderer.setSize(canvas_width , canvas_height);
container.appendChild(renderer.domElement);
var animate = function () {
requestAnimationFrame( animate );
renderer.render(scene, camera);
};
animate();
</script>
我该如何解决这个问题?
最佳答案
I came across this when I started using three.js as well. It's actually a javascript issue:
更新:感谢 HdN8 更新解决方案:
renderer.setClearColor( 0xffffff, 0);
(注意:语法 => setClearColor(颜色,alpha))
更新 #2:正如 WestLangley 在 another similar question 中指出的那样- 在结合 setClearColor() 函数创建新的 WebGLRenderer 实例时,您现在必须使用以下代码:
var renderer = new THREE.WebGLRenderer({ alpha: true });
更新 #3:Mr.doob 指出,自 r78 以来,您可以选择使用下面的代码来设置场景的背景颜色:
var scene = new THREE.Scene(); // initialising the scene
scene.background = new THREE.Color( 0xff0000 );
更新 #4:G 狗 如果背景颜色没有改变,请尝试将 alpha 从 0 更改为 1。
关于javascript - 在 threejs 中,setClearColor 的值为白色但是当我调用外部 html 文件时它呈现黑色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47883057/