Material —— 材质节点 | Math

WebGPU与WGSL实现可视化MMD材质节点编辑器的开发实践 材质节点编辑器是现代实时渲染中的重要工具,它通过可视化编程方式替代传统的着色器代码编写。其核心原理是将复杂的着色器逻辑分解为功能模块节点,用户通过连接节点端口构建完整的材质效果。这种技术显著降低了图形编程门槛,同时保持了代码级的灵活性。在WebGPU和WGSL的技术栈支持下,节点编辑器能够实现高效的在线编译和实时预览。WebGPU作为下一代Web图形API,提供了更底层的硬件控制和更好的性能表现,而WGSL作为其着色器语言,具备强类型和模块化特性。在MMD材质编辑等应用场景中,开发者可以直观地调整材质参数, 阅读详情

数学运算节点

Pi —— π 

Add —— 加

Subtract —— 减

Multiply(M)—— 乘

Divide(D)—— 除

MultiplyAdd —— 加乘

Fmod —— 取余

OneMinus(O) —— 1-x

SquareRoot —— 平方根

Sign —— 数值正负符号

Abs —— 绝对值

Floor —— 向下取整

Ceil —— 向上取整

SmoothCeil —— 向上取整并平滑渐变

Frac —— 取小数部分

Truncate —— 取整数部分

Min —— 取最小值

Max —— 取最大值

Round —— 四舍五入

Clamp —— 钳制在指定范围

Saturate —— 钳制在0~1(无消耗)

QuadraticFormula —— 二次方程求根(ax2+bx+c=0)

SumOfAConsecutiveNumberSequence —— 连续整数求和(1+2+...n)

Power(E) —— 指定底数的指数

Exponential —— 底数e的指数

Exponential2 —— 底数2的指数

Logarithm —— 底数e的对数(输入应大于0)

Logarithm2 —— 底数2的对数(输入应大于0)

Logarithm10 —— 底数e的对数(输入应大于0)

注:指数与对数互为逆运算;

Sine —— 正弦(弧度,1对应2π)

LinearSine —— 类似正弦但是线性过渡

Sine_Remapped  —— 通过sin重映射两个V3

Cosine —— 余弦(弧度,1对应2π)

Tangent —— 正切(弧度,1对应2π)

Arcsine —— 反正弦(求正弦对应的弧度值,此操作昂贵)

Arccosine —— 反余弦(求余弦对应的弧度值,此操作昂贵)

Arctangent —— 反正切(求正切对应的弧度值,此操作昂贵)

Arctangent2 —— 反正切(输入的是对应的边长x,y)

ArcsineFast —— 近似反正弦(输入需为-1~1)

ArccosineFast —— 近似反余弦(输入需为-1~1)

ArctangentFast —— 近似反正切

Arctangent2Fast —— 近似反正切(输入的是对应的边长x,y)

DotProduct —— 点乘

CrossProduct —— 叉乘

Normalize(N) —— 标准化向量(每个分量/向量长度)

SafeNormalize —— 标准化向量(避免长度为0)

If(I) —— 比较两个值,根据比较结果输出

LinearInterpolate(L)—— 线性插值

InverseLinearInterpolate —— 逆线性插值(计算值在给定范围内的归一化位置)

Step —— 如Y>X为0否则为1(适合创建遮罩、边缘切割或条件开关)

SmoothStep —— 平滑过渡(适合实现边缘柔化、平滑混合、动态过渡)

AppendVector —— 添加通道

ComponentMask —— 获取指定通道

BreakFloat2/3/4 —— 获取2/3/4的每个分量

AddComponents —— 每个分量相加求和

AngleBetweenVectors —— 求两个向量的夹角

RemapValueRange —— 将值从一个范围重映射另一个范围(不钳制)

RemapValueRangeNormalized —— 将值从一个范围重映射0~1(钳制)

CreateThirdOrthogonalVector —— 给定两个矢量创建三个相互垂直的标准化矢量

MakeVectorsOrthogonal —— 给定三个矢量创建三个相互垂直的标准化矢量

ProjectVectorOntoPlane —— 投射一向量到另一向量上

FindSaturation —— 查找颜色的饱和度

VectorToRadialValue —— 将uv转化径向坐标

DegreesToRadians —— 角度转弧度

RadiansToDegrees —— 弧度转角度

RgbToHsv —— 将颜色从rgb转化尾hsv

