Revision history [back]

To create a canvas shape using two points, an angle, and a distance, you can use the following steps:

1. Calculate the x and y coordinates of the second point using the angle and distance.

x2 = x1 + distance * cos(angle) y2 = y1 + distance * sin(angle)

1. Create a path using the two points.

context.beginPath(); context.moveTo(x1, y1); context.lineTo(x2, y2);

1. Close the path if necessary.

context.closePath();

1. Fill or stroke the path as desired.

context.fill(); or context.stroke();