【免费下载链接】LinearAbiltyCastingThreeJS项目地址https://gitcode.com/gh_mirrors/li/LinearAbiltyCastingThreeJS点击查看免费下载LinearAbilityCastingThreeJS 是一个用 Three.js 加手写 GLSL 打造的技能弹道skillshot特效沙盒。除了当前在线的五大技能外它的src/archive/目录里还静静躺着一套被整体退役的四元素系统——其中基于Raymarching光线步进的体积火焰与水面特效是整仓里最值得动手挖掘的宝藏。本文带你找到它、读懂原理并一步步把火焰 / 水面效果搬回主项目几乎不用重写一行数学。先认识项目为什么会有归档这一层 ️一句话概括这个项目一个角色、五种可瞄准的技能、938 个实时滑块全部效果都是程序化生成的——没有一张贴图、没有一张精灵图。完整的能力清单与操作说明见 README.md。上图是当前在线的 Storm Lance风暴长枪一道完全由顶点着色器摆出来的闪电代表了这个项目的特效质量基准。但很少有人注意到这个项目的上一世是另一套系统火、水、土、风四元素沿着你手绘的自由路径喷射角色还能骑在笔画上飞。当项目把手绘路径改成了MOBA 式地面箭头线性技能弹道后整套围绕路径输入构建的系统失去了输入来源于是被整体移进了src/archive/——而不是原地腐烂。官方对归档的说明很直白这些文件不参与 Vite 打包index.html → src/main.js够不到它们留着纯粹是为了日后挖宝原文见 src/archive/README.md。上图是当前在线的 Frost Lance冰枪。归档里的火焰与水面就是与它同一代工程水准的老前辈只是换了输入方式被暂时雪藏。归档里到底藏了什么一份文件地图 想挖宝先拿地图。归档目录里值得关注的文件如下完整清单见 src/archive/README.md目录关键文件里面是什么abilities/FireAbility.js沿路径飞行的体积火球尾部拖燃烧气体终点在空中爆炸abilities/WaterAbility.js沿路径翻涌的水体终点炸开泡沫水冠与喷射水柱materials/VolumetricFireMaterial.js⭐ 4 层 Raymarched 火焰 普朗克黑体着色materials/OceanWaterMaterial.js⭐ Raymarched 水面菲涅尔 泡沫 折射materials/DistortionMaterial.js屏幕空间折射偏移火的热浪、水的折射config/legacySettings.js火焰 / 水面被退役时调好的全部参数原样保留⭐ 标记的两个文件是本文主角一套会烧的火一汪真的水。挖掘宝藏一Raymarched 体积火焰是烧出来的 新手常以为火焰特效就是一张贴图在缩放、做加法混合。归档里的火焰完全不是——它是一段真正的光线步进体积。核心思路火焰本体只是一块代理外壳。贴在飞行路径上的网格并不等于火焰它只是一条朝向相机的账单式条带billboard ribbon负责把真实体积圈住。真正的火发生在每个像素重建路径的局部坐标系 → 从相机发一条射线 → 在密度场里逐步积分发射与吸收。火焰密度场由 4 层从粗到细堆叠顺序正是肉眼读一团火球的顺序轮廓层silhouette路径上的一串胶囊横截面是水滴形浮力向上拉伸半径被一阶低频噪声鼓动——火球外形由米级鼓包主导。涡旋卷起vortex roll-up热气体甩出环形涡沿尾迹后移并随年龄长大让噪声域沿流向、竖直平面按行波旋转把场翻折起来形成翻滚、蘑菇状的烟团——普通 fbm 叠再多八度只能做出云做不出卷。湍流turbulence5 个逐级做域扭曲的八度八度之间旋转去网格化且每层都比上一层浮升更快细结构因此跑过粗结构撕成向上舔的火舌。碎裂shred侵蚀在轴心处很弱、在边缘处很烈火核保持一整块燃烧体边缘却溶成缕缕飘散的细丝。着色不是调色板而是温度。这是全文件最漂亮的一点颜色来自 blackbody()——普朗克黑体辐射近似。火是一团温度不是一张调色板红边 → 橙身 → 白核的连续渐变以及核心区亮过边缘几十倍的巨大动态范围都从物理里掉出来而非手调。三个值得记住的踩坑教训都写在注释里别用加法混合真火既发光又遮挡所以这里用预乘 over 混合火焰才能挡住背景。别用温度驱动整条湍流场辐射功率随温度的高次幂放大若拿完整湍流场去驱动温度火焰会渲染成抛光玛瑙——一圈圈密集等高线。温度要走更钝的几何轮廓胶囊衰减噪声只负责位移。包围盒要用椭球而非球火焰比宽高得多用球包会让固定步数被大量空空间摊薄。火球能力余烬 / 火星 / 烟、空中爆炸、焦痕、热浪扭曲在 FireAbility.js火焰调参集中在 legacySettings.js 的fire块如volumeSteps、shred、tempCore、colorCore。挖掘宝藏二Raymarched 水面是真的水 如果说火焰是穿过介质积分水面就是找一条表面——水不发光它有一张表面水之所以像水几乎全发生在那张表面上。核心思路同样是代理外壳 光线步进但目标不同射线寻找这个符号场第一次变号的点再用4 次二分把交点收进一个像素内然后给该点着色field(p) radius(u) * (1 swell chop) - distanceToAxis(p)实现见 waterField()。表面拿到后五样东西让它读起来是水法线取同一个场的梯度四面体取样密度场里的每条涟漪都真实参与光照更细的波动只加在命中点法线上3 次噪声 vs 40 次还不会打穿表面。反射Schlick 菲涅尔取场景 HDR 环境外加一个很紧的太阳高光——这是湿润感的来源。深度着色对解析弦长做 Beer-Lambert 吸收细边是绿松石色腹部是深蓝。透光薄浪尖被从背后照亮一种 SSS这是海浪由内发光的关键。泡沫浪峰泡沫、翻卷泡沫、剪影喷雾全部用Voronoi 切成一格格的于是读起来是气泡而非刷上去的白漆。又一个反直觉细节水的破碎变薄处撕成丝、带孔的片、结成水珠打在alpha 上而非场上——在场上打孔会在体内制造变号、步进就会撞上内壁得到黑色斑点。折射单独由 DistortionMaterial.js 负责把屏幕空间 UV 偏移写进半分辨率缓冲后处理阶段整体扭曲。当前在线版保留了这条 pass 但暂无人写入等于一个预留钩子正适合拿来复活水的折射。水体落地的泡沫 / 涟漪 / 冲击波贴片和火球的焦痕都打在 src/world/Ground.js 配置的这层天然岩石地面上。火焰 vs 水面两种 Raymarching 的分工 ⚖️维度体积火焰Fire水面Water步进在找什么穿过介质的发射 吸收积分第一次变号的表面再二分细化着色依据温度普朗克黑体发射随 (T/Tcore)^n 放大表面法线菲涅尔反射 深度吸收 透光混合方式预乘 over发光且遮挡普通 alpha 混合含不透明泡沫细节来源4 层密度场轮廓→涡旋→湍流→碎裂场内只放粗浪细波进命中点法线遮挡被不透明深度预通道裁掉同左折射走独立 distortion 缓冲一句话火在体内水在表面。两者共享同一套代理外壳 场景深度裁切基建所以迁移成本极低。把火焰 / 水面搬回主项目5 步迁移指南 归档不是垃圾场而是一个即插即用的效果库。官方恢复步骤src/archive/README.md很短搬文件和依赖回src/例如把 FireAbility.js 及其 import 的 VolumetricFireMaterial.js 移回src/对应目录RibbonGeometry已以 src/effects/RibbonGeometry.js 复活可直接复用。合并参数块把 legacySettings.js 里对应的fire/water块展开进 src/config/settings.js。注册能力在 src/abilities/AbilityManager.js 的ABILITY_TYPES登记类并把 id 加进 settings 的ELEMENTS/ELEMENT_META。处理基类差异归档能力继承的是旧版沿样条Ability在线版是线性Abilityspawn(origin, direction, distance)。要么移植到新版基类要么把旧基类换个名字并排共存——项目其他部分不关心用哪个。输入按需只有想把自由手绘路径找回来时才需要 PathDrawer.js PathTrail.js用AimController递一条两点曲线就能驱动样条型能力。 最小可行目标只想看火焰就搬FireAbilityVolumetricFireMaterialfire参数块 一条两点曲线基本就能跑起来。让效果活起来值得先摸的关键旋钮 ️参数在 legacySettings.js 里保留了退役时的黄金值迁移后按下几个效果立刻不同火焰shred边缘碎裂烈度、tempCore/tempEdge黑体核心 / 边缘温度、volumeSteps步进步数画质与开销的权衡、paletteBlend0 纯物理辐射1 手绘调色板。水面waveAmplitude/chop浪与碎浪强度、fresnel与specular湿润高光、translucency薄浪尖背光、foam泡沫密度、detail命中点细波。两者共享streamLength拖尾长度、headSize头部放大、glow进 bloom 的强度。这些值每帧被各系统读取改滑块会立刻反映在正在飞的火球 / 水柱上——这正是整个项目暂停中也能编辑哲学的延续。收个尾 ⛏️src/archive/里真正被雪藏的不只是一段旧代码而是两个完整的 Raymarching 教学样本一个教你在体内积分出温度与烟一个教你在表面找回法线、菲涅尔与泡沫。读懂它们再回头写任何新技能弹道特效都会顺手得多。如果只想拿走一块就走的宝贝优先从 VolumetricFireMaterial.js 的 blackbody() 和 OceanWaterMaterial.js 的 waterField() 这两个函数开始——一个函数里就藏着一整团火或一汪水。赞分享【免费下载链接】LinearAbiltyCastingThreeJS项目地址https://gitcode.com/gh_mirrors/li/LinearAbiltyCastingThreeJS点击查看免费下载相关推荐探索技术宝藏SecretFinder - 深入挖掘隐藏秘密的利器探索技术宝藏SecretFinder 深入挖掘隐藏秘密的利器 项目简介 是一个由安全研究者 m4ll0k 开发的强大工具旨在帮助开发者和安全研究人员发现并提小米MiMo-7B-MTPs vs 传统语言模型为什么MTP层是推理能力的黄金钥匙小米MiMo 7B MTPs vs 传统语言模型为什么MTP层是推理能力的黄金钥匙 小米MiMo 7B MTPs作为新一代开源语言模型通过创新的MTPMLinearAbilityCastingThreeJS陨石技能深度解析Raymarched火焰尾迹与熔岩裂纹着色器LinearAbilityCastingThreeJS陨石技能深度解析Raymarched火焰尾迹与熔岩裂纹着色器 LinearAbilityCastingT创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考