鳥触手花火

Readme
JavaScript 280 lines
HTML 1 lines
CSS 0 lines

もうすっかり鳥触手花火の季節ですね

鳥触手花火

var canvas,ctx,count,tama,syoku,pika,kira,kai;

canvas = document.getElementsByTagName('canvas')[0];
ctx = canvas.getContext('2d');
canvas.width=canvas.height=400;
ctx.fillRect(0,0,canvas.width,canvas.height);
tama=[];
syoku=[];
pika=[];
kira=[];
count=kai=0;
psyoku(270,160,0);
psyoku(140,220,1);
main();

function kao(x,y,s,px,py,lit){
    if(lit===undefined)lit=1;
    ctx.lineWidth=s*2;
    ctx.strokeStyle="rgba(100,55,11,"+lit+")";
    ctx.fillStyle="hsla(44,80%,"+(50)+"%,"+lit+")";
    ctx.beginPath();
    ctx.arc(x,y,30*s,0,Math.PI*2,0);
    ctx.fill();
    ctx.stroke();
    
    x+=px*s;
    y+=py*s;
    ctx.fillStyle="rgb(0,0,0)";
    ctx.beginPath();
    ctx.arc(x-10*s,y-2*s,4*s,0,Math.PI*2,0);
    ctx.fill();
    ctx.beginPath();
    ctx.arc(x+10*s,y-2*s,4*s,0,Math.PI*2,0);
    ctx.fill();
    
    y+=15*s;
    
    ctx.fillStyle="rgba(100,55,11,"+lit+")";
    ctx.beginPath();
    ctx.lineTo(x-15*s,y);
    ctx.lineTo(x,y+9*s);
    ctx.lineTo(x+15*s,y);
    ctx.lineTo(x,y-9*s);
    ctx.fill();
    
    s*=0.8;
    ctx.fillStyle="hsla(44,70%,60%,"+lit+")";
    ctx.beginPath();
    ctx.lineTo(x-15*s,y);
    ctx.lineTo(x,y+9*s);
    ctx.lineTo(x+15*s,y);
    ctx.lineTo(x,y-9*s);
    ctx.fill();
    
    ctx.beginPath();
    ctx.lineTo(x-14.9*s,y);
    ctx.lineTo(x+14.9*s,y);
    ctx.stroke();
}

鳥触手花火

