WebGL突破灯光数量限制，打1000个灯光

最新推荐文章于 2023-07-06 08:31:23 发布
最新推荐文章于 2023-07-06 08:31:23 发布
阅读量393 收藏
点赞数
分类专栏： 虚拟现实 数字工程
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/niceyou2008/article/details/116466425
版权

当我们在做室内场景时，需要打非常多的点光源、聚光灯等局部光源，才能模拟室内光照效果。一般渲染软件如3Dsmax、unity3d里面打上30盏灯光速度卡到爆。比如一栋楼每一层50个灯光，共20层，那么打上1000盏灯光基本是不可能的。那么我们如何做到呢。答案就是：动态打灯光。理论上可以打无限个灯光而一点都不卡。我也测试了一下，500盏没有感觉。so cool！

 

 

 

 

niceyou2008
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
Unity 灯光显示、数量上限问题
当代野生程序猿
12-25 1万+
场景中如果放置过多的灯光会导致显示异常，如图所示，我们在场景中添加了10个Point Light点光源，可以发现正常显示的只有几个： 且随着视角的移动，起作用的灯光会发生变化： 解决方法： 1. 如果使用Built-In内置渲染管线，在Edit / Project Settings / Quality中修改Pixel Light Count的数量： 场景中我们放了10个点光源，我们将其改为10再看一下效果，可以发现灯光显示已...
webgl中加载模型要求以及优化方案
Yuanben_wuxin的博客
02-15 1714
webgl模型要求以及优化方案
启示：适用于Phaser（WebGL渲染）的简单而快速的灯光引擎
02-03
启示 适用于Phaser（WebGL渲染）的简单而快速的灯光引擎。 例 演示版 查看！ 用法 启蒙包括3个主要类别： LightSystem类 LightSystem([WIDTH, [HEIGHT, [DEBUG]]]) 这是您需要实例化以生成必要的着色器和渲染图像的主要类。 宽度/高度（可选）：用于渲染光照贴图的屏幕外图像的大小。 分辨率越高，质量越好。 我建议使用256x256，因为较大的值会对性能产生重大影响。 DEBUG（可选）：设置为true以绘制调试内容。 // Create light system var lightSystem = new LightSystem ( 256 , 256 , true ) ; // Call this in your `update` method: lightSystem . update ( ) ; // You *must* call this every time you add/move/remove lights or objects: lightSystem . updateUniforms ( ) ; Ligh
基于 HTML5 WebGL 的 3D 场景中的灯光效果
HT for Web 3D
01-01 1332
3D 中的模型创建除了颜色以及贴图，灯光的效果也是非常重要的，配置好灯光的位置和颜色可以让整个场景提升不止一个档次，这个例子非常有代表性，希望大家能有所收获~
WebGL 中的灯光设置
Kristen的博客
11-14 568
在 3D 空间中模拟现实世界的灯光的具体原理和细节绝非本篇文章能够描述清楚的，但是对灯光模型有一定的了解对我们的学习还是很有帮助的。以我们的需要来看，我们会简化光照模型，只考虑简单的方向光和环境光，不会考虑任何镜面反射和点光源。这种光的特点可以理解为好像是从一个很遥远的地方照射过来的，然后光线中的每一个光子与其它光子都是平行运动的。接着，我们会更新顶点着色器，考虑到环境光，再考虑到方向光（方向光的作用会因为光线方向与面的夹角关系而不同），计算每一个顶点的颜色。这种光在我们的现实生活中是最常被用到的。
WebGL笔记（六）：简单灯光
weixin_30617695的博客
07-29 274
按MDN的顺序，这篇应该是讲贴图的。但贴图有两个问题不好处理： 1、贴图来源跨域。这种约束的感觉和AJAX差不多，而且MDN也有解释，我想根据经验应该很容易理解； 2、图片格式。这个交待得比较含糊，仅仅有一个提示： Note: Textures' widths and heights must be a power of two number of pixels (that is, 1...
WebGL/ThreeJS灯光demo.zip
11-28
Three.js是建立在WebGL基础上的一个库，它极大地简化了WebGL编程，提供了丰富的3D对象、材料、光源等特性，让非图形编程背景的开发者也能轻松上手。 本Demo "WebGL/ThreeJS灯光demo.zip" 是关于如何在Three.js中...
tolua WebGL库
08-08
【tolua WebGL库】是一个将Lua脚本语言与WebGL图形渲染技术相结合的工具，它允许开发者使用Lua编写游戏或交互式应用的逻辑，并通过WebGL在浏览器中实现高性能的3D图形渲染。这个库的出现使得开发人员可以利用Lua的...
webgl画一个3d组合图形
12-09
在WebGL中绘制3D组合图形是一项挑战性的任务，它涉及到计算机图形学、数学和JavaScript编程等多个领域的知识。WebGL是一种基于OpenGL标准的JavaScript API，用于在任何兼容的Web浏览器中进行三维图形渲染，无需插件...
WEBGL_webgl_
09-29
这个“WEBGL_webgl_”很可能是一份教程或教材，旨在帮助初学者掌握WebGL技术，并随着学习者的进步不断更新内容。 在WebGL中，我们主要通过JavaScript与GPU（图形处理器）进行通信，创建和操纵复杂的几何形状，应用...
从零开始手撸WebGL3D引擎8：里程碑3-一个多光源场景
聚焦游戏和图形引擎开发技术
05-10 827
目前状态 暂停了一段时间后，本周又搞了几天，实现了基于多pass的多光源前向渲染，加上之前实现的基本的scene和transform，勉强可以打个分支了，暂且算作里程碑3：simple scene。虽然代码里面还有很多TODO，但勉强可以看些效果了。先上个视频： undefined 基本功能 目前实现了一个简单的场景和基于组件的场景节点，支持Camera, Light 和 Mesh No
[WebGL入门]二十一，从平行光源发出的光
热门推荐
lufy小屋
08-28 1万+
写的太长了，果然，就算是简单点说，关于光的处理也需要很长的描述。 重点是，3D渲染中没有办法完全模拟现实中的光，只是大致是那么回事而已。 完全模拟自然界的物理学的话，计算量是非常大的，所以代替这些的就是这次所介绍的，使用平行光源，法线，逆矩阵等技术，在一定程度上尽可能的让画面看起来真实。 理解这次文章的内容，需要一定程度的数学知识，向量，法线，矩阵，这些在平常生活中是不会出现的，但是好好考虑一下的话，应该是可以理解的。
WebGL - 光照原理
ithanmang
06-27 1068
1、光照原理 现实世界中，依据光源和方向，光源照射到物体上时，发生了两个重要的现象； 物体不同的表面明暗程度不一致； 物体向地面投下了影子； 三围图形学术语中 着色的真正含义是：根据光照条件重建 “物体各表面明暗不一的效果”的过程，着色器最初被发明出来就是为了重建光照产生的明暗现象； 在讨论着色之前需要考虑一下两件事： 发出光线的光源的类型； 物体表面如何反射光线； 2、光源类型 平行光：...
Opengl(WebGL)前向渲染中的基本光照(包括多光源)
vily_lei的专栏
09-18 860
Demo:http://www.artvily.com/sample?sample=lightBase Demo:http://www.artvily.com/sample?sample=lightGroup 如果打开报错，请清理一下缓存。 上面两张图分别为固定的简单光源和任意组织的多光源(lightGroup: 环境光, 平行光，点光源，聚光灯, 以及BlinnPhong光源) ...
webgl限制帧率_解决three.js / webGL中的gl_PointSize限制
weixin_32953371的博客
12-29 297
I'm using three.js to create an interactive data visualisation. This visualisation involves rendering 68000 nodes, where each different node has a different size and color.Initially I tried to do this...
WebGL－08.灯光使用
最新发布
Sun zi chao的博客
07-06 138
本系列教程主要讲解利用WebGL开发网页版的三维图形程序。这里主要用到的OpenGL和FlyMath内容。本系列内容较难。要求学生对几何和编程有一定的了解。建议初三以上同学学习。3D渲染要真实，最重要的条件有两个，其中一个就是灯光的运用。在WebGL里灯光渲染都放在片元着色器里完成。这就给了我们很大的“艺术创作”空间。有四点大家要记住的。这节我示范的程序是一个简单的点光源照亮三角形。光源在不同的位置，对三角形的照亮部位是不同的。红色的三角形，绿色的灯，照出来的效果会如何呢？
unity webgl 在 ios打不开
06-09
4. 安全设置限制：在 iOS 上，如果你的 Safari 浏览器开启了“限制成人内容”选项，可能会导致无法访问某些网站或者网页内容。建议取消该选项。 如果以上方法均无法解决问题，你可以尝试在其他设备或者浏览器上打开...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值