0到0,-70由此:
ctx.strokeStyle = "red";
ctx.lineWidth = 2;
ctx.rotate(Math.PI/-10;);
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(0,-70);
ctx.stroke();
我可以通过'PI/-10'旋转它,这是有效的.
如何在使用旋转后获得x,y点数？
我尝试在 html 画布中画一条具有一定角度的线。不幸的是，这条线没有以所需的角度出现。有人可以告诉我我做错了什么吗？
html代码：
<!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) * …