2017-07-04 11 views
0

我想使用下面的jsPDF將剪輯區域內部的行設置爲剪切區域。如何在jsPDF中使用剪輯方法?

enter image description here

因此,我調用的方法類似自爆。 我在調用.lines()之後調用.clip(),樣式參數爲null,如下所示。

var doc = new jsPDF(); 
doc.lines([[50, 0], [0, 50], [-50, 0], [0, -50]], 20, 20, [1.0, 1.0], null, true); // horizontal line 
doc.clip(); 
doc.rect(50, 50, 100, 100, 'F'); 

我成功剪線!

但我不能使剪輯區域超過一個。

enter image description here

回答

1

他們實際上最近修正了這個人,但顯然不想打破現有的API,因此它們的名稱爲clip_fixed增加了一個新方法:
https://github.com/MrRio/jsPDF/commit/e32f0a2b222a940b0f228457371a118fc138ec28#diff-8162ee9f6251a2016741ffe67239c3c4

一旦你畫的是你使用樣式對象爲null的剪輯路徑,並調用doc.clip_fixed(),隨後繪製的所有形狀都將剪切到當前剪輯路徑。

如果事後你永遠需要繪製另一個形狀沒有應用的裁剪,你就會意識到,有沒有像doc.unclip()。因此,稍後繪製未剪切形狀的最佳選擇是首先在繪製剪輯路徑之前將當前狀態保存到圖形狀態堆棧,然後在完成繪製最後剪切形狀時,從堆棧中恢復以前的狀態。不幸的是,這個堆棧的API還沒有通過jsPDF公開,但是您可以通過doc.internal.write()訪問jsPDF的內部命令隊列來插入任何不由jsPDF處理的PDF命令。

所以創建一個可逆式裁剪你做:

doc.internal.write('q'); // saves the currrent state 
// any draw command with a style value of null 
doc.clip_fixed(); 
// any number of draw commands with strokes, fills, or null for compound paths 
doc.internal.write('Q'); // restores the state to where there was no clipping 

進一步閱讀剪報:
http://www.verypdf.com/document/pdf-format-reference/pg_0234.htm