使用 centi.js 构建的音频对象

带有音乐伴奏的3D变换图形

audio

《three.js如何实现贴图模糊效果 - 使用canvas》申请公开！

第三方库
作品简介 1645
作品推荐
使用帮助
常用链接

HTML
CSS
JavaScript
Result

编译

JavaScript

var centi;
window.onload = function(){
  var prog = 'sz(1,1)bg(0)wh=(w+h)w2=(wh/20)w3=(wh/6)N=(19)v=(3)tv=(3)vol=(0)bpm(137,4)bm(5)beat(){tv=floor(rnd(3,10))vol=(1)}dsp(){vol+=((0-vol)/1999)return(sin(time*PI2*n2f((10-tv)*7+60))*vol)}frame(){clr()f=(c/100+v)cnt=(0)v+=((tv-v)*0.2)r=(PI2/v)cr=(r/N)for(j,0,v){x1=(cos(r*j+f)*w3)y1=(sin(r*j+f)*w3)nr=r*(j+1)l=(N)if(j+1>v){nr=(0)l=(N*(v-j))}x2=(cos(nr+f)*w3)y2=(sin(nr+f)*w3)for(i,0,l){x3=interp(x2,x1,i/l)y3=interp(y2,y1,i/l)push()translate(x3+cx, y3+cy)rotate(-cnt)col((sin(cnt+f)+1)*127, (sin(cnt+f/3)+1)*127, (cos(cnt*2+f/2)+1)*127)rect(-w2/2,-w2/2,w2,w2)pop()cnt+=(cr)}}}';
  
  var canvas = document.getElementById('c');

centi = new Centi("centi");
  centi.init(canvas, getAudioContext());
  centi.parse(prog);
  centi.start();

requestAnimationFrame(update);

编译

CSS

HTML

带有音乐伴奏的3D变换图形

audio

编辑器支持Emmet

快捷键

带有音乐伴奏的3D变换图形

audio

使用Buzz.js构建的HTML5小电影 - 电线上的鸟群

使用HTML5 Audio API（AudioContext）实现的DJ划拨碟片音效

编辑器支持Emmet

快捷键

语言：

语言：

导入代码模板：