Question

如果元素不在画布区域中，如何删除元素。我的意思是如果左边的coridnates是负的。

canvas.on({
    'object:moving':


});

Answer 1

你需要像这样制作redraw（）;

 var canvas = document.getElementsByTagName("canvas")[0]; //get the canvas dom object
 var ctx = canvas.getContext("2d"); //get the context
 var c = {  //create an object to draw
   x:0,  //x value
   y:0,  //y value
   r:5 //radius
 }
 var redraw = function(){
   ctx.clearRect(0, 0, canvas.width, canvas.height); //clear canvas
   ctx.beginPath();  //draw the object c
  ctx.arc(c.x, c.y, c.r, 0, Math.PI*2); 
   ctx.closePath();
   ctx.fill();

   requestAnimationFrame(redraw);
 }
 function move(){
   var x = Math.random() // this returns a float between 0.0 and 1.0
   c.x = x * canvas.width;
   c.y = x * canvas.height;
 }
 redraw();

setInterval（move，1000）;

检查JSFIDDLE示例。

Answer 2

可以使用对象属性 isOnScreen https://jsfiddle.net/i_prikot/4dkb2em3/

canvas.on("object:moving", function (e) {
    const { target } = e;
  
  if (target.isOnScreen() === false) {
    canvas.remove(target);
    canvas.discardActiveObject();
  }
});

如何从画布中删除元素

2 个答案: