webgl实现炫酷彩色圆点正方形漩涡动画效果代码

代码语言:html

所属分类:动画

代码描述:webgl实现炫酷彩色圆点正方形漩涡动画效果代码

代码标签: webgl 炫酷 彩色 圆点 正方形 漩涡 动画

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  

  
  
<style>
body {
  margin: 0;
}
</style>

  
  
</head>

<body translate="no">
  <canvas id="myCanvas"></canvas>

<script id="fragment-shader-2d" type="x-shader/x-fragment">

#version 300 es

precision highp float;

uniform vec2 iResolution;
uniform vec2 iMouse;
uniform float iTime;

out vec4 fragColor;

#define PI 3.14159265359

void mainImage(out vec4 fragColor, in vec2 fragCoord) {
  vec2 uv = (fragCoord - iResolution.xy/2.)/iResolution.y;

  vec2 uv0 = uv; // initial uv value is stored before any modifications are made, serving as a reset point

  float scale = 25.; // scale of the grid (25 cells in a vertical column - and in the horizontal axis it's scaled in accordance with the screeen's aspect ratio)

  uv = round(uv*scale)/scal.........完整代码请登录后点击上方下载按钮下载查看

网友评论0