the only thing I can think of now is to save the current canvas to an array every time I finish drawing, and then take it out of the array when I undo it
the only thing I can think of now is to save the current canvas to an array every time I finish drawing, and then take it out of the array when I undo it
this is easy to solve. All the graphics on the drawing board are placed in an array. In other words, each graph is an object with all the information about the graph, including x, y, width, height, etc., and then you can undo it by manipulating the array.
array.pop (); array.forEach (a = > a.draw ());
of course, there is a simpler solution. I recommend a canvas 2d rendering library, https://www.github.com/PengJi..
this is a canvas 2d rendering library with small volume, powerful function, support for drawing, graphics binding time, drag and drop, zoom in and out, etc.
your undo requirement can be easily implemented.
it's too troublesome to save Canva. You can save the information you draw, such as the area you draw.
undo just empty this area.
each operation is stored as a record in the stack (which can be simulated by an array). Each time the user operates a record, it enters the stack, undoes it, and clears the corresponding graphics of the record.
record the behavior and initial position of each operation, and put it in the array