three.js 灯光

环境光探针(AmbientLightProbe)

光照探针是一种在3D场景中添加光源的另一种方法。 AmbientLightProbe 是场景中单个环境光的光照估算数据。 有关光照探针的更多信息,请转到 LightProbe 。

构造函数

AmbientLightProbe( color : Color, intensity : Float )

color - (可选)一个表示颜色的 Color 的实例、字符串或数字。
intensity - (可选)光照探针强度的数值。默认值为1。

创建一个新的AmbientLightProbe。

平行光(DirectionalLight)

平行光是沿着特定方向发射的光。这种光的表现像是无限远,从它发出的光线都是平行的。常常用平行光来模拟太阳光 的效果; 太阳足够远,因此我们可以认为太阳的位置是无限远,所以我们认为从太阳发出的光线也都是平行的。

平行光可以投射阴影 - 跳转至 DirectionalLightShadow 查看更多细节。

关于位置、目标和旋转说明

Three.js 的平行光常见的困惑是设置旋转没有效果。这是因为 three.js 的平行光类似与其他引擎的"目标平行光"。

这意味着它的方向是从一个平行光的位置 position 到 target的位置。 (而不是一个只有旋转分量的'自由平行光')。

这样做的原因是为了让光线投射阴影。 - the shadow 摄像机需要一个位置来计算阴影。

// White directional light at half intensity shining from the top.
const directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
scene.add( directionalLight );

构造器

DirectionalLight( color : Integer, intensity : Float )

color - (可选参数) 16进制表示光的颜色。 缺省值为 0xffffff (白色)。
intensity - (可选参数) 光照的强度。缺省值为1。

创建一个新的 DirectionalLight。

属性

公共属性请查看基类 Light。

.castShadow : Boolean

如果设置为 true 该平行光会产生动态阴影。 警告: 这样做的代价比较高而且需要一直调整到阴影看起来正确. 查看 DirectionalLightShadow 了解详细信息。该属性默认为 false

.position : Vector3

假如这个值设置等于 Object3D.DefaultUp (0, 1, 0),那么光线将会从上往下照射。

.shadow : DirectionalLightShadow

这个 DirectionalLightShadow 对象用来计算该平行光产生的阴影。

.target : Object3D

平行光的方向是从它的位置到目标位置。默认的目标位置为原点 (0,0,0)
注意: 对于目标的位置,要将其更改为除缺省值之外的任何位置,它必须被添加到 scene 场景中去。

scene.add( light.target );

这使得属性target中的 matrixWorld 会每帧自动更新。

它也可以设置target为场景中的其他对象(任意拥有 position 属性的对象), 示例如下:

const targetObject = new THREE.Object3D();
scene.add(targetObject);
light.target = targetObject;

完成上述操作后,平行光现在就可以追踪到目标对像了。

方法

公共方法请查看基类 Light。

.copy ( source : DirectionalLight ) : DirectionalLight

复制 source 的值到这个平行光源对象。

半球光(HemisphereLight)

光源直接放置于场景之上,光照颜色从天空光线颜色渐变到地面光线颜色。
半球光不能投射阴影。

const light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
scene.add( light );

构造器(Constructor)

HemisphereLight( skyColor : Integer, groundColor : Integer, intensity : Float )

skyColor - (可选参数) 天空中发出光线的颜色。 缺省值 0xffffff。
groundColor - (可选参数) 地面发出光线的颜色。 缺省值 0xffffff。
intensity - (可选参数) 光照强度。 缺省值 1。

创建一个半球光。

属性(Properties)

公共属性请查看基类Light。

.castShadow : Boolean

该参数在构造时被设置为 undefined 因为半球光不能投射阴影。

.color : Float

在构造时传递的天空发出光线的颜色。 默认会创建 Color 并设置为白色(0xffffff)。

.groundColor : Float

在构造时传递的地面发出光线的颜色。 默认会创建 Color 并设置为白色(0xffffff)。

.position : Vector3

假如这个值设置等于 Object3D.DefaultUp (0, 1, 0),那么光线将会从上往下照射。

方法(Methods)

公共方法请查看基类 Light。

.copy ( source : HemisphereLight ) : HemisphereLight

从source复制 color, intensity 和 groundColor 的值到当前半球光对象中。

点光源(PointLight)

从一个点向各个方向发射的光源。一个常见的例子是模拟一个灯泡发出的光。
 

const light = new THREE.PointLight( 0xff0000, 1, 100 );
light.position.set( 50, 50, 50 );
scene.add( light );

构造器(Constructor)

PointLight( color : Integer, intensity : Float, distance : Number, decay : Float )