RGBtoHSV —— 将颜色从rgb转化尾hsv(材质函数)

HsvToRgb —— 将颜色从hsv转化尾rgb

LineIntervalIntersection —— 两个线段的交叉点

CylinderIntersection —— 计算射线与圆柱体的交点,常用于生成圆柱形遮罩、体积效果或碰撞检测;

DeriveNormalZ_Function —— 用于从法线向量的 X 和 Y 分量推导出 Z 分量的函数,通常用于优化法线贴图或自定义法线计算;

RayTracedSphere

Transform3*3Matrix

InverseTransformMatrix

TransformToClipSpace

2dArrayLookupByIndex

ArrangePointsEvenlyAroundABox

UnpackNormalFromFloat

  

ue5材质总结 根据以上的推理,加上各种材质的属性可以调制不同质感出来,例如黄金的颜色是黄偏一点红,金属感肯定是拉满的,往下降就偏密度低的黄色塑料。粗糙度略微添加(根据之前推理粗糙度变高会导致密度感降低,黄金的密度是很高的所以不能过高,但是过低了又会产生抛光效果,黄金一般是不反光的)各向异性是真实世界中不光滑表面产生一圈漫反射的现象,特别光滑的表面是一个点,特别不光滑的是没有的,它介于反光同时不光滑之间。切线会影响各向异性的方向,x设置为1是横着切,Y设置成1是竖着切,Z设置成1是交叉切有葡萄霜的感觉。 阅读详情

相关推荐

程序化生成花色地砖PBR材质:节点工作流与无缝平铺技巧

程序化材质是无需照片素材即可生成纹理的技术方案,其核心在于将颜色、凹凸、粗糙度等信息拆解为数学规则,再通过节点组合输出PBR贴图。原理上,花色地砖材质由砖缝基座、花纹图案和随机色差三层信息叠加而成,利用UV分割与周期噪声可保证无缝平铺。此类工作流可参数化调整颜色、砖缝宽度与图案密度,适合批量生成多种变体,在游戏场景、室内效果图及虚拟展厅中均有广泛应用。本文以程序化节点为工具,系统讲解如何从零构建一套完整的花色地砖PBR材质,涵盖基座生成、花纹叠加、色差控制及法线、粗糙度、AO、Height通道输出,并适配B

weixin_33816300的博客 505

UE 极坐标、旋转、溶解、燃烧、查找边缘、浮雕、去色、抖动材质

UE 极坐标、旋转、溶解、燃烧、查找边缘、浮雕、去色、抖动材质

伪善者的博客 4818

基于WebGPU的MMD材质节点编辑器:可视化创作WGSL着色器

着色器编程是计算机图形学的核心技术,通过编写着色器代码控制GPU渲染管线,实现复杂的材质效果和视觉表现。传统着色器开发需要掌握GLSL/HLSL等专业语言,技术门槛较高。节点编辑器将复杂的数学运算和图形算法封装为可视化组件,通过连线建立数据流动关系,大幅降低了图形编程的学习曲线。WebGPU作为下一代Web图形API,采用现代化的WGSL着色器语言,提供了更高效的GPU资源管理和多线程支持。在MMD模型材质创作领域,基于WebGPU的节点编辑器让创作者无需安装专业3D软件,直接在浏览器中通过可视化操作生成W

weixin_34252686的博客 438

UE5材质实现近大远小的效果 完善视差效果

接下来,要理解的是拉伸比例的大小。这个大小,可以通过映射的方式,粗略的线性计算。蓝图里有个映射蓝图结点(Map Range Clamped 可以实现值的转换,进行映射),材质里也有个结点叫RemapValueRange。锚点坐标(图像中心)先移动到原点(左上角),再把UV坐标系拉伸放大,再移动回锚点原来的位置。视差里的UV,已经通过计算将坐标系放到了 视差里的面的锚点上。和顶点法线很像,但是当有法线贴图时,像素法线的输出会包含法线贴图的计算。物体的世界位置(即Transform组件上的坐标)

m0_64217692的博客 2076

WebGPU与WGSL在线编译:构建MMD材质节点编辑器的完整实战

