Paperjs柵格化activeLayer從視圖邊界

我有這fiddle，我想實現畫布視圖的光柵縮略圖。一切正常，直到某些路徑溢出視圖邊界，那些溢出的部分也會導出到縮略圖中，這是不需要的。只有在畫布上可見的部分應該在拇指中可見。我已經嘗試過clipMask，不幸的是沒有成功。Paperjs柵格化activeLayer從視圖邊界

HTML代碼

<canvas id="c"></canvas> 
<img id="thumb" />

paperscript代碼

paper.install(window); 
var canvas = document.getElementById('c'); 
paper.setup(canvas); 

var style = { 
    fillColor : 'black' 
}; 
var objects = new Group(); 
var background = new Path.Rectangle(view.bounds); 
background.fillColor = 'red'; 

var rect = new Path.Rectangle(-10, 20 , 40, 50); 
rect.fillColor = style; 
objects.addChild(rect); 

var rect = new Path.Rectangle(60, -20 , 40, 50); 
rect.fillColor = style; 
objects.addChild(rect); 

var rect = new Path.Rectangle(195, 20 , 40, 50); 
rect.fillColor = style; 
objects.addChild(rect); 

var rect = new Path.Rectangle(60, 195 , 40, 50); 
rect.fillColor = style; 
objects.addChild(rect); 

objects.bringToFront(); 
view.draw(); 

var data = project.activeLayer.rasterize().toDataURL(); 
var img = document.getElementById('thumb'); 
img.src = data;

難道你們有什麼想法，這可怎麼解決呢？

非常感謝您的幫助。

來源

2014-12-08 ma2s

好的，所以我最終找到了答案。需要使用getSubRaster函數來裁剪出我需要的子代。爲了找出有多少像素從頂部或左側溢出，我使用了project.activeLayer.bounds.x和.y，它們是負數，當從視圖溢出時。

如果有人知道更優雅的解決方案，請讓我知道。

這裏是更新的fiddle

來源

2014-12-08 15:34:01 ma2s

Paperjs柵格化activeLayer從視圖邊界

回答

相關問題