Canvas how to move an object?

5e963c569522e702785587.png
how to move the triangle in the canvas by the values of top left
April 19th 20 at 12:03
2 answers
April 19th 20 at 12:05
Solution
Option 1 using the offset matrix
ctx.save();
 ctx.translate(50,0); // here the coordinates of the offset
ctx.beginPath();
ctx.moveTo(0,100);
 ctx.lineTo(200,100); 
 ctx.lineTo(100,0); 
ctx.closePath();
ctx.fill();
 ctx.restore();

Option 2 using variables offset
var offX = 300;//x
 var offY = 50;//for y
ctx.beginPath();
ctx.moveTo(offX+0,offY+100);
 ctx.lineTo(offX+200,offY+100); 
 ctx.lineTo(offX+100,offY+0); 
ctx.closePath();
 ctx.fill();
April 19th 20 at 12:07
on vskidku to attach to the coordinates of the triangle, positioning coordinates, such as:

pl+x1,pl+x2,pl+x3
pt+y1,pt+y2,pt+y3

Find more questions by tags CanvasJavaScript