WebGPU作为下一代Web图形API,通过提供更接近现代GPU架构的底层访问,显著提升了Web端的图形计算性能。其核心着色器语言WGSL(WebGPU Shading Language)类似于Vulkan的SPIR-V,支持强类型系统和现代着色器特性。在3D建模和动画制作领域,可视化节点编辑器通过图形化界面让开发者能够直观组合材质效果,大大降低了着色器编程的门槛。结合WebGPU的硬件加速和WGSL的动态编译能力,可以实现实时的材质预览和热重载机制。这种技术组合特别适用于MMD材质编辑等需要复杂着色器效果

chulilang8944的博客 399

WebGPU实时渲染MMD模型与可视化材质节点编辑实战

WebGPU作为下一代Web图形API,通过计算着色器和更低的CPU开销等现代GPU特性,显著提升了浏览器中的3D渲染性能。其技术价值在于能够实现传统WebGL难以处理的复杂材质和光影效果,特别适用于MMD(MikuMikuDance)这类动漫风格角色的实时渲染场景。本文基于PMX模型解析和WGSL着色器编程,深入探讨如何构建完整的WebGPU渲染管线,并集成可视化材质节点编辑器,实现从模型加载、骨骼动画到动态材质编辑的全流程解决方案。通过实时渲染与节点编辑的有机结合,为在线3D内容创作提供了强大的工程实践

weixin_34059951的博客 461

【UE 材质】实现角度渐变材质、棋盘纹理材质

【UE 材质】实现角度渐变材质

ChaoChao66666的博客 2068

remap:将值从一个范围映射到另一范围

@ compactjs / remap 将值从一个范围映射到另一范围 ··· 目录 安装 NPM: npm install @compactjs/remap CDN: < script src =" https://unpkg.com/@compactjs/remap/dist/index.umd.js " > </ script > 用法 /** * Maps a value from one range to another */ function remap ( value : number , min : number , max : number , targetMin : number , targetMax : number ) : number ; 作为模块: import { remap } from '@compactjs/remap

《Unreal Engine 4从入门到精通》完整目录

Unreal Engine发展历程Unreal Engine的“贵族血统”与转型全球商用游戏引擎市场份额(80%)Procedural Nature Pack功能介绍资源内容古建筑复原需求历史资料整理本书从软件基础知识讲解到完整案例剖析,全面深入地介绍了Unreal Engine 4的各种命令和工具的功能与使用方法,以及在项目开发中的具体应用。

小宝哥Code的专栏 439

用Python 绘制一个只属于你自己的世界地图

Python之所以这么流行,是因为它不仅能够应用于科技领域,还能用来做许多其他学科的研究工具,绘制地图便是其功能之一。 今天我们用matplot工具包之一的mpl_toolkits来绘制世界地图,这是一个简单的可视化工具,如果希望绘制更加复杂的地图,可以考虑使用Google Maps API,不过这不在我们今天的讨论范围之内。 1.安装 为了能够顺利开展本项目,你需要先安装以下依赖,在cmd或Terminal中输入以下命令: pipinstallnumpy pipinstallm...

qq_38887171的博客 1870

从IR Drop到EM分析:数字IC电源规划中那些没人明说的细节(以MTCMOS配置为例)

本文深入探讨数字IC后端设计中电源规划的关键细节,特别关注MTCMOS配置、电源网络电阻最小化和level shifter供电等实战技巧。通过分析IR Drop和EM问题,提供优化floorplan和powerplan的具体策略,帮助工程师避免常见陷阱,提升芯片设计的稳定性和可靠性。

q9w8e7r6t5的博客 511

three.js 节点材质系统 MaterialNode 深度解析:从材质属性到 TSL 着色器节点的自动映射

