代码运行网站:http://editor.thebookofshaders.com/

// Author @CuriosityWang
// https://www.cnblogs.com/curiositywang #ifdef GL_ES
precision mediump float;
#endif float ColA = 0.028;
float RowA = 0.033; uniform vec2 u_resolution;
uniform vec2 u_mouse;
uniform float u_time; // length 控制右边开始的长度
float pctGenerateRow(vec2 st, float top, float length){
if(st.x < 1. - length){
return 1.;
}
float pct1 = step(top, st.y);
float pct2 = step(top - RowA, st.y);
float pct = pct2 - pct1;
return 1. - pct;
} float pctGenerateCol(vec2 st, float right, float length){
if(st.y < 1. - length){
return 1.;
}
float pct1 = step(right, st.x);
float pct2 = step(right - ColA, st.x);
float pct = pct2 - pct1;
return 1. - pct;
} vec3 generateRed(vec2 origin, vec2 st){
if(st.x < origin.x && st.y > origin.y ){
return vec3(165./255., 32./255., 35./255.);
}
return vec3(1.);
} vec3 generateBlue(vec2 origin, vec2 st){
if(st.x > origin.x && st.y < origin.y){
return vec3(1./255., 94./255., 153./255.);
}
return vec3(1.);
} vec3 generateYello(vec2 origin, vec2 st){
if(st.x > origin.x && st.y > origin.y){
return vec3(254./255., 195./255., 51./255.);
}
return vec3(1.);
} void main(){
vec2 st = gl_FragCoord.xy/u_resolution.xy;
vec3 color = vec3(247./255., 242./255., 224./255.); float pct1 = pctGenerateCol(st, 0.248, 1.0);
float pct2 = pctGenerateCol(st, 0.7, 1.0);
float pct3 = pctGenerateCol(st, 0.952, 1.0);
float pct_s = pctGenerateCol(st, 0.1, 0.336); float pct4 = pctGenerateRow(st, 0.684, 1.0);
float pct5 = pctGenerateRow(st, 0.860, 1.0);
float pct_row_s = pctGenerateRow(st, 0.092, 0.776); vec3 red = generateRed(vec2(0.240,0.660), st);
vec3 yellow = generateYello(vec2(0.950,0.650), st);
vec3 blue = generateBlue(vec2(0.680,0.070), st); // float pct = pct1; float pct = pct1 * pct2 * pct3 * pct4* pct5 * pct_s * pct_row_s;
color = vec3(pct) * color;
// color = mix(color, red, 1.);
color *= red * blue * yellow;
gl_FragColor = vec4(color,1.0);
}

Shader作画的更多相关文章

  1. OpenGL shader 中关于顶点坐标值的思考

    今天工作中需要做一个事情: 在shader内部做一些空间距离上的计算,而且需要对所有的点进行计算,符合条件的显示,不符合条件的点不显示. 思路很简单,在vertex shader内知道顶点坐标,进行计 ...

  2. CSharpGL(14)用geometry shader渲染模型的法线(normal)

    +BIT祝威+悄悄在此留下版了个权的信息说: CSharpGL(14)用geometry shader渲染模型的法线(normal) +BIT祝威+悄悄在此留下版了个权的信息说: 2016-08-13 ...

  3. 【译】Unity3D Shader 新手教程(6/6) —— 更好的卡通Shader

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 动机 如果你想了解以下几件事,我建议你阅读以下这篇教程: 想知道如何写一个multipass的toon shade ...

  4. 【译】Unity3D Shader 新手教程(5/6) —— Bumped Diffuse Shader

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 动机 如果你满足以下条件,我建议你阅读这篇教程: 你想学习片段着色器(Fragment Shader). 你想实现 ...

  5. 【译】Unity3D Shader 新手教程(4/6) —— 卡通shader(入门版)

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 暗黑系 动机 如果你满足以下条件,我建议你阅读这篇教程: 你想了解更多有关表面着色器的细节知识. 你想实现一个入门 ...

  6. 【译】Unity3D Shader 新手教程(3/6) —— 更加真实的积雪

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 如果你满足以下条件,我建议你阅读这篇教程: 你想知道如何在表面着色器中进行混色(blend colour) 你想实 ...

  7. 【译】Unity3D Shader 新手教程(2/6) —— 积雪Shader

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 如果你是一个shader编程的新手,并且你想学到下面这些酷炫的技术,我觉得你可以看看这篇教程: 实现一个积雪效果的 ...

  8. 【译】Unity3D Shader 新手教程(1/6)

    本文为翻译,附上原文链接. 转载请注明出处--polobymulberry-博客园. 刚开始接触Unity3D Shader编程时,你会发现有关shader的文档相当散,这也造成初学者对Unity3D ...

  9. 多材质(Shader)实现

    最近在cocos creator上打算写个U3D中shader功能的插件(能在属性面板调整shader属性). 对其中一个功能有点疑惑,就是U3D中一个渲染物体上可以挂多个材质,后来查询了下,一个物体 ...

  10. unity的固定管线shader

    最近shader学习中,看的视频. 练习的固定管线的shader如下: ps.在unity5中半透明不好用,其他的还好 //不区分大小写 //这是固定管线的Shader Shader "Sh ...