もうすっかり鳥触手花火の季節ですねvar canvas,ctx,count,tama,syoku,pika,kira,kai; canvas = document.getElementsByTagName('canvas')[0]; ctx = canvas.getContext('2d'); canvas.width=canvas.height=400; ctx.fillRect(0,0,canvas.width,canvas.height); tama=[]; syoku=[]; pika=[]; kira=[]; count=kai=0; psyoku(270,160,0); psyoku(140,220,1); main(); function settama(n){ var a,b; for(a=0;a<n;a++){ b={}; b.x=50+Math.random()*(canvas.width-100); b.y=canvas.height+5; b.cou=(80+Math.random()*20)|0; b.rx=(Math.random()-0.5); b.ry=-(2+Math.random()*3); b.ban=tama.length; tama.push(b); } } function setsyoku(n,tx,ty,ban){ var a,b,c,r,kn,sk,col,ft,lt; pika.push({x:tx,y:ty,cou:0}); kn=1+Math.random()*1; sk=1+Math.random()*4; kn*=sk/3; kai++; col=(kai*37+200)%360; ft=1+Math.random()*Math.random()*3; lt=Math.random()<0.1; for(a=0;a<n;a++){ b={}; r=Math.PI*2*Math.random(); c=0.5+Math.random(); b.px=Math.cos(r)*c; b.py=Math.sin(r)*c; b.x=tx; b.y=ty; b.kn=kn; b.sk=sk; b.cou=10; b.col=col; b.ban=ban+syoku.length; b.ft=ft; b.lt=lt; b.r=r*3; syoku.push(b); } } function kune(ob){ var a,b,c,d,e,f,g,max,p,p1,r,x,y,x1,y1,len,lit,kn,sk,col; b=ob; ctx.globalCompositeOperation = "source-over"; if(b.lt)ctx.globalCompositeOperation = "lighter"; lit=1; if(b.cou>180)lit=(200-b.cou)/20; if(b.lt)lit=lit/8; r=b.r; kn=b.kn; sk=b.sk; col=b.col; g=1; if(b.ban%2==1)g=-1; max=40; p=[]; for(a=b.cou-max;a<b.cou;a++){ if(a<0)continue; if(a>175)continue; c=a/200; c*=c*50; d=Math.sin(a/max*7+r+b.ban+count/13*g)*7*kn; e=300/(a+300); e*=e; e=a*e*2; x=b.x+b.px*e*sk+b.py*d; y=b.y+b.py*e*sk+c-b.px*d; p.push([x,y]); } if(p.length<2)return; if(b.cou>20 && !b.kr && Math.random()<0.1){ if(b.x>-5 && b.y>-5 && b.x<canvas.width+5 && b.y<canvas.height+5){ if(Math.random()<0.3)b.kr=1; c={}; c.x=p[p.length-1][0]; c.y=p[p.length-1][1]; c.cou=0; c.col=b.col; c.py=0.2+Math.random()*0.6; kira.push(c); } } g=1; if(b.ban%3==1)g=-1; len=p.length; p1=[]; for(a=0;a<len-1;a++){ b=p[a]; c=p[a+1]; x=b[0]-c[0]; y=b[1]-c[1]; b=Math.atan2(-y,x)+Math.PI/2; x=Math.cos(b); y=Math.sin(b); e=Math.sin(a/11+r)+Math.sin(a/13+count/17*g-r); e*=10*kn; e*=0.5-Math.cos(a/(len-2)*Math.PI*2)/2; p1.push([p[a][0]+x*e,p[a][1]+y*e]); } len=p1.length; p2=[]; for(a=0;a<len-1;a++){ b=p1[a]; c=p1[a+1]; x=b[0]-c[0]; y=b[1]-c[1]; b=Math.atan2(-y,x)+Math.PI/2; x=Math.cos(b); y=Math.sin(b); e=0.5-Math.cos(a/(len-2)*Math.PI*2)/2; p2.push([x*e,y*e]); } for(e=0;e<3;e++){ ctx.fillStyle="hsla("+col+",80%,"+(20+e*30)+"%,"+lit+")"; f=(3-e)*ob.ft; ctx.beginPath(); for(a=0;a<len-1;a++){ b=p1[a]; c=p2[a]; ctx.lineTo(b[0]+c[0]*f,b[1]-c[1]*f); } for(a=len-2;a>=0;a--){ b=p1[a]; c=p2[a]; ctx.lineTo(b[0]-c[0]*f,b[1]+c[1]*f); } ctx.fill(); } } function kao(x,y,s,px,py,lit){ if(lit===undefined)lit=1; ctx.lineWidth=s*2; ctx.strokeStyle="rgba(100,55,11,"+lit+")"; ctx.fillStyle="hsla(44,80%,"+(50)+"%,"+lit+")"; ctx.beginPath(); ctx.arc(x,y,30*s,0,Math.PI*2,0); ctx.fill(); ctx.stroke(); x+=px*s; y+=py*s; ctx.fillStyle="rgb(0,0,0)"; ctx.beginPath(); ctx.arc(x-10*s,y-2*s,4*s,0,Math.PI*2,0); ctx.fill(); ctx.beginPath(); ctx.arc(x+10*s,y-2*s,4*s,0,Math.PI*2,0); ctx.fill(); y+=15*s; ctx.fillStyle="rgba(100,55,11,"+lit+")"; ctx.beginPath(); ctx.lineTo(x-15*s,y); ctx.lineTo(x,y+9*s); ctx.lineTo(x+15*s,y); ctx.lineTo(x,y-9*s); ctx.fill(); s*=0.8; ctx.fillStyle="hsla(44,70%,60%,"+lit+")"; ctx.beginPath(); ctx.lineTo(x-15*s,y); ctx.lineTo(x,y+9*s); ctx.lineTo(x+15*s,y); ctx.lineTo(x,y-9*s); ctx.fill(); ctx.beginPath(); ctx.lineTo(x-14.9*s,y); ctx.lineTo(x+14.9*s,y); ctx.stroke(); } function psyoku(x,y,ban){ if(Math.random()<0.8){ setsyoku((30+Math.random()*20)|0,x,y,ban); }else if(Math.random()<0.8){ setsyoku((20+Math.random()*10)|0,x,y,ban); setsyoku((15+Math.random()*5)|0,x,y,ban); setsyoku((10+Math.random()*5)|0,x,y,ban); }else{ for(var a=0;a<10;a++)setsyoku(5,x,y,ban); } } function main(){ var a,b,c; ctx.globalCompositeOperation = "source-over"; ctx.fillStyle="rgba(0,0,0,0.025)"; ctx.fillRect(0,0,canvas.width,canvas.height); if(count%80===0)settama(1); for(a=0;a<tama.length;a++){ b=tama[a]; b.x+=b.rx; b.y+=b.ry; b.ry+=0.02; kao(b.x,b.y,0.2,b.rx*5,b.ry*5); b.cou--; if(b.cou===0){ psyoku(b.x,b.y,b.ban); tama[a]=tama[tama.length-1]; tama.pop(); a--; continue; } } for(a=0;a<syoku.length;a++){ b=syoku[a]; kune(b); b.cou+=1; if(b.cou>=200){ syoku[a]=syoku[syoku.length-1]; syoku.pop(); a--; continue; } } ctx.globalCompositeOperation = "source-over"; for(a=0;a<pika.length;a++){ b=pika[a]; kao(b.x,b.y,0.5+b.cou/90,0,0); b.cou++; if(b.cou>45){ pika[a]=pika[pika.length-1]; pika.pop(); a--; continue; } } ctx.globalCompositeOperation = "lighter"; for(a=0;a<kira.length;a++){ b=kira[a]; ctx.fillStyle="hsla("+b.col+",70%,50%,"+(Math.random()/2)+")"; ctx.beginPath(); ctx.arc(b.x,b.y,4,0,Math.PI*2,0); ctx.fill(); ctx.beginPath(); ctx.arc(b.x,b.y,1,0,Math.PI*2,0); ctx.fill(); b.y+=b.py; b.cou++; if(b.cou>70){ kira[a]=kira[kira.length-1]; kira.pop(); a--; continue; } } count++; requestAnimationFrame(main); }<canvas></canvas>

	Smartphone Controllerjsdo.it WebSocket Controller»
	Mouse
	Keyboard
	Touch Device

鳥触手花火

Description What kind of game?

Control Device

Fullscreen

Author

Default Panel

Size

code

Discussion

Tags

Favorite by