color - (可选参数)) 十六进制光照颜色。 缺省值 0xffffff (白色)。
intensity - (可选参数) 光照强度。 缺省值 1。

distance - 这个距离表示从光源到光照强度为0的位置。 当设置为0时,光永远不会消失(距离无穷大)。缺省值 0.
decay - 沿着光照距离的衰退量。缺省值 1。 在 physically correct 模式中,decay = 2。

创建一个新的点光源(PointLight)。

属性(Properties)

公共属性请查看基类Light。

.decay : Float

沿着光照距离的衰减量
在 physically correct 模式下,decay 设置为等于2将实现现实世界的光衰减。
缺省值为 1

.distance : Float

如果非零,那么光强度将会从最大值当前灯光位置处按照距离线性衰减到0。 缺省值为 0.0

.power : Float

光功率
在 physically correct 模式中, 表示以"流明(光通量单位)"为单位的光功率。 缺省值 - 4Math.PI

该值与 intensity 直接关联

power = intensity * 4π

修改该值也会导致光强度的改变。

.shadow : PointLightShadow

PointLightShadow用与计算此光照的阴影。

此对象的摄像机被设置为 fov 为90度,aspect为1, 近裁剪面 near 为0,远裁剪面far 为500的透视摄像机 PerspectiveCamera。

方法(Methods)

公共方法请查看基类 Light。

.copy ( source : PointLight ) : PointLight

将所有属性的值从源 source 复制到此点光源对象。

平面光光源(RectAreaLight)

平面光光源从一个矩形平面上均匀地发射光线。这种光源可以用来模拟像明亮的窗户或者条状灯光光源。

const width = 10;
const height = 10;
const intensity = 1;
const rectLight = new THREE.RectAreaLight( 0xffffff, intensity,  width, height );
rectLight.position.set( 5, 5, 0 );
rectLight.lookAt( 0, 0, 0 );
scene.add( rectLight )
rectLightHelper = new THREE.RectAreaLightHelper( rectLight );
scene.add( rectLightHelper );

构造器(Constructor)

RectAreaLight( color : Integer, intensity : Float, width : Float, height : Float )

color - (可选参数) 十六进制数字表示的光照颜色。缺省值为 0xffffff (白色)
intensity - (可选参数) 光源强度/亮度 。缺省值为 1。
width - (可选参数) 光源宽度。缺省值为 10。
height - (可选参数) 光源高度。缺省值为 10。

创建一个新的平面光。

属性(Properties)

公共属性请查看基类Light。

方法(Methods)

公共方法请查看基类 Light。

.copy ( source : RectAreaLight ) : RectAreaLight

将所有属性的值从源 source 复制到此平面光光源对象。

聚光灯(SpotLight)

光线从一个点沿一个方向射出,随着光线照射的变远,光线圆锥体的尺寸也逐渐增大。

// white spotlight shining from the side, casting a shadow
const spotLight = new THREE.SpotLight( 0xffffff );
spotLight.position.set( 100, 1000, 100 );
spotLight.castShadow = true;
spotLight.shadow.mapSize.width = 1024;
spotLight.shadow.mapSize.height = 1024;
spotLight.shadow.camera.near = 500;
spotLight.shadow.camera.far = 4000;
spotLight.shadow.camera.fov = 30;
scene.add( spotLight );

构造器(Constructor)

SpotLight( color : Integer, intensity : Float, distance : Float, angle : Radians, penumbra : Float, decay : Float )

color - (可选参数) 十六进制光照颜色。 缺省值 0xffffff (白色)。
intensity - (可选参数) 光照强度。 缺省值 1。

distance - 从光源发出光的最大距离,其强度根据光源的距离线性衰减。
angle - 光线散射角度,最大为Math.PI/2。
penumbra - 聚光锥的半影衰减百分比。在0和1之间的值。默认为0。
decay - 沿着光照距离的衰减量。

创建一个新的聚光灯。

属性(Properties)

公共属性请查看基类Light。

.angle : Float

从聚光灯的位置以弧度表示聚光灯的最大范围。应该不超过 Math.PI/2。默认值为 Math.PI/3

.castShadow : Boolean

此属性设置为 true 聚光灯将投射阴影。警告: 这样做的代价比较高而且需要一直调整到阴影看起来正确。 查看 SpotLightShadow 了解详细信息。 默认值为 false

.decay : Float

沿着光照距离的衰减量
在 physically correct 模式下,decay 设置为等于2将实现现实世界的光衰减。
缺省值为 1

.distance : Float

如果非零,那么光强度将会从最大值当前灯光位置处按照距离线性衰减到0。 缺省值为 0.0

.penumbra : Float

聚光锥的半影衰减百分比。在0和1之间的值。 默认值 — 0.0。

