Three.js提供了多种类型的灯光

Three.js提供了多种类型的灯光,包括环境光、点光源、平行光源和聚光灯。这些灯光可以用来照亮场景中的物体,使其看起来更加真实。

  1. 环境光(AmbientLight):环境光会均匀地照亮场景中的所有物体,没有方向,不能用来投射阴影。创建环境光的代码如下:
html 复制代码
var ambientLight = new THREE.AmbientLight(0xffffff, 0.5); // 光的颜色为白色,强度为0.5 
scene.add(ambientLight); // 将环境光添加到场景中
  1. 点光源(PointLight):点光源是从一个点向四面八方发射光线的光源,可以用来模拟灯泡或者火炬等光源。创建点光源的代码如下:
html 复制代码
var pointLight = new THREE.PointLight(0xffffff, 1, 100); // 光的颜色为白色,强度为1,距离为100 
pointLight.position.set(0, 10, 0); // 设置光源的位置 scene.add(pointLight); // 将点光源添加到场景中
  1. 平行光源(DirectionalLight):平行光源是从一个方向发射的光线,可以用来模拟太阳等光源。创建平行光源的代码如下:
html 复制代码
var directionalLight = new THREE.DirectionalLight(0xffffff, 1); // 光的颜色为白色,强度为1 
directionalLight.position.set(0, 1, 0); // 设置光源的方向 
scene.add(directionalLight); // 将平行光源添加到场景中
  1. 聚光灯(SpotLight):聚光灯是从一个点向一个方向发射的光线,可以用来模拟手电筒等光源。创建聚光灯的代码如下:
html 复制代码
 var spotLight = new THREE.SpotLight(0xffffff, 1, 100); // 光的颜色为白色,强度为1,距离为100
 spotLight.position.set(0, 10, 0); // 设置光源的位置 
 spotLight.target.position.set(0, 0, 0); // 设置光源的目标位置 
 scene.add(spotLight); // 将聚光灯添加到场景中
相关推荐
霸王蟹9 天前
Vue3中keep-alive缓存组件应用场景。
前端·vue.js·缓存·typescript·js·htnl
maybe020910 天前
前端表格数据导出Excel文件方法,列自适应宽度、增加合计、自定义文件名称
前端·javascript·excel·js·大前端
PagiHi11 天前
好消息!软航文档控件(NTKO WebOffice)在Chrome 133版本上提示扩展已停用的解决方案
前端·chrome·中间件·js·activex
码农研究僧12 天前
uniapp的图片上传与提交(Demo记录)
uni-app·vue·图片上传·js
霸王蟹13 天前
Pinia-构建用户仓库和持久化插件
前端·vue.js·笔记·ts·pinia·js
Codingwiz_Joy14 天前
Day14 -实例 -利用工具进行js框架的信息收集
安全·web·js·安全性测试
eli96019 天前
node-ddk,electron 开发组件
前端·javascript·electron·node.js·js
PagiHi21 天前
iWebOffice2015 中间件如何在Chrome107及之后的高版本中加载
前端·javascript·chrome·中间件·edge·js
我命由我1234523 天前
微信小程序项目 tabBar 配置问题:“pages/mine/mine“ need in [“pages“]
javascript·微信小程序·小程序·html·css3·html5·js
秋天爱美丽24 天前
Reflect.get和target[key]有何不同?
es6·js