MaterialNode 是 three.js 节点材质系统(NodeMaterial / TSL)中连接「JavaScript 侧材质属性」与「着色器节点图」的桥梁,它让 `materialColor`、`materialRoughness`、`materialNormal` 等预定义 TSL 对象能够自动反映材质参数的实时变化。本文以 [MaterialNode.html.md](https:

gitblog_00818的博客 775

【每天一个知识点】多视图子空间聚类(Multi-view Subspace Clustering)

本文深入解析了多视图子空间聚类技术,这是一种处理多源异构数据的先进方法。它通过融合多个数据视图(如文本、图像、网络结构)的共识与互补信息,学习统一的潜在子空间表示,从而获得比单一视图更鲁棒、准确的聚类结果。文章详细阐述了其核心思想、主流技术流派(如图融合、共同潜在子空间、张量及深度学习方法),并提供了Python实战代码与调优经验,适用于跨模态检索、生物信息学等多领域复杂数据分析。

weixin_29065015的博客 459

foobar2000 DUI 皮肤安装教程:foobox-cn 完整配置指南

如果你觉得 foobar2000 默认界面不够整洁,可以安装 foobox-cn——一套基于 JSplitter 组件的 DUI 皮肤配置(DUI 即 foobar2000 的默认用户界面)。它把默认窗口换成播放列表、封面、歌词分栏的现代化布局,全程中文界面,兼容 foobar2000 v1.5+(x86)与 v2.0+(x86/x64)。 ## 项目速览 foobox-cn 不是独立播放器,

gitblog_00078的博客 495

计算机视觉(相机标定;内参;外参;畸变系数)

目录 一、预备知识 1、坐标系变换过程(相机成像过程) (1)相机坐标系转换为图像坐标系(透视投影变换遵循的是针孔成像原理) (2)齐次坐标的引入原因:(为什么引入齐次坐标???) 2、内参与外参矩阵的构成 3、畸变参数 二、相机标定 1、张正友标定法(光学标定)及其求解思路 2、求解内参矩阵与外参矩阵的思路: (1)计算内参与外参矩阵的乘积M (2)求解内参矩阵A (3)求解外参矩阵(R1 R2 T) 三、参数优化 1、L-M算法 2、相机标定步骤 四、相关代码及其实验结.

QYJ_WORKHARDING的博客 6万+

道路施工检测 (construction) - 基于Mapillary Vistas数据集的YOLOv11目标检测及UI界面实现

目标检测是计算机视觉的重要任务,目标是识别图像中的目标物体类别及其位置(用边界框表示)。两阶段检测器:如Faster R-CNN,准确度高但速度较慢单阶段检测器:如YOLO系列、SSD,速度快且精度相对较好,适合实时场景数据量:约25,000张高分辨率街景图标注类型:语义分割、实例分割、多类别检测类别示例:construction, road, car, person, traffic sign等格式:COCO风格JSON标注。

YOLO 496

three.js 节点系统解析:用 UserDataNode 将对象 userData 字段动态绑定到节点材质

UserDataNode 是 three.js TSL(Three Shading Language)节点系统中一类特殊的“引用节点”(ReferenceNode),它能把 3D 对象 `userData` 字段中的值链接为材质节点对象,使着色器变量随对象属性自动同步更新。本文以 [UserDataNode 官方文档](https://link.gitcode.com/i/70dfa0b716d1

gitblog_00252的博客 526

Sigrity Power Tree如何生成电源树操作指导

Sigrity Power Tree可以方便地生成电源树,仅需要网表文件就能将系统的电源树直观的显示出来,生成的电源树文件可以用Power DC,optimizePI进行直流和交流仿真,下面介绍如何生成电源树。Base on [Device_TYPE and VALUE]就是识别网表中器件的Device_TYPE作为power tree中的模型的名字。Allegro layout netlist file,就是从Allegro layout文件中输出的netlist第三方网表文件。如何生成电源树操作指导。

weixin_54787054的博客 1533

Material Maker数学节点应用:向量运算、函数曲线与复杂计算终极指南

Material Maker是一款基于Godot游戏引擎的强大程序化纹理创作和3D模型绘制工具,通过其丰富的数学节点系统,让用户能够实现从简单的算术运算到复杂的向量变换和函数曲线控制。本文将为您详细介绍如何充分利用Material Maker的数学节点功能来创建惊艳的材质效果。🚀 ## 数学节点基础:从简单运算到复杂计算 在Material Maker中,数学节点是构建复杂材质的核心组件。这

gitblog_00065的博客 500

Claude Code Agents 进阶:多代理协作与任务委托

Agent 是一个独立运行的 Claude 实例,它有自己的上下文和任务焦点。│ 主 Claude ││ (协调者) ││ │ │▼ ▼ ▼│ 代码审查 │ │ 测试生成 │ │ 文档编写 ││ │ ││▼汇总结果,完成任务并行处理:多个 Agent 同时工作,提高效率任务隔离:每个 Agent 有独立的上下文专业分工:不同类型的 Agent 擅长不同任务灵活控制:可以指定运行模式、超时等参数。

gaoxiang_120的专栏 336

在 Zynq 7010 上运行 VxWorks 7.0 的详细流程【持续更新】

本文介绍了在Zynq 7010开发板上运行VxWorks 7.0的完整流程。主要包括:1)使用Vivado创建硬件设计,配置Zynq模块并生成比特流文件;2)通过Workbench 4创建VxWorks工程,配置启动参数并生成镜像;3)下载运行步骤。此外还讲解了使用Workbench 4开发VSB和VIP工程的方法,包括工程创建、配置和调试流程。文中提供了关键操作截图和注意事项,为开发者提供了完整的Zynq 7010平台VxWorks开发解决方案。

