在Three.js中，setClearColor的值为白色，但是当我调用外部html文件时，它呈现黑色：
enter image description here
外部文件代码：
<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>
我该如何解决？
最佳答案
当我也开始使用three.js时，我遇到了这个问题。这实际上是一个JavaScript问题：
更新：感谢HdN8提供的更新解决方案：
renderer.setClearColor( 0xffffff, 0);
（注意：语法=> setClearColor（color，alpha））
更新＃2：正如WestLangley在another similar question中指出的那样-与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 );
更新＃4：G狗
如果背景颜色不变，请尝试将alpha从0更改为1。