PaperJS 줌 및 팬

Question

나는 성공적 그러나이 계정에 원래 scale = 1로 다시 축소 뷰의 위치를 ​​고려하지 않습니다 this example

zoom: function(delta, point){ 
    if (!delta) return; 

    var 
     oldZoom = paper.view.zoom, 
     oldCenter = paper.view.center, 
     viewPos = paper.view.viewToProject(point); 
     newZoom = delta > 0 ? oldZoom * 1.05 : oldZoom/1.05; 

    if (!this.allowedZoom(newZoom)) return; 

    var 
     zoomScale = oldZoom/newZoom, 
     centerAdjust = viewPos.subtract(oldCenter), 
     offset = viewPos.subtract(centerAdjust.multiply(zoomScale)).subtract(oldCenter); 

    paper.view.center = view.center.add(offset); 
}, 

allowedZoom: function(zoom){ 
    zoom = Math.max(zoom, this.settings.minZoom); 
    zoom = Math.min(zoom, this.settings.maxZoom); 

    if (zoom !== paper.view.zoom) 
    { 
     paper.view.zoom = zoom; 
     return zoom; 
    } 
    return null; 
} 

에 따라 줌 기능을 구현했습니다. 내 말은 캔버스 가장자리에 뷰를 고정시키고 싶습니다.

여기 여기에 스크린 샷을

Answer 1

있어 답의 경우이시 다른 사람 실수를 한단다가. 핵심은 단순히보기 경계를 확인한 다음 그에 따라 조정하는 것입니다.

bounds = paper.view.bounds; 

    if (bounds.x < 0) paper.view.center = paper.view.center.subtract(new Point(bounds.x, 0)); 
    if (bounds.y < 0) paper.view.center = paper.view.center.subtract(new Point(0, bounds.y)); 

    bounds = paper.view.bounds; 
    var 
     w = bounds.x + bounds.width, 
     h = bounds.y + bounds.height; 

    if (w > paper.view.viewSize.width) paper.view.center = paper.view.center.subtract(new Point(w - paper.view.viewSize.width, 0)); 
    if (h > paper.view.viewSize.height) paper.view.center = paper.view.center.subtract(new Point(0, h - paper.view.viewSize.height));