ShaderToy

[TOC]

写过的各种奇怪shader

01.gif https://www.shadertoy.com/view/7dSBDV

---

02.gif https://www.shadertoy.com/view/7tXyzr

---

本地开发环境

除了在 ShaderToy 上直接构建，vscode也有一个非常好用的插件

• VS Code 扩展页直接下载 Shader Toy 或去 vscode 官网下载 https://marketplace.visualstudio.com/items?itemName=stevensona.shader-toy

代码页右键 Shader Toy: Show GLSL Preview即可实时观察效果

Texture Input

The texture channels iChannelN may be defined by inserting code of the following form at the top of your shader

#iChannel0 "file://duck.png"
#iChannel1 "https://66.media.tumblr.com/tumblr_mcmeonhR1e1ridypxo1_500.jpg"
#iChannel2 "file://other/shader.glsl"
#iChannel2 "self"
#iChannel4 "file://music/epic.mp3"

构建3D

参考 iq 大神的作品入的门，但一开始看属实抽象，虽然知道用了哪些技术，但看不懂代码，导致又杂七杂八参考了很多别人 shader 的才堪堪看懂

---

sdf 函数（符号距离函数）和 Ray Marching (光线行进算法，光线追踪的一种) 的结合

02是我实现的最简单版本，可以参考一下

---

更多SDF函数：https://iquilezles.org/www/index.htm