shader-doodle实现星际穿越星空璀璨星光灿烂动画效果

代码语言:html

所属分类:粒子

代码描述:shader-doodle实现星际穿越星空璀璨星光灿烂动画效果

代码标签: 穿越 星空 璀璨 星光灿烂 动画 效果

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  margin: 0;
  background: black;
}

shader-doodle {
  display: block;
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate3d(-50%, -50%, 0);
          transform: translate3d(-50%, -50%, 0);
}
</style>

</head>
<body translate="no">
<shader-doodle shadertoy="shadertoy">
<script type="x-shader/x-fragment">
    #define NUM_LAYERS 8.0
    
    mat2 Rot(float a) {
    	float s = sin(a);
    	float c = sin(a);
    	return mat2(c, -s, s, c);
    }
    
    float Star(vec2 uv, float flare) {
    	float d = length(uv);
    	float m = 0.05 / d;
    
    	float rays = max(0.0, 1.0 - abs(uv.x * uv.y * 1000.0));
    	m += rays * flare;
    	uv *= Rot(3.1415 * 0.25);
    	rays = max(0.0, 1.0 - abs(uv.x * uv.y * 1000.0));
    	m += rays * 0.3 * flare;
    
    	m *= smoothstep(1.0, 0.2, d);
    	return m;
    }
    
    float Hash21(vec2 p) {
    	p = fract(p * vec2(123.34, 456.21));
    	p += dot(p, p + 45.32);
    	return fract(p.x * p.y);
    }
    
    vec3 StarLayer(vec2 uv) {
    	vec3 col = vec3(0);
    
    	vec2 gv = fract(uv).........完整代码请登录后点击上方下载按钮下载查看

网友评论0