2016-05-19 7 views
0

Stoff verwendet wird, kann ich mit diesem Code, um die Bewegung der Objekte innerhalb der Leinwand begrenzen:FabricJs - Begrenzen Sie die Bewegungsfläche eines hinzugefügten Objekts innerhalb eines Master-Objekt

canvas.observe('object:moving', function (e) { 
      debugger; 
      var obj = e.target; 
      obj.opacity = 0.5; 
      if(obj.getHeight() > obj.canvas.height || obj.getWidth() > obj.canvas.width){ 
       obj.setScaleY(obj.originalState.scaleY); 
       obj.setScaleX(obj.originalState.scaleX); 
      } 
      obj.setCoords(); 
      if(obj.getBoundingRect().top - (obj.cornerSize/2) < 0 || 
       obj.getBoundingRect().left - (obj.cornerSize/2) < 0) { 
       obj.top = Math.max(obj.top, obj.top-obj.getBoundingRect().top + (obj.cornerSize/2)); 
       obj.left = Math.max(obj.left, obj.left-obj.getBoundingRect().left + (obj.cornerSize/2)); 
      } 
      if(obj.getBoundingRect().top+obj.getBoundingRect().height + obj.cornerSize > obj.canvas.height || obj.getBoundingRect().left+obj.getBoundingRect().width + obj.cornerSize > obj.canvas.width) { 

       obj.top = Math.min(obj.top, obj.canvas.height-obj.getBoundingRect().height+obj.top-obj.getBoundingRect().top - obj.cornerSize/2); 
       obj.left = Math.min(obj.left, obj.canvas.width-obj.getBoundingRect().width+obj.left-obj.getBoundingRect().left - obj.cornerSize /2); 
      } 
     }); 

was ist, wenn ich die Bewegung begrenzen möchten eines ausgewählten Objekts innerhalb des Bereichs eines Master-Objekts, das ich definiere (ohne Begrenzungsbereich)?

danke im voraus

+0

Hallo Torgia, können wir Geige haben? – Mullainathan

Antwort

0

Versuchen Sie, in Ihrer Skalierungsfunktion zu folgen. Obj verweist auf untergeordnetes Objekt und master verweist auf Ihr übergeordnetes Objekt.

if(obj.getBoundingRect().top < master.top){ //Top boundary 
    obj.top = master.top; 
} 
master.bottom = master.top+master.height; 
if(obj.getBoundingRect().top+obj.getBoundingRect().height > master.top+master.height){ //Bottom boundary 
    obj.top = master.bottom-obj.getHeight(); 
} 
if(obj.getBoundingRect().left < master.left){ //Left boundary 
    obj.left = master.left; 
} 
master.right = master.left+master.width; 
if(obj.getBoundingRect().left+obj.getBoundingRect().width > master.left+master.width){ //Right boundary 
    obj.left = master.right-obj.getWidth();  
}