Test html canvas

HTML

<script src="https://cdn.pixabay.com/photo/2012/04/24/23/18/circle-41073_1280.png"></script>
<!DOCTYPE html>
<html lang="de">
    <head>
        <title>Test html canvas</title>
    </head>
    <body>
        <canvas id="cumulatedView" width="250" height="250"></canvas>
    </body>
</html>

CSS

canvas{
  background-color: grey;
  background-position: center;
  background-size: 100% 100%;
}

JavaScript

var angle = 90;	// Degree

var c = document.getElementById("cumulatedView");
var ctx = c.getContext("2d");
x1 = 125;
y1 = 125;
length =  100;

x2 = x1 + Math.cos((Math.PI / 180.0) * angle - 90) * length
y2 = y1 + Math.sin((Math.PI / 180.0) * angle - 90) * length

ctx.moveTo(x1, y1);
ctx.lineTo(x2, y2);
ctx.stroke();