随机推荐

  1. Report -「概率数据结构」随机化骗分?我们是专业的!

    \[\mathscr{Lorain~y~w~la~Lora~blea.} \newcommand{\DS}[0]{\displaystyle} % operators alias \newcomman ...

  2. 通过Nginx反向代理配置/.well-known/pki-validation/fileauth.txt步骤实例

    最近在某云平台上申请了SSL证书(https),SSL证书申请或者续期过程中需要进行域名验证. 如果域名验证类型选择[文件]方式,等你提交申请后,要在目标域名对应的服务端上传一个文件(通常是一个.tx ...

  3. 在 Windows 10 上实现免密码 SSH 登录

    前言 在日常开发中,SSH(Secure Shell)作为一种安全的远程登录协议,广泛用于 Linux 和 Windows 系统之间的连接.为了提高效率,我们可以通过配置免密码登录,省去每次连接时输入 ...

  4. superset 1.3 hello world 开发实录

    参考网址: https://superset.apache.org/docs/installation/building-custom-viz-plugins 实际操作: 因为内容是从hub上下载的: ...

  5. Sorcerer pg walkthrough Intermediate

    nmap ┌──(root㉿kali)-[~/lab] └─# nmap -p- -A 192.168.192.100 Starting Nmap 7.94SVN ( https://nmap.org ...

  6. ORACLE事物隔离级别和脏读、幻读、不可重复读区别

    一.事务和隔离级别 事务的概念:事务是把对数据库的一系列操作都看做一个整体,要么全部成功,要么全部失败,利用事务我们可以保证数据库的完整性,事务具有原子性. 隔离级别:隔离级别定义了事务与事务之间的隔 ...

  7. 0101-win10 jkd配置注意事项

    更换新的电脑预装win10家庭版,根据常规方法配置jdk8后运行javac提示:不是内部或外部命令,也不是可运行的程序或批处理文件. 1 设置变量classpath时前面有个点(完成这一步后javac ...

  8. 通过串口通信 对TCP传输层以下的理解

    这可能是近期暂时最后一篇c嵌入式的文章了 基础的串口使用 参照网上的stm32教程套路引入标准库,初始化芯片手册上对应串口引脚 ,初始化stm32串口功能,然后有数据了就自然在寄存器上,就这样,你的波 ...

  9. dart变量类型详解

    1==> 三个单引号的作用 String Str = ''' qijqowjdo 哈哈嘿嘿黑 '''; print(Str); 这样使用三个单引号,输出来换行:方便我们观看而已哈 2==> ...

  10. 一种提升SQL改写效率的方法

    本文分享自天翼云开发者社区<一种提升SQL改写效率的方法>,作者:唐****律 一.背景 SQL改写是数据库产品中使用比较频繁的一个技术,在大多数产品中的调用频率也非常高,通常对性能的需求 ...