Javascript Can'；t在threejs.org网站上运行基本示例

我正在尝试学习three.js，并且正在查找一些示例。 我试着运行这个代码 然而，它显示的只是一个黑屏

我将three.js源代码修改到我的目录中，我还将材质修改为以下内容，因为我没有板条箱纹理。

var material=新的三种标准材料（{金属度：0，粗糙度：0.5}）；
material.color.setHex（0xc23560）

一些代码和说明：

var摄像机、场景、渲染器；
var网格；
init（）；
制作动画（）；
函数init（）{
摄像头=新的三个透视摄像头（70，window.innerWidth/window.innerHeight，11000）；
摄像机位置z=400；
场景=新的三个。场景（）；
灯光=新的三个。点光源（0xffffff，11000）；//增加距离
光。位置。设置（300300）；//[50,50,50]-在立方体内部
场景。添加（灯光）；
var几何体=新的三个.BoxBufferGeometry（200200200）；
var材料=新的3.0网格标准材料({
颜色：0xc23560，
金属度：0，
粗糙度：0.5
});
网格=新的三个网格（几何体、材质）；
场景。添加（网格）；
renderer=new THREE.WebGLRenderer（）；
renderer.setPixelRatio（window.devicePixelRatio）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
//
addEventListener（'resize'，onWindowResize，false）；
}
函数onWindowResize（）{
camera.aspect=window.innerWidth/window.innerHeight；
camera.updateProjectMatrix（）；
renderer.setSize（window.innerWidth、window.innerHeight）；
}
函数animate（）{
请求动画帧（动画）；
网格旋转.x+=0.005；
网格旋转y+=0.01；
渲染器。渲染（场景、摄影机）；
}

正文{
溢出：隐藏；
保证金：0；
}

---

我想出来了，结果发现我盒子的材质是金属的，我错误地添加了光源。

你需要在场景中添加光源，因为

THREE.MeshStandardMaterial（）

受灯光影响。我在init（）中添加了以下内容功能“灯=新的三点灯（0xff0000，1100）；光。位置。设置（50，50，50）；场景。添加（灯光）；'它仍然显示为黑色如果您说控制台中有任何错误，这将非常有用：）控制台上没有错误没有错误，因为除了场景中对象的位置之外，一切都是正确的。金属度为0，因此这不是原因，但错误的灯光位置才是正确的建议。