Построение графика в Canvas

var can = document.getElementById('myCan');
var ctx = can.getContext('2d');
ctx.rotate(270/180*Math.PI);
ctx.translate(-520, 0);
var step = 20;//шаг решотки
//рисуем
function func(x) {
    return(Math.pow(Math.tan(x/180*Math.PI),2));
}
function drawgrid(){
    for (var i = step; i<can.width; i+=step){//рисуем вертикальные
        ctx.beginPath();
        ctx.strokeStyle = '#eee';
        ctx.lineWidth = 1;
        ctx.moveTo(i, 0);
        ctx.lineTo(i, can.height);
        ctx.closePath();
        ctx.stroke();
}
    for (var i = step; i<can.height; i+=step){//рисуем Горизонтальные
        ctx.beginPath();
        ctx.moveTo(0, i);
        ctx.lineTo(can.width, i);
        ctx.closePath();
        ctx.stroke();
    }
 
}
  //стираем
  function clearGrid(){
    ctx.clearRect(0, 0, can.width, can.height);
  }
  function drawAxle(){
    // Рисуем ось X красным цветом
    ctx.beginPath();
    ctx.moveTo(0, can.height/2);
    ctx.lineTo(can.width, can.height/2);
    ctx.strokeStyle = 'red';
    ctx.lineWidth = 3;
    ctx.closePath();
    ctx.stroke();
     
    // Рисуем ось Y зелёным цветом
    ctx.beginPath();
    ctx.moveTo(can.width/2, 0);
    ctx.lineTo(can.width/2, can.height);
    ctx.strokeStyle = 'green';
    ctx.closePath();
    ctx.stroke();
  }
function drawGraph(){
const pi = 3.14159 * 25;
//alert(canvas.width/10);
var i, cx, cy;
  ctx.beginPath();
  ctx.strokeStyle = "blue";
  cx = can.width / 2;
  cy = can.height / 2;
  ctx.moveTo(cx, cy);
  for(i = 0; i<180*10; i+=5) {
    x = i/5;
    y = Math.pow(Math.tan(x/180*Math.PI),2);
    ctx.lineTo(cx+x, cy+y);
  }
  ctx.lineWidth = 1;
  ctx.closePath();
  ctx.stroke();
}
 
  //мыша
  can.addEventListener('mousemove', function(evt){
    document.getElementById('x').innerHTML = evt.pageX;
    document.getElementById('y').innerHTML = evt.pageY;
  });