时间戳

首页 > 解决方案 > 无法在three.js中加载背景颜色或图像

javascript - 无法在three.js中加载背景颜色或图像

问题描述

我正在尝试至少加载背景图像或颜色，但我没有成功。我不太清楚问题出在哪里；我尝试在 html 中注释掉我的 javascript 文件，所以它只会是 css，我仍然无法显示任何内容（我认为我的样式表已正确链接，但现在我不太确定），当我使用javascript文件正常加载three.js场景，除了我打开/关闭WEBGLRenderer alpha，它可以是黑色或白色之外没有任何变化。autoClearColor 函数也不做任何事情。我已经查看了几种在 youtube 教程和论坛之间的样式表中编写它的方法，但似乎没有任何效果。这是我认为问题可能出在的代码（js，然后是css）：

  renderer = new THREE.WebGLRenderer({
    alpha: true,
  })
  //renderer.autoClearColor = 0xF7BDFF
  renderer.setSize(innerWidth, innerHeight)
  document.body.appendChild(renderer.domElement)

body{
  background-image: url('images/abstractdraw.png')

}

标签： javascriptcssthree.js

解决方案

你需要更多的CSS参数才能工作......

body{

 background-image: url('images/abstractdraw.png');

 background-position: 0 0;

 background-size: 100%;

 background-repeat: no-repeat;

}

推荐阅读