Как заставить HTML холст отменить и повторить функцию? - PullRequest
0 голосов
/ 23 мая 2018

Прежде всего, извините за мой плохой английский.У меня проблемы с выполнением функций восстановления и отмены в моем приложении. Я уже читал другие вопросы и ответы, но не смог применить к своему проекту.Недавний ответ, которому я пытался следовать: этот один.

мой HTML-код

<th><img src="images/undo.png" onclick="undoLastPoint()"></th>
<th><img src="images/redo.png" onclick="()"></th>

мой код JavaScript

var canvas = document.getElementById('mycanvas');
var ctx = canvas.getContext('2d');
var isDrawing=false;

function pencil () {

canvas.onmousedown = function(e) {
    var pos = getMousePos(canvas, e);
    isDrawing = true;
    ctx.moveTo(pos.x, pos.y);

};
canvas.onmousemove = function(e) {
    var pos = getMousePos(canvas, e);
    if (isDrawing) {
        ctx.lineTo(pos.x, pos.y);
      ctx.stroke();

    }
};
canvas.onmouseup = function() {
    isDrawing = false;
};
}

function undoLastPoint() {

// remove the last drawn point from the drawing array
var lastPoint=points.pop();

// add the "undone" point to a separate redo array
redoStack.unshift(lastPoint);

// redraw all the remaining points
redrawAll();
}

function getMousePos(canvas, evt) {
  var rect = canvas.getBoundingClientRect();
  return {
x: evt.clientX - rect.left,
y: evt.clientY - rect.top
  };
}
...