User Tools

Site Tools


programmering:cirkel1-js-code
<!DOCTYPE html>
<HTML>
<HEAD> <meta charset="utf-8"></HEAD>
<BODY>

<canvas id="screen" style="border:0px solid #000000;" width="600" height="600">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script>

  function rand(n) {
    return Math.floor((Math.random()*n));
  }

  var canvas=document.getElementById("screen");
  var ctx=canvas.getContext("2d");
  var width=canvas.width;
  var height=canvas.height;
  var centerX=width/2;
  var centerY=height/2;
  var radius=width/2;

function draw(size) {
  ctx.beginPath();
  ctx.arc(centerX,centerY,radius,0,Math.PI*2,true);
  ctx.stroke();
  for (var i=0; i<24; i++) {
	  var angle=(2*Math.PI/24)*i;
	  var x=centerX+Math.cos(angle)*(radius-size);
	  var y=centerY+Math.sin(angle)*(radius-size);
          ctx.beginPath();
	  ctx.arc(x,y,size,0,Math.PI*2,true);
	  ctx.stroke();
  }
}

for (var i=2; i<20; i++) {
  draw(radius/i);
}

</script>

</BODY>
</HTML>
programmering/cirkel1-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