.position : Vector3

假如这个值设置等于 Object3D.DefaultUp (0, 1, 0),那么光线将会从上往下照射。

.power : Float

光功率
在 physically correct 模式中, 表示以"流明(光通量单位)"为单位的光功率。 缺省值 - 4Math.PI

该值与 intensity 直接关联

power = intensity * 4π

修改该值也会导致光强度的改变。

.shadow : SpotLightShadow

SpotLightShadow用与计算此光照的阴影。

.target : Object3D

平行光的方向是从它的位置到目标位置.默认的目标位置为原点 (0,0,0)
注意: 对于目标的位置,要将其更改为除缺省值之外的任何位置,它必须被添加到 scene 场景中去。

scene.add( light.target );

这使得属性target中的 matrixWorld 会每帧自动更新。

它也可以设置target为场景中的其他对象(任意拥有 position 属性的对象), 示例如下:

const targetObject = new THREE.Object3D();
scene.add(targetObject);
light.target = targetObject;

完成上述操作后,聚光灯现在就可以追踪到目标对像了。

方法(Methods)

公共方法请查看基类 Light。

.copy ( source : SpotLight ) : SpotLight

将所有属性的值从源 source 复制到此聚光灯光源对象。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/455456.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

怎么把本地代码上传到阿里云里面

项目需求 将本地项目上传到阿里云,一般有两种情况 1.在本地创建的项目,没有关联过其他的git远程仓库。 2.从其他项目复制的项目代码,但是想要以此项目为基础重新创建一个新的项目。 解决方式 第一种 第一种项目很好解决,就按…

LeetCode题练习与总结:路径交叉--335

一、题目描述 给你一个整数数组 distance 。 从 X-Y 平面上的点 (0,0) 开始,先向北移动 distance[0] 米,然后向西移动 distance[1] 米,向南移动 distance[2] 米,向东移动 distance[3] 米,持续移动。也就是说&#xf…

从安灯系统看汽车零部件工厂的智能制造转型

在当今快速发展的制造业领域,汽车零部件工厂正面临着日益激烈的市场竞争和不断提高的客户需求。为了在竞争中脱颖而出,实现可持续发展,许多汽车零部件工厂纷纷踏上智能制造转型之路。而安灯系统作为一种重要的生产管理工具,在这场…

Nginx可视化管理平台nginxWebUI(1)【保姆级部署方式】

目录 nginxWebUI简介 1.概述: 2.功能 NginxWebUI的部署方式 实验环境: 1.安装JDK环境、nginx和nginx程序 2.启动nginxWebUI 3.使用浏览器登录webUI 访问格式: 登陆成功后我们就来到了它的可视化管理页面 nginxWebUI简介 1.概述&am…

面试总结一

面试总结 1、自我介绍一下自己2.面试11、css常用布局有哪些2、css常用的属性3.js原型链4、开发中遇到的技术难点5、闭包6、ts了解什么呢7.git都用什么命令8、vue怎么打包9.vue启动一个项目需要什么10、vue怎么创建一个项目 2.面试21.vue2和vue3有什么区别2.复杂组件的封装&…

vue-element-admin顶部导航栏的修改

基于vue-element-admin的顶部一级导航栏的调整&#xff0c;因为一级路由过多导致其他元素被挤到第二行&#xff0c;故现在将原来一级路由数组拆分成两个数组&#xff0c;第二个数组以子菜单显示 关键处调整代码 html <el-menu:active-text-color"variables.menuActiv…

如何为自己的跨境网站添加多国语言翻译功能及推荐起尔网定制与插件开发

如何为自己的跨境网站添加多国语言翻译功能及推荐起尔网定制与插件开发 在全球化的浪潮下&#xff0c;跨境电商成为越来越多企业拓展国际市场的重要途径。然而&#xff0c;语言障碍成为了一个不可忽视的问题。为了更好地服务全球用户&#xff0c;为自己的跨境网站添加多国语言…

199116-50-2,Mito-Tracker Orange CMTMRos是一种高亲和力的线粒体染色剂

一、基本信息 中文名称&#xff1a;线粒体橙色荧光探针 英文名称&#xff1a;Mito-Tracker Orange CMTMRos CAS号&#xff1a;199116-50-2 分子式&#xff1a;C24H24Cl2N2O 分子量&#xff1a;427.37 存储条件&#xff1a;避光、冷藏保存&#xff0c;避免长时间暴露于光线…

基于SSM健身国际俱乐部系统的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;用户管理&#xff0c;场地类别管理&#xff0c;场地信息管理&#xff0c;运动项目管理&#xff0c;场地类型管理&#xff0c;项目类型管理 用户账号功能包括&#xff1a;系统首页&#xff0c;个人中心…

