如何在draw2d-js中創建連接時滾動我的畫布？

Question

我有兩個數字，一個在畫布的可見區域，一個在外面（在右邊）。由於我無法達到其他數字，因此無法建立連接。是否可以自動滾動，在創建連接時向右移動，以便連接到該數字？

Answer 1

不幸的是，你將不得不自己處理滾動。嘗試這樣的事情

var canvas = new draw2d.Canvas("canvas_id"); 
var scrollElement = canvas.getScrollArea(); 
var viewArea = new draw2d.geo.Rectangle(
          scrollElement.scrollLeft(), scrollElement.scrollTop(), 
          scrollElement.width() * canvas.zoomFactor, scrollElement.height() * canvas.zoomFactor); 

var outputLocator = new draw2d.layout.locator.OutputPortLocator(); 
var port = figure.createPort("output", outputLocator); 

port.on('drag', function(){ 

    if (!viewArea.contains(port.getBoundingBox())) { 
    // -- the port has moved off the visible area of the canvas so scroll the view. 
    } 
}) 

Answer 2

帆布政策：

var myScroll = draw2d.policy.canvas.CanvasPolicy.extend ({ NAME: 'myScroll', 
       init: function() { 
       this._super(); 
       }, 


onMouseMove: function(the, mouseX, mouseY, shiftKey, ctrlKey) { 

     this._super(the, mouseX, mouseY, shiftKey, ctrlKey); 

     if (mouseX>the.getWidth()-100+the.getScrollLeft()) { 

      $buffer = $("#canvas").scrollLeft(); 
      $treshold = 10; 
      $("#canvas").scrollLeft($buffer+$treshold); 


     } 
}