ThreeJS入门（014）：THREE.DirectionalLight 知识详解，示例代码

最新推荐文章于 2025-02-07 17:44:43 发布
最新推荐文章于 2025-02-07 17:44:43 发布
阅读量1.5k 收藏 48
点赞数 71
分类专栏： # ThreeJS中文API全解 文章标签： 大剑师 threejs教程 threejs示例
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cuclife/article/details/142059217
版权

作者： 还是大剑师兰特 ，曾为美国某知名大学计算机专业研究生，现为国内GIS领域高级前端工程师，CSDN知名博主，深耕openlayers、leaflet、mapbox、cesium，webgl，ThreeJS，canvas，echarts等技术开发，欢迎加微信（gis-dajianshi），一起交流。

在这里插入图片描述

查看本专栏目录 - 本文是第 014篇入门文章

文章目录

THREE.DirectionalLight 是 Three.js 中的一种光源类型，它模拟来自无限远的平行光线，类似于太阳光。这种光源非常适合用于模拟直射的日光或任何其他远距离光源的效果。平行光的特点是，所有光线都平行于彼此，并且它们在场景中的作用范围是无限

了解本专栏 订阅专栏 解锁全文 超级会员免费看
ThreeJS入门（233）：THREE.DirectionalLightHelper 知识详解，示例代码
大剑师兰特的GIS世界
01-28 1179
`THREE.DirectionalLightHelper` 是 Three.js 中的一个辅助工具类，用于在场景中创建一个可视化的方向光源辅助对象。这个辅助对象可以帮助开发者更好地理解和调试方向光源的方向及其影响范围。
ThreeJS入门（112）：THREE.DirectionalLightShadow 知识详解，示例代码
大剑师兰特的GIS世界
10-13 689
`THREE.DirectionalLightShadow` 是 Three.js 中用于处理平行光源（方向光）阴影的一个类。它允许方向光源投射阴影，从而增加场景的真实感。方向光源阴影通过投影技术来模拟，通常使用正交投影将光源照射的场景渲染到一个或多个阴影贴图中，然后在渲染主场景时使用这些阴影贴图来计算阴影效果。
Three.js - DirectionalLight 光源
ithanmang
07-31 4883
DirectionalLight可以看做是模拟太阳发出的光源，这个光源所发出的光都是相互平行的。 平行光不像是SpotLight以及PointLight那样距离物体越远，光的强度就不一样，而DirectionalLight所散发出来的光，所照射的整个区域范围内光强是一样。 示例浏览地址：http://ithanmang.com/threeJs/home/DirectionalLight.htm...
three.js光照效果：平行光与环境光的巧妙结合
最新发布
2408_88802129的博客
02-07 213
在Three.js这一强大的3D图形库中，光照效果是实现逼真场景的关键要素之一。其中，平行光（DirectionalLight）与环境光（AmbientLight）作为两种基本且重要的光源类型，各自承担着不同的角色，但当它们巧妙结合时，能够创造出既真实又富有层次感的照明效果。
three.js方向光DirectionalLight使用，调整方向光颜色、光源位置、光照强度、光照指向、是否可见、是否产生阴影属性(vue中使用three.js10)
点燃火柴的博客
09-12 1万+
方向光DirectionalLight使用一、方向光介绍二、如何使用方向光1.创建方向光2.方向光的属性2.1颜色-color2.2是否可见-visible2.3强度-intensity2.4目标-target2.5位置-position2.6是否产生阴影-castShadow2.7投影远点-shadow.camera.far2.8投影近点-shadow.camera.near2.9投影上边界-shadow.camera.top2.10投影下边界-shadow.camera.bottom2.11投影左边界-
three.js学习笔记（一）-DirectionalLight
低到尘埃，仰望星空
10-14 4983
DirectinalLight-方向光源，可以看做是距离很远的光源。这个光源发出的所有光线都是互相平行的，如太阳光。被方向光光源照亮的整个区域接收到的光强是一样的。方向由位置和原点（0,0,0）来决定，方向光只与方向有关，与离物体的远近无关。 *THREE.DirectionalLight = function ( hex, intensity ) { THREE.Light.call( th
27 Three.js的平行光THREE.DirectionalLight
热门推荐
现在学习也不晚
08-22 1万+
简介 THREE.DirectionalLight平行光可以看作距离很远的光。它发出的所有光线都是平行的。比如太阳光，由于太阳离我们很远，我们可以把太阳的光线看作是平行的。 案例查看地址：http://www.wjceo.com/blog/threejs/2018-02-12/29.html 与点光源和聚光灯光源的区别 最大的区别就是，点光源和聚光灯光源距离物体越远光线越暗。光是从一点发出...
Three.js光源梳理3——平行光（DirectionalLight）
eevee_1的博客
02-09 4915
平行光本质是一个方向向量，在shader中计算时直接与模型顶点的法线方向进行dot点乘操作。 如果L(平行光)的向量与N(顶点法线方向)一样(N Dot L=1)，那么表示模型的这个点正对着光源，应该最亮，相反，如果两个向量呈相反方向(N Dot L=-1)，那么则表示这个点背对光源，应该最暗。 image.png 基础的兰伯特计算模型的明暗就是NdotL。 与Unity中的平行光不一样...
ThreeJS入门（022）：THREE.Material 知识详解，示例代码
大剑师兰特的GIS世界
09-22 876
`THREE.Material` 是 Three.js 中的一个基类，用于定义三维物体的外观属性，如颜色、纹理、透明度等。Three.js 提供了多种不同的材质类型，每种材质都有其独特的特性和用途，以满足不同的渲染需求。`THREE.Material` 本身是一个抽象基类，实际使用的材质都是其子类。
ThreeJS入门（140）：THREE.Mouse 知识详解，示例代码
大剑师兰特的GIS世界
10-27 622
`THREE.MOUSE` 是 Three.js 中的一个枚举对象，它包含了一些预定义的常量，用于标识鼠标的不同按键。这些常量通常在处理用户的鼠标输入时使用，特别是当需要响应鼠标按钮的点击事件时。
three.js 源码注释（四十四）Light/DirectionalLight.js
omni360的专栏
12-06 1767
DirectionalLight方法根据设置灯光的颜属性color, 强度属性intensity创建平行光光源. DirectionalLight对象的功能函数采用定义构造的函数原型对象来实现. NOTE: SpotLight类型灯光实现了阴影,但是需要在场景中使用MeshLambertMaterial或者MeshPhongMaterial 下面一些注释直接摘抄自:http://www.cnblogs.com/yiyezhai/archive/2012/12/24/2829991.html Examp
three.js从入门到精通系列教程033 - 创建DirectionalLight光源和辅助线
深南大道
01-21 498
【代码】three.js从入门到精通系列教程033 - 创建DirectionalLight光源和辅助线。
【Three.js基础入门】：Three.js中的灯光
西门吹雪
07-21 3380
在Three.js中，灯光是为了让3D场景更加真实和逼真而存在的。灯光可以用来模拟现实中的光照效果，例如阴影、反射和折射等。在本文中，我们将介绍Three.js中的不同类型的灯光，以及如何在场景中添加和调整它们的属性。
three.js 03-04 之 DirectionalLight 光源
zhulx_sz 的博客
11-15 1010
这一篇我们来看看剩下的最后一个基础光源 DirectionalLight （方向光或叫平行光）光源。这个光源可以看做是距离很远很远的光源，就像太阳。太阳离我们是如此的遥远，以至于所有的光线到达地球时都成了相互平行的光线了。方向光跟聚光灯光源之间的主要差别是：方向光不像聚光灯那样离目标越远越暗淡，被方向光光源照亮的整个区域接收到的光的强度是一样的。     下面来看一个完整的示例，代码如下所示：
threeJS-Helper05-DirectionalLightHelper(方向光助手)
谷子的博客
12-02 2815
需要电子档书籍或者源码可以Q群：828202939   希望可以和大家一起学习、一起进步！！ 如有错别字或有理解不到位的地方，可以留言或者加微信15250969798，博主会及时修改！！！！！ 博主的案例并不难，只是为了更好的给想入门threeJS的同学一点点经验！！！！！ 本章节学习的内容可以从的官方文档中找到 涉及的知识点博主已经从three源码库里面摘要出来放在对应的注释里面 今天...
(十二) ThreeJS入门 THREE.DirectionalLight
mad970906的博客
11-14 522
是 Three.js 中的一种光源类型，它模拟来自无限远的平行光线，类似于太阳光。这种光源非常适合用于模拟直射的日光或任何其他远距离光源的效果。平行光的特点是，所有光线都平行于彼此，并且它们在场景中的作用范围是无限的。这意味着，无论光源距离场景中的物体有多远，光线的方向和强度都是恒定的。
Threejs之灯光
你华还是你华
09-10 1377
在Three.js中，灯光（Lights）是构建逼真3D场景的重要组成部分，它们能够模拟现实世界中的光照效果，如阴影、反射和折射等，从而增强场景的真实感和立体感。描述：环境光是全局光源，均匀地照亮场景中的所有物体，环境光不能用来投射阴影，因为它没有方向。用途：用于提供场景的基础照明，通常与其他光源配合使用，以避免场景过于黑暗。属性：主要包括颜色（color）和强度（intensity描述：平行光从特定方向投射，类似于太阳光，所有光线是平行的，可以产生阴影。
【three.js:语法】光源使用详解2-3（聚光灯 SpotLight、平行光 DirectionLight 、环境光 HemisphereLight、镜头光晕 LensFlare）
weitaming1的博客
01-14 3285
  注意点：SpotLight.target 的使用。 1、SpotLight.target= object 或者是 THREE.Object3D()才行。不能只是一个position。 2、target的THREE.Object3D()无论是object还是object3D,都必须添加到场景中才行，否则无论怎么直接改spotLight.target的object3D()都是无法生效的。？？...
ThreeJS入门（109）：THREE.LightShadow 知识详解，示例代码
大剑师兰特的GIS世界
10-12 1107
`THREE.LightShadow` 是 Three.js 中用于处理光源阴影的一个类。它允许光源投射阴影，从而增加场景的真实感。光源阴影通过投影技术来模拟，通常使用正交或透视投影将光源周围的场景渲染到一个或多个阴影贴图中，然后在渲染主场景时使用这些阴影贴图来计算阴影效果。
three.js DirectionalLight 大小
06-20
Three.js 中的 `DirectionalLight` 是一种指向光源的方向光，它模拟的是来自特定方向的光线，比如太阳光。在 Three.js 中，`DirectionalLight` 的大小或影响范围实际上并不像点光源（PointLight）那样可以通过大小参数直接控制。因为方向光是无源的，它的强度不会随着距离的增加而衰减，而是始终保持恒定。 然而，你可以通过调整光源的位置和方向来间接地改变其在场景中的视觉效果。如果你想要在一个大场景中让灯光看起来更弱，可以将它设置得离观察者远一些；反之，如果想要更强烈的光照，可以将光源靠近需要照亮的物体。 至于如何设置位置和方向，你可以使用 `position` 属性来指定光源在三维空间中的坐标，`direction` 属性则用于设置光源指向观察者的向量。记住，对于方向光，方向向量的起点通常设为 (0, 0, 0)，终点是光源的实际位置。
评论 18
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

还是大剑师兰特

打赏一杯可口可乐

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值