QML----Webengineview点击网页上的下载没反应,下载文件

问题 使用webe加载网页时&#xff0c;点击下载页面会没有反应。原因就是它默认是关闭下载功能 解决 需要在profile里监听下载事件打开onDownloadRequested,当有下载时会触发这个信号,会获取到一个WebEngineDownloadItem这是下载的东西,查询它的一些相关参数,可以修改路径和开…

网站前端登录加密方案调查

https://zhuanlan.zhihu.com/p/625204114 案例 国家政务服务平台 账号设置 (gjzwfw.gov.cn) 方案 代码混淆Rsa公钥加密https协议 案例 LOFTER&#xff08;乐乎&#xff09; - 让兴趣&#xff0c;更有趣 方案 sha256https Sign in GitLab (secxun.com) 方案 不加密内网 凤凰…

mysql视图介绍(本质,修改数据时的表现,排序覆盖)

目录 视图 介绍 语法 使用 本质 修改数据 排序覆盖 视图 介绍 是一种虚拟表&#xff0c;它不存储实际的数据&#xff0c;而是基于查询结果动态生成数据 将查询结果以表结构保存视图和基表之间会互相影响 视图可以基于一张或多张表来创建&#xff0c;并且可以像普通表一样…

List、Set、数据结构、Collections

一、数据结构 1.1 常用的数据结构 栈 栈&#xff1a;stack,又称堆栈&#xff0c;它是运算受限的线性表&#xff0c;其限制是仅允许在标的一端进行插入和删除操作&#xff0c;不允许在其他任何位置进行添加、查找、删除等操作。 简单的说&#xff1a;采用该结构的集合&#…

Clickhouse笔记(二) 集群搭建

0.集群规划 操作系统使用ubuntu2204server&#xff0c;8C8G100G。 节点分片部署192.168.50.5分片1副本1clickhouse-server/clickhouse-client/keeper192.168.50.6分片1副本2clickhouse-server/clickhouse-client/keeper192.168.60.7分片2副本1clickhouse-server/clickhouse-c…

ECharts饼图-饼图纹理,附视频讲解与代码下载

引言&#xff1a; 在数据可视化的世界里&#xff0c;ECharts凭借其丰富的图表类型和强大的配置能力&#xff0c;成为了众多开发者的首选。今天&#xff0c;我将带大家一起实现一个饼图图表&#xff0c;通过该图表我们可以直观地展示和分析数据。此外&#xff0c;我还将提供详…

day7:软件包管理

一&#xff0c;软件包概述 软件包概述 软件包用于安装&#xff0c;升级&#xff0c;卸载一个软件 软件包类型 二进制包 源码经过了编译&#xff08;而且成功了&#xff09;后产生的包&#xff0c;二进制包是linux下默认的安装包 编译好的文件&#xff0c;直接使用&#xff…

音质最好的麦克风有哪些?领夹麦克风哪个品牌好?麦克风十大品牌

在当下自媒体行业蓬勃发展的背景下&#xff0c;无线领夹麦克风已成为众多内容创作者不可或缺的装备。市场上的无线领夹麦克风种类繁多&#xff0c;品质参差不齐&#xff0c;价格也相差悬殊&#xff0c;这使得选购一款合适的麦克风变得颇具挑战性。许多消费者在追求性价比的过程…

无人机避障——路径规划篇(一) JPS跳点搜索算法A*算法对比

JSP 跳点搜索算法与改进 A*算法对比 一、算法概述: 跳点搜索(Jump Point Search,JPS)算法:一种用于路径规划的启发式搜索算法。它主要用于在网格地图(如游戏地图、机器人运动规划地图等)中快速找到从起点到终点的最短路径。该算法在改进 A*算法的基础上进行了优化,通过跳过一…

自由学习记录(12)

综合实践 2D的Shape&#xff0c;Tilemap都要导包的&#xff0c;编辑器也要导包&#xff0c;。。和2d沾边的可能3d都要主动导包 应该综合的去运用&#xff0c;不见得Tilemap就很万能&#xff0c;如果要做什么顶方块的有交互反应的物体&#xff0c; 那直接拖Sprite会更方便一些…

大路灯护眼灯是智商税吗?五款口碑最好的落地灯品牌分享

大路灯护眼灯是智商税吗?在当前照明灯具中&#xff0c;护眼灯大路灯并不是智商税&#xff01;护眼大路灯因其出色的灯光和舒适度效果而受到广泛欢迎。面对市场众多的护眼大路灯产品&#xff0c;选择一把优质的护眼大路灯显得尤为重要。低质量的护眼大路灯不仅性能不佳&#xf…