var RADIUS = 150; //外接円の半径

var ctx;

window.addEventListener("DOMContentLoaded", function(){
  var canvas = document.getElementById("cnv");
  canvas.height = RADIUS * 2;
  canvas.width = RADIUS * 2;

  ctx = canvas.getContext("2d");
  ctx.translate(RADIUS, RADIUS); //原点(0,0)を中心に

  draw(3);
});

function radians(degrees){ return degrees * Math.PI / 180 } //ラジアン
function sin(degrees){ return Math.sin(radians(degrees)) } //サイン
function cos(degrees){ return Math.cos(radians(degrees)) } //コサイン
function tan(degrees){ return Math.tan(radians(degrees)) } //タンジェント

function draw(n){
  // 画面消去
  if(document.getElementById("clear").checked) {
    ctx.clearRect(-RADIUS, -RADIUS, RADIUS*2, RADIUS*2);
  }

  ctx.beginPath();
  for (var i = 0; i < n; i++){
    var deg = 360 / n * i - 90;
    var x = cos(deg) * RADIUS;
    var y = sin(deg) * RADIUS;
    ctx.lineTo(x, y);
  }
  ctx.closePath();
  ctx.stroke();
}