weixin_45397344的博客 1223

three.js 节点材质体系中的 Phong 光照模型:PhongLightingModel 实现原理与实战指南

`PhongLightingModel` 是 three.js 基于 TSL(Three Shading Language)构建的节点材质光照模型中用于 Phong 材质的着色模型实现,它定义了漫反射(Lambert 扩散项)与高光反射(Blinn-Phong 镜面项)两部分的数学计算,是 [MeshPhongNodeMaterial](https://link.gitcode.com/i/cef

gitblog_00440的博客 713

锂电池充电器电路设计 里面有电路

锂电池充电器电路设计 里面有电路 3.7V升压到5V电路设计。

Blender 材质教程:从零搭建可复用的 PBR 节点工作流(含 3 个场景示例)

Blender 节点一多就乱:不知道哪个口接哪个,渲染不对也说不出问题在哪——瓶颈通常不是技巧,而是工作流。思路分三步:先按反射、能量、细节看懂 PBR 材质,再按底色层→细节层→调节层→输出层搭一套可复用的节点结构,最后给出金属、地形、玻璃三类场景的连接逻辑。 ## 先看懂:PBR 材质的三个关键维度 你可以把 PBR 材质理解为光线和表面之间的一次"谈判":光打到表面后,一部分均匀弹开(漫

gitblog_01160的博客 258

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

android 蓝牙通讯demo

android 下蓝牙通讯demo,实现了发现蓝牙,使能蓝牙,通过蓝牙发送消息。

Substance Designer节点驱动动画:从原理到实战,打造GPU实时动态材质

程序化纹理生成是计算机图形学和实时渲染领域的核心技术之一,它通过数学函数和算法动态生成纹理,替代传统的位图采样,从而实现无限分辨率、极致可控和资源轻量化。其核心原理在于将纹理属性(如颜色、高度、法线)参数化,并通过节点网络描述其生成逻辑。这项技术的核心价值在于赋能GPU实时计算,大幅降低运行时资源开销,并支持属性的动态联动与无缝循环。在游戏开发、影视特效和实时可视化等应用场景中,程序化动态材质正成为提升视觉真实感和交互性的关键技术。本文聚焦于利用Substance Designer的节点网络,特别是Time

344

Substance Designer节点动画实战:从原理到应用,掌握程序化动态材质

程序化纹理生成是现代计算机图形学和游戏开发中的核心技术,它通过算法和节点网络自动创建材质,极大地提升了内容生产的效率和一致性。其核心原理在于将视觉属性(如颜色、高度、粗糙度)转化为可被数学函数和逻辑流程控制的数据流。这项技术的核心价值在于能够实现高度可控、无损缩放且易于迭代的资产创建,尤其适用于需要大量重复或动态变化的场景。在游戏开发、影视特效和实时渲染等领域,程序化纹理被广泛应用于生成动态环境贴图、UI元素和程序化背景。本文聚焦于Substance Designer这一主流工具,深入探讨如何通过引入时间变

weixin_33911824的博客 356

Unity ShaderGraph入门:10分钟创建动态闪烁材质与核心节点解析

着色器是计算机图形学中定义物体表面视觉属性的核心程序,它通过数学计算控制像素的颜色、光照和纹理。其工作原理是将3D模型的顶点、法线、纹理坐标等信息,经过一系列坐标变换和光照模型计算,最终输出到屏幕像素。这项技术对于实现逼真的材质表现、动态视觉效果和性能优化具有重要价值,广泛应用于游戏开发、影视特效、模拟仿真和交互式媒体等领域。在Unity引擎中,ShaderGraph作为一款强大的可视化着色器编辑工具,通过节点式编程大幅降低了着色器开发门槛。它允许开发者通过连接预定义的节点(如数学运算、纹理采样、向量处理)

weixin_34248023的博客 329
上一篇: VEX —— 字符串Strings
下一篇: Material —— 材质节点 | Utility
挨代码
博客等级 码龄5年 1696粉丝 384原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值