User Tools

Site Tools


programmering:bird-js-code
<HTML>
<TITLE>Bird by Hamid Naderi Yeganeh</TITLE>
<BODY>
<canvas id="canvas" style="border:0px solid #000000;" width="1200" height="600">Your browser does not support the HTML5 canvas tag.</canvas>

<script>

//(3(sin(2πi/2000)^3), -cos(8πi/2000))
//((3/2)(sin(2πi/2000)^3), (-1/2)cos(6πi/2000)).

function func1_x(i) {
    var x=Math.sin(2*Math.PI*i/2000);
    return 3*x*x*x
}

function func1_y(i) {
    return -Math.cos(8*Math.PI*i/2000);
}

function func2_x(i) {
    var x=Math.sin(2*Math.PI*i/2000)
    return (3/2)*x*x*x;
}

function func2_y(i) {
    return (-1/2)*Math.cos(6*Math.PI*i/2000);
}

function draw() {
    if ( typeof draw.k == 'undefined' ) { draw.k = 0; }
    if (draw.k<1000) { requestAnimationFrame(draw); }
    draw.k++;
    ctx.beginPath();
    ctx.moveTo(func1_x(draw.k),func1_y(draw.k));
    ctx.lineTo(func2_x(draw.k),func2_y(draw.k));
    ctx.stroke();
    ctx.beginPath();
    ctx.moveTo(-func1_x(draw.k),func1_y(draw.k));
    ctx.lineTo(-func2_x(draw.k),func2_y(draw.k));
    ctx.stroke();
}


var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
var width=canvas.width;
var height=canvas.height;
ctx.strokeStyle="black";
ctx.rect(0,0,width,height);
ctx.stroke();
ctx.translate(width/2,height/2);
ctx.scale(width/6,height/2);
ctx.lineWidth = 1/(width/6);

draw();

</script>
</BODY>
</HTML>
programmering/bird-js-code.txt · Last modified: 2023/10/21 19:19 by 127.0.0.1

Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki