1️⃣6️⃣three.js_光源
16、光源
-
3D虚拟工厂在线体验
-
在 Three.js 中,环境光(AmbientLight)、点光源(PointLight)、平行光(DirectionalLight)、 聚光灯(SpotLight)、半球光(HemisphereLight)是几种常用的光源类型。
-
blender 中的日光、点光、面光、聚光:
-
three.js:环境光、点光源、平行光、聚光灯、半球光:
开启地面接收物体阴影
const tempScene = scene.children.find(t => t.name == 'Scene')const tempFactoryGround = tempScene.children.find(t => t.name == '厂区');tempFactoryGround.receiveShadow = true; // 地面接收阴影
renderer开启阴影映射
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap; // 更柔和的阴影
16.1、环境光
//===== 1. 添加一个小物体(测试聚光灯照射) =====
const sphereGeometry = new THREE.SphereGeometry(1, 32, 32);
const sphereMaterial = new THREE.MeshStandardMaterial({ color: 0xff0000 });
const sphere = new THREE.Mesh(sphereGeometry, sphereMaterial);
sphere.position.set(200, 5, -20); // 放在聚光灯照射范围内
sphere.castShadow = true;
scene.add(sphere);
// ===== 2. 环境光(AmbientLight) =====const ambientLight = new THREE.AmbientLight(0x666666, 5) // 柔和的白光
scene.add(ambientLight)
✅执行结果:
- 环境光(AmbientLight)会均匀地照亮场景中的所有物体,没有方向性,也不会产生阴影。场景中的基础亮度,好比阴天的自然光,避免纯黑区域。
16.2、点光源
// ===== 3. 点光源(PointLight) =====
const pointLight = new THREE.PointLight(0xff0000, 5); // 红色,强度5,范围
pointLight.decay = 0.2//设置光源距离衰减度
pointLight.position.set(190, 10, -20);
pointLight.castShadow = true;
pointLight.shadow.mapSize.width = 1024; // 提高阴影质量
pointLight.shadow.mapSize.height = 1024;
scene.add(pointLight);
const pointLightHelper = new THREE.PointLightHelper(pointLight, 1, 0x00ff00) //光源辅助观察
scene.add(pointLightHelper);
✅执行结果:
- 点光源(PointLight)从一个点向所有方向发射光线(类似灯泡),设置为红色,强度为5时,可以看到中间的圆球在地面上投射出阴影。要使阴影正常显示,需要满足以下条件:
- 物体必须开启阴影投射:sphere.castShadow = true;
- 地面必须开启阴影接收:tempFactoryGround.receiveShadow = true;
- 渲染器需启用阴影映射:renderer.shadowMap.enabled = true;
- 点光源(或其他光源)需启用阴影投射:pointLight.castShadow = true;
16.3、平行光
// ===== 4. 平行光(DirectionalLight) =====
const directionalLight = new THREE.DirectionalLight(0x0000ff, 1); // 蓝色,强度1
directionalLight.position.set(200, 10, -20);
directionalLight.target.position.set(200, 0, -20); // 看向正下方
directionalLight.castShadow = true;
directionalLight.shadow.mapSize.width = 1024;
directionalLight.shadow.mapSize.height = 1024;// 扩大阴影相机的视锥范围
directionalLight.shadow.camera.left = -50; // 左边界
directionalLight.shadow.camera.right = 50; // 右边界
directionalLight.shadow.camera.top = 50; // 上边界
directionalLight.shadow.camera.bottom = -50; // 下边界
directionalLight.shadow.camera.near = 0.1; // 近平面
directionalLight.shadow.camera.far = 100; // 远平面
directionalLight.shadow.camera.updateProjectionMatrix();// 更新投影矩阵scene.add(directionalLight);
scene.add(directionalLight.target); // 将 target 添加到场景
const dirLightHelper = new THREE.DirectionalLightHelper(directionalLight, 2, 0xffff00) //辅助平行光
scene.add(dirLightHelper);
✅执行结果:
- 平行光(DirectionalLight) 模拟无限远处的光源(如太阳光),所有光线平行照射。将其设置为蓝色、强度为1时,可以观察到中间的圆球在地面上投射出清晰的阴影。
16.4、聚光灯
// ===== 5. 创建聚光灯(SpotLight) =====
const spotLight = new THREE.SpotLight(0xffffff, // 颜色30, // 强度100, // 照射距离(增大)Math.PI / 6, // 角度(30°)0.5, // 边缘柔化0.5 // 衰减
);
spotLight.position.set(210, 50, -20); // 提高光源高度,扩大阴影范围
spotLight.target.position.set(210, 0, -20); // 照射目标点
spotLight.castShadow = true;
spotLight.shadow.mapSize.width = 1024; // 提高阴影分辨率
spotLight.shadow.mapSize.height = 1024;
scene.add(spotLight);
scene.add(spotLight.target);
const spotLightHelper = new THREE.SpotLightHelper(spotLight,0x00ff00);// 添加聚光灯 Helper(辅助观察器),设置为绿色
scene.add(spotLightHelper);
✅执行结果:
- 聚光灯(SpotLight) 模拟手电筒或舞台灯光效果,光线呈锥形照射。此时可以观察到中间圆球在地面上投射出清晰的阴影。
16.5、半球光
// ===== 6. 创建半球光(HemisphereLight) =====
const hemisphereLight = new THREE.HemisphereLight(0x87CEEB, // 天空颜色(天蓝色)0x708090, // 地面颜色(灰蓝色)5 // 强度
);
hemisphereLight.position.set(220, 0, -20); // 设置半球光位置(虽然无实际作用,但 Helper 需要)
scene.add(hemisphereLight);
// 添加半球光 Helper(辅助观察器)
const hemisphereLightHelper = new THREE.HemisphereLightHelper(hemisphereLight, 2,0x00ff00);
scene.add(hemisphereLightHelper);
✅执行结果:
- 半球光(HemisphereLight) 模拟自然光照效果,通过分别设置天空(上方)和地面(下方)的不同颜色,形成柔和的渐变环境光。这种光源比普通的环境光(AmbientLight)更接近真实自然光的散射效果,适合营造户外场景的自然照明。
- 点击【专栏目录】查看专栏其他内容。
相关文章:
1️⃣6️⃣three.js_光源
16、光源 3D虚拟工厂在线体验 在 Three.js 中,环境光(AmbientLight)、点光源(PointLight)、平行光(DirectionalLight)、 聚光灯(SpotLight)、半球光(Hemisph…...
AD16如何执行DRC检测
AD16如何执行DRC检测 DRC检测主要用来查看走线是否出现通断,以及是否出现短路。 1)、点击“Tools”---“Design Rule Check…” 2)、全部勾选 3)、勾选“Electrical”中的“Batch”选项,参与DRC检测 4)、勾选“Routing”中的“Batch”选项,…...
PostgreSQL性能优化实用技巧
PostgreSQL的性能优化需从索引设计、查询调优、参数配置、硬件资源等多维度入手。以下为实战中验证有效的优化策略,适用于高并发、大数据量等场 一、索引优化:精准加速查询 1.选择正确的索引类型 BRIN索引:对按时间或数值顺…...
Vue3 ref与props
ref 属性 与 props 一、核心概念对比 特性ref (标签属性)props作用对象DOM 元素/组件实例组件间数据传递数据流向父组件访问子组件/DOM父组件 → 子组件响应性直接操作对象单向数据流(只读)使用场景获取 DOM/调用子组件方法组件参数传递Vue3 变化不再自…...
SpringBoot | 构建客户树及其关联关系的设计思路和实践Demo
关注:CodingTechWork 引言 在企业级应用中,客户关系管理(CRM)是核心功能之一。客户树是一种用于表示客户之间层级关系的结构,例如企业客户与子公司、经销商与下级经销商等。本文将详细介绍如何设计客户树及其关联关系…...
SpringCloud——负载均衡
一.负载均衡 1.问题提出 上一篇文章写了服务注册和服务发现的相关内容。这里再提出一个新问题,如果我给一个服务开了多个端口,这几个端口都可以访问服务。 例如,在上一篇文章的基础上,我又新开了9091和9092端口,现在…...
Springboot3+ JDK21 升级踩坑指南
目录 GetMapping和 RequestBody 一起使用时,会把请求方式由GET变为POST 变更默认的httpClient feign 超时配置失效 GetMapping和 RequestBody 一起使用时,会把请求方式由GET变为POST 变更默认的httpClient 添加依赖 <dependency><groupId&g…...
Qt UDP组播实现与调试指南
在Qt中使用UDP组播(Multicast)可以实现高效的一对多网络通信。以下是关键步骤和示例代码: 一、UDP组播核心机制 组播地址:使用D类地址(224.0.0.0 - 239.255.255.255)TTL设置:控制数据包传播范围(默认1,同一网段)网络接口:指定发送/接收的物理接口二、发送端实现 /…...
idea连接远程服务器kafka
一、idea插件安装 首先idea插件市场搜索“kafka”进行插件安装 二、kafka链接配置 1、检查服务器kafka配置 配置链接前需要保证远程服务器的kafka配置里边有配置好服务器IP,以及开放好kafka端口9092(如果有修改 过端口的开放对应端口就好) …...
第十节:性能优化高频题-虚拟DOM与Diff算法优化
优化策略:同层比较、静态节点标记、最长递增子序列算法 Key的作用:精确识别节点身份 虚拟DOM与Diff算法深度优化策略解析 一、核心优化策略 同层比较机制 Diff算法仅对比同一层级的虚拟节点,避免跨层级遍历带来的性能损耗。 • 实现原理&am…...
vmware workstation的下载地址页面
Fusion and Workstation | VMware...
kubernetes》》k8s》》Dashboard
安装Dashboard 因为我的Kubernetes 版本是 v1.28.2 对应的 Dashboard V2.7.0 wget -O https://raw.githubusercontent.com/kubernetes/dashboard/v2.7.0/aio/deploy/recommended.yaml # 因为默认是集群内访问的,需要追加 NodePort访问类型 vim recommended.yaml …...
软考:数值转换知识点详解
文章目录 1. 进制转换1.1 二进制(Binary)、八进制(Octal)、十进制(Decimal)、十六进制(Hexadecimal)之间的转换1.2 手动转换和计算方法1.3 使用编程语言进行进制转换 2. 数据类型转换…...
第15章:MCP服务端项目开发实战:性能优化
第15章:MCP服务端项目开发实战:性能优化 在构建和部署 MCP(Memory, Context, Planning)驱动的 AI Agent 系统时,性能和可扩展性是关键的考量因素。随着用户量、数据量和交互复杂度的增加,系统需要能够高效地处理请求,并能够平滑地扩展以应对更高的负载。本章将探讨 MCP…...
Windows申请苹果开发者测试证书Uniapp使用
注意事项 苹果设备,最好是iPhone XS以上,要不然下载不了Apple DeveloperopenSSL 要是V1版本的来生成证书,要不然HBuilder报错按步骤来,生成证书,生成标识符,添加测试设备,生成描述性文件注册苹果开发者账号 (如果有苹果账号直接登录) 苹果开发者官网 开通付费 点击右上…...
服务器数据恢复—NAS存储中raid5上层lv分区数据恢复案例
NAS数据恢复环境: QNAP TS-532X NAS设备中有两块1T的SSD固态硬盘和3块5T的机械硬盘。三块机械硬盘组建了一组RAID5阵列,两块固态硬盘组建RAID1阵列。划分了一个存储池,并通过精简LVM划分了7个lv。 NAS故障: 硬盘故障导致无法正常…...
uniapp跨平台开发---switchTab:fail page `/undefined` is not found
问题描述 在项目中新增了一个底部tab导航栏,点击底部tabBar,跳转失败,控制台打印错误信息switchTab:fail page /undefined is not found 排查思路 错误信息提示,switchTab跳转的页面路径变成了/undefined,排查新增的pages.json文件,发现pages,以及tabBar中的list均已经加入该导…...
详细讲解 QMutex 线程锁和 QMutexLocker 自动锁的区别
详细讲解 QMutex 线程锁和 QMutexLocker 自动锁的区别 下面我们详细拆解 Qt 中用于线程同步的两个核心类:QMutex 和 QMutexLocker。 🧱 一、什么是 QMutex? QMutex 是 Qt 中的互斥锁(mutex)类,用于防止多个…...
如何获取静态IP地址?完整教程
静态IP地址,因其固定不变的特性,在远程访问、服务器搭建、电商多开、游戏搬砖等场景中显得尤为重要。以下是获取静态IP地址的完整教程,涵盖家庭网络、企业网络和公网静态IP的配置方法: 一、什么是静态IP? 内网IP&…...
JavaScript 里创建对象
咱们来用有趣的方式探索一下 JavaScript 里创建对象的各种“魔法咒语”! 想象一下,你是一位魔法工匠,想要在你的代码世界里创造各种奇妙的“魔法物品”(也就是对象)。你有好几种不同的配方和工具: 1. 随手…...
【华为HCIP | 华为数通工程师】821—多选解析—第十五页
多选794、以下关于高可用性网络特点的描述,正确的是哪些项? A、不会出现故障 B、不能频出现故障 C、一旦出现故障只通过人工干预恢复业务 D出现故障后能很快恢复 解析:高可用性网络拥有良好的可靠性,不间断转发NSF…...
Kaamel视角下的MCP安全最佳实践
在以AI为核心驱动的现代产品体系中,大模型逐渐从实验室走向生产环境,如何确保其在推理阶段的信息安全和隐私保护,成为各方关注的重点。Model Context Protocol(MCP) 作为一个围绕模型调用上下文进行结构化描述的协议&a…...
Kafka 命令行操作与 Spark-Streaming 核心编程总结
一、Kafka 命令行操作详解 1.创建 Topic 命令格式: kafka-topics.sh --create --zookeeper <zk节点列表> --topic <主题名> --partitions <分区数> --replication-factor <副本数> 参数说明: 分区数(partitions…...
【华为OD机试真题】428、连续字母长度 | 机试真题+思路参考+代码解析(E卷)(C++)
文章目录 一、题目题目描述输入输出样例1样例2 一、代码与思路🧠C语言思路✅C代码 一、题目 参考:https://sars2025.blog.csdn.net/article/details/139492358 题目描述 ◎ 给定一个字符串,只包含大写字母,求在包含同一字母的子串…...
nodejs获取请求体的中间件 body-parse
虽然 Express 4.16.0 之后已经内置了处理请求体的功能(express.json() 和 express.urlencoded()),但你也可以单独使用老牌中间件 body-parser,它仍然很常用,尤其在某些旧项目中。 📦 一、安装 body-parser …...
5.学习笔记-SpringMVC(P61-P70)
SpringMVC-SSM整合-接口测试 (1)业务层接口使用junit接口做测试 (2)表现层用postman做接口测试 (3)事务处理— 1)在SpringConfig.java,开启注解,是事务驱动 2)配置事务管理器(因为事务管理器是要配置数据源对象&…...
腾讯云服务器安全——服务防火墙端口放行
点击服务进入安全策略 添加规则...
mfc学习(一)
mfc为微软创建的一个类qt框架的客户端程序,只不过因为微软目前有自己 的亲身儿子C#(.net),所以到2010没有进行维护。然后一些的工业企业还在继续进行维护相关的内容。我目前就接手一个现在这样的项目,其实本质与qt的思路是差不多的…...
【MQ篇】初识RabbitMQ保证消息可靠性
🌟我的其他文章也讲解的比较有趣😁,如果喜欢博主的讲解方式,可以多多支持一下,感谢🤗! 🌟了解 MQ 请看 : 【MQ篇】初识MQ! 其他优质专栏: 【&…...
神经网络基础[ANN网络的搭建]
神经网络 人工神经网络( Artificial Neural Network, 简写为ANN)也简称为神经网络(NN),是一种模仿生物神经网络结构和功能的计算模型。各个神经元传递复杂的电信号,树突接收到输入信号…...
【技术派后端篇】整合WebSocket长连接实现消息实时推送
在技术派平台中,实现了文章被点赞或评论后,在右上角实时弹出消息提醒的功能。相较于之前仅有的消息通知红色标识,这种实时通知在交互体验上有显著提升。本文将详细介绍如何借助WebSocket实现消息的实时通知。 1 基础知识点 1.1 相关概念 W…...
Janus Pro
目录 一、模型概述与开源情况 二、模型能力与性能 三、竞品分析 四、部署成本与个人部署成本比较 五、其他维度比较 1. 模型架构与创新性 2. 社区支持与生态系统 3. 更新频率与维护 4. 适用场景与灵活性 5. 商业化潜力 六、总结 Janus Pro 是中国初创公司 DeepSeek …...
[密码学实战]在Linux中实现SDF密码设备接口
[密码学实战]在Linux中实现SDF密码设备接口 引言 在密码学应用开发中,SDF(Security Device Interface)作为中国国家密码管理局制定的密码设备接口标准,被广泛应用于金融、政务等领域的安全系统中。本文将以GmSSL国产密码库为基础,手把手指导在Linux系统中部署SoftSDF——…...
机器学习基础 - 分类模型之SVM
SVM:支持向量机 文章目录 SVM:支持向量机简介基础准备1. 线性可分2. 最大间隔超平面3. 什么是支持向量?4. SVM 能解决哪些问题?5. 支持向量机的分类硬间隔 SVM0. 几何间隔与函数间隔1. SVM 最优化问题2. 对偶问题1. 拉格朗日乘数法 - 等式约束优化问题2. 拉格朗日乘数法 - …...
PostgreSQL 中的权限视图
PostgreSQL 中的权限视图 PostgreSQL 提供了多个系统视图来查询权限信息,虽然不像 Oracle 的 DBA_SYS_PRIVS 那样集中在一个视图中,但可以通过组合以下视图获取完整的系统权限信息。 一 主要权限相关视图 Oracle 视图PostgreSQL 对应视图描述DBA_SYS_…...
pnpm install报错:此系统上禁止运行脚本
依赖安装 报错信息: pnpm : 无法加载文件 C:\Users\XXX\AppData\Roaming\npm\pnpm.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsoft.com/fwlink/?LinkID135170 中的 about_Execution_Policies。 所在位置 行:1 …...
解决yarn install 报错 error \node_modules\electron: Command failed.
在电脑重装系统后,重新安装项目依赖,遇到这一报错 完整报错信息如下: error D:\xxxxx\xxxxxx\node_modules\electron: Command failed. Exit code: 1 Command: node install.js Arguments: Directory: D:\xxxxx\xxxxx\node_modules\electron Output: HTTPError: Response cod…...
深度学习3.7 softmax回归的简洁实现
import torch from torch import nn from d2l import torch as d2lbatch_size 256 train_iter, test_iter d2l.load_data_fashion_mnist(batch_size)3.7.1 初始化模型参数 net nn.Sequential(nn.Flatten(), nn.Linear(784, 10))def init_weights(m):if type(m) nn.Linear:…...
Linux424 chage密码信息 gpasswd 附属组
https://chat.deepseek.com/a/chat/s/e55a5e85-de97-450d-a19e-2c48f6669234...
Spring Boot单元测试实战指南:从零到高效测试
在Spring Boot开发中,单元测试是保障代码质量的核心环节。本文将基于实际开发场景,手把手教你如何快速实现分层测试、模拟依赖、编写高效断言,并分享最佳实践! 一、5分钟环境搭建 添加依赖 在pom.xml中引入spring-boot-starter-te…...
Netty线上如何做性能调优?
大家好,我是锋哥。今天分享关于【Netty线上如何做性能调优?】面试题。希望对大家有帮助; Netty线上如何做性能调优? 1000道 互联网大厂Java工程师 精选面试题-Java资源分享网 在使用 Netty 进行线上服务时,性能调优是…...
总结-SQL注入分类手法注入漏洞总结性分化说明
目录 关键要点 按参数类型分类 按提交方式分类 按反馈结果分类 其他高级注入类型 最新漏洞动态 防御措施 调查笔记:SQL注入类型与详细分析 一、按参数类型分类 二、按提交方式分类 三、按反馈结果分类 四、其他高级注入类型 五、最新漏洞动态 六、防御…...
Linux:进程的创建进程的终止
进程的创建 fork fork是c语言中的一个函数,用于创建新的子进程,它存放在<unistd.h>的头文件中 当我们运行程序时,如果使用了fork函数那么就会为这个进程创建一个它的子进程,这个子进程会继承父进程的所有数据和代码&…...
[C#]反射的实战应用,实际数据模拟
long? value null; // 看它是不是 HEX_STRING var dtAttr prop.GetCustomAttribute<DataTypeAttribute>(); if (dtAttr ! null && dtAttr.DataType DataType.HEX_STRING) {// 去掉可能的 "0x" 前缀string txt attribute.Value.StartsWith("0…...
机器人灵巧手有刷与无刷空心杯电机解析
一、电机结构分析 (一)有刷空心杯电机结构 有刷空心杯电机主要由上壳、碳刷、连接板、换向器线圈、外壳、轴承、永磁体、下壳及轴承密封圈组成。碳刷与换向器直接接触,负责传导电流,使线圈在永磁体产生的磁场中受力转动。这种机械换向方式虽直接,但碳刷磨损会影响电机寿命…...
JetBrains GoLang IDE无限重置试用期,适用最新2025版
注意本文仅用于学习使用!!! 本文在重置2024.3.5版本亲测有效,环境为window(mac下应该也一样奏效) 之前eval-reset插件只能在比较低的版本才能起作用。 总结起来就一句:卸载重装,额外要删掉旧安装文件和注册…...
【网络应用程序设计】实验四:物联网监控系统
个人博客:https://alive0103.github.io/ 代码在GitHub:https://github.com/Alive0103/XDU-CS-lab 能点个Star就更好了,欢迎来逛逛哇~❣ 主播写的刚够满足基本功能,多有不足,仅供参考,还请提PR指正ÿ…...
第六章:安全最佳实践
Chapter 6: 安全最佳实践 🌟 从上一章到本章 在第五章:框架/工具抽象中,我们学会了如何用框架快速搭建MCP服务器。现在想象这样一个场景:你的文件服务器已经开发完成,但突然发现恶意用户能通过路径遍历攻击访问系统文…...
最高支持高速L3商用,华为发布ADS 4智驾系统
作者 |张马也 编辑 |德新 4月22日,华为在上海召开乾崑智能技术大会。 会上,华为正式推出乾崑智驾ADS 4、鸿蒙座舱HarmonySpace 5、乾崑车控XMC数字底盘引擎等一系列智能汽车解决方案。 其中最为重磅的是,华为正式发布高速L3商用解决方案&a…...
[创业之路-382]:企业法务 - 企业如何通过技术专利与技术秘密保护自己
企业通过技术专利与技术秘密保护自身创新成果是构建核心竞争力的关键策略。以下从技术专利和技术秘密两大维度,系统阐述其保护路径及实施要点: 一、技术专利保护策略 1. 专利布局规划 核心专利:针对核心技术进行专利申请,构建基…...