js通过canvas实现梵高星空中行云流水动画效果代码

代码语言:html

所属分类:动画

代码描述:js通过canvas实现梵高星空中行云流水动画效果代码

代码标签: canvas 梵高 星空 行云 流水

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

<html>

<head>
    <style>
        body {
          background-color: #000;    
          margin: 0;
          overflow: hidden;
          background-repeat: no-repeat;
        }
    </style>

</head>

<body><canvas id="canvas"></canvas>
    <script>
        var canvas = document.getElementById("canvas");
        
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;
        
        // Initialize the GL context
        var gl = canvas.getContext('webgl');
        if(!gl){
          console.error("Unable to initialize WebGL.");
        }
        
        //Time
        var time = 0.0;
        
        //************** Shader sources **************
        
        var vertexSource = `
        attribute vec2 position;
        void main() {
          gl_Position = vec4(position, 0.0, 1.0);
        }
        `;
        
        var fragmentSource = `
        precision highp float;
        
        #define AA
        
        uniform float width;.........完整代码请登录后点击上方下载按钮下载查看

网友评论0