How to move a polygon?

Question

JavaScript

Tell me, how to hang up such an event on the "Move" button so that the polygon moves 10 to the left, for example?
codepen.io/SitnikKsl/pen/dMpKbj

Answer 1

var canvas;
var context;
var radius = 200;
var X0 = 250;
var Y0 = 200;

function redraw(){
  context.clearRect(0,0,canvas.width,canvas.height);
 
 context.beginPath();
 context.moveTo(X0 - 50, Y0 - 50);
 context.lineTo(X0 + 50, Y0 - 50);
 context.lineTo(X0 + 85, Y0);
 context.lineTo(X0 + 50, Y0 + 50);
 context.lineTo(X0 - 50, Y0 + 50);
 context.lineTo(X0 - 50, Y0 - 50);
 context.stroke();
  
}

window.onload = function() {
    
  canvas = document.getElementById("drawingCanvas");
       //Получаем наш холст по Id
context = canvas.getContext("2d");   
       //Холст в измерении 2d
       
       context.lineWidth = 3;
       //толщина линий
       context.strokeStyle = "rgb(210,106,68)";
       //цвет линий
       context.lineCap = "round";
       //стиль краев линий
       redraw();
     }

function move(x,y){
  
  X0+=x;
  Y0+=y;
  context.clearRect(0,0,canvas.width,canvas.height);
 redraw();
}

and hang a handler for the move procedure on the button
codepen.io/Ni55aN/pen/MyjXxQ