alert("No libraries!"); var pos = [0,0,0]; var rot = [0,0]; var cam = [Math.PI/6,0]; var fov = Math.min(innerWidth,innerHeight)/2; var objrot = [0,0]; var verts = [ ]; var lines = [ ]; var s = 3; var gap = .5; for(var x=-s/2;x<=s/2;x+=gap) { for(var z=-s/2;z<=s/2;z+=gap) { verts.push([x,0,z]); } } for(var j=0;jlines.push([j,j+1,j+s/gap+2,j+s/gap+1,[255,255,255,255]]))(); } var vlen = verts.length; var vflen = lines.length; var flatten = true; "flat" in new Array()&&function() { flatten = true; flat=a=>{ var res = []; for(var i=0;i{ last=now; "ontouchstart" in document&&(()=>{ c.addEventListener("touchmove",e=>{ e.changedTouches&&(()=>e=e.changedTouches[0])(); qrot[1]=(e.clientX-innerWidth/2)/(innerWidth/2)*Math.PI; qrot[0]=(e.clientY-innerHeight/2)/(innerHeight/2)-Math.PI/6; }); })(); !("ontouchstart" in document)&&(()=>{ var click; c.addEventListener("mousedown",()=>{ click=true; }); document.addEventListener("mouseup",()=>{ click=false; }); document.addEventListener("mousemove",e=>{ click&&(()=>{ e.changedTouches&&(()=>e=e.changedTouches[0])(); qrot[1]=(e.clientX-innerWidth/2)/(innerWidth/2)*Math.PI; qrot[0]=(e.clientY-innerHeight/2)/(innerHeight/2)-Math.PI/6; })(); }); })(); })(); var delta=now-last; //-=-// ballcolor=document.getElementsByClassName("color")[0].value; rainbowspeed=document.getElementsByClassName("rainbowslider")[0].value/100; document.getElementsByClassName("rainbowindica")[0].innerHTML=rainbowspeed.toFixed(2); rainbowdiversity=document.getElementsByClassName("rainbowdivslider")[0].value/100; document.getElementsByClassName("rainbowdivindica")[0].innerHTML=rainbowdiversity.toFixed(2); gsize=document.getElementsByClassName("gsizeslider")[0].value/100; document.getElementsByClassName("gsizeindica")[0].innerHTML=gsize.toFixed(2); turns=document.getElementsByClassName("turnsslider")[0].value; document.getElementsByClassName("turnsindica")[0].innerHTML=turns; gheight=document.getElementsByClassName("gheightslider")[0].value; document.getElementsByClassName("gheightindica")[0].innerHTML=gheight; pos=[0,4,1]; objpos=[0,0,0]; document.getElementsByClassName("checkbox")[0].checked&&(()=>{ pos=[0,0,0]; objpos[0]=-document.getElementsByClassName("posxslider")[0].value/100+4; document.getElementsByClassName("posxindica")[0].innerHTML=(-objpos[0]).toFixed(2); objpos[1]=document.getElementsByClassName("posyslider")[0].value/100; document.getElementsByClassName("posyindica")[0].innerHTML=objpos[1].toFixed(2); objpos[2]=document.getElementsByClassName("poszslider")[0].value/100; document.getElementsByClassName("poszindica")[0].innerHTML=objpos[2].toFixed(2); })(); objrot[1]=Date.now()/3000*turnspeed; for(var i=0;i=vflen) obj = rot3d(obj,objrot); var p = conv3d(obj,frot,cam); p&&ctx.lineTo(p[0],p[1]); } var obj = JSON.parse(JSON.stringify(nverts[nlines[i][0]])); if(i>=vflen) obj = rot3d(obj,objrot); var p = conv3d(obj,frot,cam); ctx.lineTo(p[0],p[1]); ctx.stroke(); ctx.closePath(); } for(var i=0;i=vlen&&(()=>{ var frot = JSON.parse(JSON.stringify(rot)); var obj = rot3d(nverts[i],objrot); ctx.fillStyle=ballcolor; var p = conv3d(obj,frot,cam); ctx.fillRect(p[0]-1,p[1]-1,2,2); })(); } ctx.fillStyle="white"; ctx.textAlign="right"; ctx.fillText((1000/delta).toFixed(1)+"FPS",innerWidth,10); last=now; } setInterval(frame);

Double Helix(DNA) in 3D