webgl实现canvas炫酷文字展示动画效果代码
代码语言:html
所属分类:动画
代码描述:webgl实现canvas炫酷文字展示动画效果代码
代码标签: webgl canvas 炫酷 文字 展示 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} </style> </head> <body> <script > /* Parameters */ let vertexCount = 10000 * 4 let depth = 0 let fontName = 'Arial, Helvetica' let fontSize = 24 let frame = 0 let smoothness = 6 /* Properties */ let vertices = [] let dVertices = [] let refctx = document.createElement('canvas').getContext('2d') let gl = document.createElement('canvas').getContext('webgl') let postctx = document.body.appendChild(document.createElement('canvas')).getContext('2d') let canvas = gl.canvas let compileShader = function (type, source) { let shader = gl.createShader(type), status; gl.shaderSource(shader, source) gl.compileShader(shader) status = gl.getShaderParameter(shader, gl.COMPILE_STATUS) if (status) return shader console.error('Shader compile error', gl.getShaderInfoLog(shader)) gl.deleteShader(shader) } let createProgram = function (vertexShader, fragmentShader.........完整代码请登录后点击上方下载按钮下载查看
网友评论0