qq_37340753的博客

高斯模糊简介描述高斯分布高斯函数模糊半径卷积运算卷积核原图像卷积结果细节高斯函数卷积核实现简介描述高斯模糊：使用高斯函数求出的值来作为卷积核进行图像的卷积运算。卷积核总结：对图像进行降维以及特征提取，一般用于人工智能。行数和列数均为奇数的矩阵。卷积核元素的总和体现出输出的亮度。高斯分布f(x)=12πσ2e−(x−μ)22σ2f(x)=\frac{1}{\sqrt{2\pi\sigma^2}} {e^{-\frac{(x-\mu)^2}{2\sigma^2}}}f(x)=2πσ2

Web OpenGL封装简介上下文GLContext基类GLObject着色器GLShader着色器程序GLProgram着色器程序属性GLAttribute、GLUniform数据缓存GLBufferGLTexture和GLFrameBufferhtml标签Canvasvertex shaderfragment shaderiChannels主程序ShaderToyGame主函数简介将OpenGL提供的库函数接口进行一层封装。上下文GLContextOpenGL自身是一个巨大的状态机(State

OpenGL水波纹效果glsl水波纹效果，可使用shadertoy直接运行。sin和iTime配合得到水波纹mask，通过mask流动变化得到水波纹效果。脚本1#iChannel0 "file://./bg0.jpg"// 水波纹中心点const vec2 center = vec2(0.5, 0.5);// 水波纹速度const float speed = 2.5;// 水波纹强度const float intensity = 36.0;void mainImage(out vec

visual studio code安装shadertoy特效环境搭建教程介绍： 由于目前vs code集成shadertoy的教程较少并且没有那么的全面，于是出一期这样的教程。shadertoy介绍shadertoy可以说是shader玩具。正常我们在渲染一个shader效果的的时候通常需要使用某一个语言来驱动shader脚本，就需要花费一定搭建渲染框架的时间；shadertoy则是一款玩具，只需要编写一个glsl脚本即可渲染。搭建shadertoy环境首先，你需要下载vscode和...

在[OpenGL在frag着色器中模拟点光源]的基础上进行修改，得到手电筒效果(https://blog.youkuaiyun.com/qq_37340753/article/details/105029079)思路如下：按照理论，任何光都可以模拟本文中的手电筒。点光源的本质是光照由一个点向外扩散，照射的越远光照越弱。本文不考虑手电筒倾斜照射，本文照射范围将为一个标准圆。代码如下：#iChan...

在3D世界中，模拟点光源实现对墙壁的光照。效果还是非常不错的。思路如下：准备一张墙壁图像。自动生成墙壁的法线纹理。模拟点光源。添加漫反射。随着时间变换进行规律性移动。代码如下：#iChannel0"file://./wall.jpeg"float getVal(vec2 uv){ return length(texture(iChannel0,uv).xyz);...

这一篇将由OpenGL生成法线贴图的基础上再增加光照效果。思路如下：准备一张墙壁图片A。通过A自动生成法线贴图。设计一个平行光，指定平行光的光照颜色和光照方向。使用漫反射光照公式，法线贴图和光照方向进行点乘。计算出光照渲染出的高光部分和阴影部分，和A进行乘法操作。原图如下：首先验证是否生成法线贴图，代码如下：#iChannel0"file://./wall.jpeg"f...

这种生成法线贴图的效果并不是很好，最新的思路是使用基于cGANs的方法来生成法线贴图。glsl比较简单的算法，思想有点类似于人工智能中的梯度下降，步骤为：将像素看作向量，计算出模长，代表为像素的高度获取梯度，是一个vec2加上一个向量z，将方向朝上#iChannel0"file://./car.png"// 计算高度float getVal(vec2 uv){ ret...

glsl浮雕算法，可使用shadertoy直接运行。获取一个角度的两个texture进行相减，再进行灰度化。#iChannel1"file://./car.png"const highp vec3 W = vec3(0.2125, 0.7154, 0.0721);const vec2 TexSize = vec2(100.0, 100.0);const vec4 bkColor = ve...

glsl动感模糊效果，模拟运动时产生上一帧的残留，简单的对每一个像素进行相加，最后再均值一下。可使用shadertoy直接运行：#iChannel1"file://./car.png"#define PI 3.14159265359void mainImage(out vec4 fragColor,in vec2 fragCoord){ vec2 uv=(0.5+fragCoor...

shader油画效果代码参考网络上的Unity Shader脚本，将其转换为glsl语法进行GL渲染。glsl代码如下，可以使用shadertoy直接运行：#iChannel1"file://./dusk.jpg"#define Res iResolution.xyvoid mainImage(out vec4 fragColor,in vec2 fragCoord){ // si...