如何为“编辑”页面制作画布橡皮擦？

Question

我制作了一个编辑表单，但是这个编辑表单还包括画布上的绘图。除了我为画布制作的橡皮擦外，一切都工作正常。如果您在空白画布上绘制图形，则橡皮擦可以完美地工作，但由于这是针对编辑页面，这意味着它已经有一个绘图。我现在的主要问题是，每当我使用橡皮擦时，先前的绘图都会从画布中删除，只留下你制作的新标记。任何人都可以帮我这个吗？

var stage, wrapper, erase=0;

  function init(){

      var stage = new createjs.Stage("canvas");
      createjs.Ticker.addEventListener("tick", stage);
      createjs.Touch.enable(stage);    

      stage.addChild(new createjs.Text("", "40px Arial", "#000000").set({x:200,y:200}));

      // Set up the container. We use it to draw in, and also to get mouse events.
      var wrapper = new createjs.Container();
      wrapper.hitArea = new createjs.Shape(new createjs.Graphics().f("#000").dr(0,0,800,600));
      wrapper.cache(0,0,800,600); // Cache it.
      stage.addChild(wrapper);

      // Create the shape to draw into
      var drawing = new createjs.Shape();
      wrapper.addChild(drawing);

      var lastPoint = new createjs.Point();

      // retrieves image url for previous drawing
      var path = document.getElementById("hidden").value;
      var prevDraw = new createjs.Bitmap(path);
      prevDraw.image.onload = function(){
          prevDraw.x = 0;
          prevDraw.y = 0;
          wrapper.addChild(prevDraw);
          wrapper.updateCache();
          stage.update();
      }


      wrapper.addEventListener("mousedown", function(event){

          // Store the position. We have to do this because we clear the graphics later.
          lastPoint.x = event.stageX;
          lastPoint.y = event.stageY;

          if(document.getElementById('toggle').checked){
              erase = 1;
          }else{
              erase = 0;
          }

          wrapper.addEventListener("pressmove", function(event){
              // Draw a round line from the last position to the current one.
              drawing.graphics.ss(5, "round").s("#ff0000");
              drawing.graphics.mt(lastPoint.x, lastPoint.y);        
              drawing.graphics.lt(event.stageX, event.stageY);

              // Update the last position for next move.
              lastPoint.x = event.stageX;
              lastPoint.y = event.stageY;

              // Draw onto the canvas, and then update the container cache.
              wrapper.updateCache(erase==1?"destination-out":"source-over");
              drawing.graphics.clear();

          });


          // Listen for mousemove
      });


    function clear(){
      stage.removeAllChildren();
      stage.update();
      init2();

    }

    document.getElementById("clear").onclick = function(){
      clear()
    };

    function reset(){
      stage.removeAllChildren();
      stage.update();
      init();

    }

    document.getElementById("reset").onclick = function(){
      reset()
    };

  }