Стереть инструмент мольберт js рисунок - PullRequest
0 голосов
/ 19 апреля 2020

У меня есть большая проблема, которая может быть не такой сложной, как мне кажется, я просто не могу заставить ластик работать на мольберте. js холст с использованием «кеша» и «места назначения вывода». Я поделился образцом, спасибо. для помощи. Я добавляю код, который использую для рисования на холсте, у меня не получается, что ластик - это цвет, поскольку у меня есть изображение под этим холстом.

пример здесь

var stage = new createjs.Stage("canvas");
var isMouseDown;
var currentShape;
var oldMidX, oldMidY, oldX, oldY;
var ctx;

//valores
colorPen = "#000000";
stroke = 10;
brush = "round";
type = "pen";


function initDraw() {

 stage.autoClear = true;
 stage.addEventListener("stagemousedown", handleMouseDown);
 stage.addEventListener("stagemouseup", handleMouseUp);            
 createjs.Touch.enable(stage);
 stage.update();
 createjs.Ticker.addEventListener("tick", tick);

 ctx = stage.canvas.getContext('2d');    

}

function tick() {

 if (isMouseDown) {


    var pt = new createjs.Point(stage.mouseX, stage.mouseY);
    var midPoint = new createjs.Point(oldX + pt.x>>1, oldY+pt.y>>1);

    currentShape.graphics.moveTo(midPoint.x, midPoint.y);
    currentShape.graphics.curveTo(oldX, oldY, oldMidX, oldMidY);

  //currentShape.updateCache(erase.checked ? "destination-out" : "source-over");


    oldX = pt.x;
    oldY = pt.y;

    oldMidX = midPoint.x;
    oldMidY = midPoint.y;


    /* only draws currentShape, made drawing fast*/
    currentShape.draw(ctx);        

}


}

function handleMouseDown() {

 isMouseDown = true;

 if (isMouseDown) {

   let p = stage.globalToLocal(stage.mouseX, stage.mouseY);
   s = new createjs.Shape();
   oldX = stage.mouseX;
   oldY = stage.mouseY;
   oldMidX = stage.mouseX;
   oldMidY = stage.mouse;
   var g = s.graphics;
   g.setStrokeStyle(stroke, brush, brush);
   var color = colorPen;
   g.beginStroke(color);
   stage.addChild(s);

   currentShape = s;

}



}

function handleMouseUp() {

  isMouseDown = false;
  stage.update();

 // alert();
}
initDraw();
...