![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
openGL shader
webGL Shader or openGL Shader
goose leaves a mark
这个作者很懒,什么都没留下…
展开
-
Shadertoy内置函数系列 - mod 取模运算
代码将画布空间分成了9等分,每一份的范围都是0~1(fract(uv.x)函数的作用),创建黑色和红色柱交替的图案,每种颜色有 9 列。然后,隐藏每第三列红色的列。然后在每一份的 [0,0.5] 填充黑色,[0.5,1]填充红色,以此重复。然后再来一个mod约束,提取出 对3取余的所有x,也就是modX,希望能够帮到喜欢shadertoy但是又不是很懂怎么运作的小伙伴。着色器应避免在其代码中使用分支或条件语句,而是依赖。mod函数返回x % 3的结果。函数来确定每个像素的颜色。原创 2024-03-12 20:49:00 · 421 阅读 · 0 评论 -
cocos shader 用到的数学 抛物线,直线方程篇
在抛物线y^2= -2px 中,焦点是( -p/2,0),准线的方程是x=p/2,离心率e=1,范围:x≤0。在抛物线x^2=2py 中,焦点是(0,p/2),准线的方程是y= -p/2,离心率e=1,范围:y≥0。在抛物线x^2= -2py中,焦点是(0,-p/2),准线的方程是y=p/2,离心率e=1,范围:y≤0。在抛物线y^2=2px中,焦点是(p/2,0),准线的方程是x= -p/2,离心率e=1,范围:x≥0。几乎适用于任何曲线,但是有些例外。说明切圆锥的时候是连着的切的。原创 2022-10-13 20:41:28 · 794 阅读 · 0 评论 -
shadertoy 绘制圆形,方形等基础图案
首先绘制圆形,就是小于半径范围内都显示颜色,大于半径范围显示黑色,这个半径怎么找呢,那需要确定两个点,一个圆心,一个不断变化的点,不断变化的点就是uv坐标,圆心自己定自己怎么开心怎么来.#define S(a,b,t) smoothstep(a,b,t)float circle(vec2 uv,vec2 center) { // uv中的点 - 圆心点 vec2 offset = uv - center; // 半径 float len = length(offset原创 2021-08-03 11:09:47 · 246 阅读 · 0 评论 -
shader 高斯模糊
最近想研究一下shader的模糊效果,看了论坛里面关于卷积的相关问题,感觉此方法还是很不错,但是本次的shader也存在效率问题,就是模糊半径设置的越大就会越消耗性能。高斯模糊完整代码:// Copyright (c) 2017-2018 Xiamen Yaji Software Co., Ltd. CCEffect %{ techniques: - passes: - vert: vs frag: fs blendState: tar转载 2020-11-08 13:26:02 · 566 阅读 · 0 评论 -
cocos creator 利用shader 实现探照灯效果
探照灯实现效果如下:light.effect// Copyright (c) 2017-2018 Xiamen Yaji Software Co., Ltd. CCEffect %{ techniques: - passes: - vert: vs frag: fs blendState: targets: - blend: true rasterizerState: cullMode:原创 2020-06-14 23:09:45 · 2354 阅读 · 4 评论 -
shader 利用FBM, noise 模拟海洋波浪
梯度噪声梯度噪声的主要原理是将坐标系划分成一块一块的晶格之后在晶格的每个顶点处生成一个随机的梯度(可以理解成方向向量),然后在计算噪声的时候会综合计算该噪声所在的晶格的顶点上的方向向量(图中绿色箭头)进行聚合计算(可以理解成加权计算合力)。图片来自 scratchapixelPerlin噪声就属于这一类,所以这样一来我们就可以封装一个Perlin噪声的函数了:// re...转载 2020-01-06 19:32:37 · 1951 阅读 · 0 评论 -
smoothstep函数背后的数学原理
t[0,1] ,a,b[0,1]opengl函数中的smoothstep函数:smoothstep(a,b,t);如果x在[a,b]区间内的话就会返回对该函数求导得到: -6t^2 - 6t 是一个开口向下的二次函数,最大值坐标为中点坐标t设为c,可以得到最大值为正值,0-1范围内都是正值,那么 [0,c]从0递增到1.5,[c,1]从1.5递减到0,那么对应的原函数...原创 2020-01-02 14:13:12 · 1687 阅读 · 0 评论 -
opengl shader 控制值范围[0,1]的函数列表
转载 2020-01-02 15:06:24 · 986 阅读 · 0 评论 -
value noise生成算法
噪声图的生成需要依据随机数的生成:取得uv坐标的整数部分和小数部分:对每个网格进行求取随机值,然后再对四个点进行线性插值float random(vec2 uv) { return fract(sin(dot(uv.xy,vec2(13.0909,783.342))) * 423234.323);}// 噪声函数float noise(in vec2 uv) { // 整...转载 2020-01-06 14:47:45 · 385 阅读 · 0 评论