另一個畫布元素中的FabricJS畫布的小實時預覽

Question

我有一個利用優秀FabricJS庫的圖像板。我試圖建立某種形式的另一個畫布是頁面上的「鑰匙孔」視圖「預覽」中，複製fabricJS帆布的一小部分，並使用context.drawImage()

preview_canvas_context.drawImage(fabric.lowerCanvasEl, x,y, ...) 

第二畫布上顯示它這很好用！我的問題是從複製的圖像重影。我不確定FabricJS在背景中做了些什麼奇特的事情，但是如果我在布料畫布上的圖像或對象背後留有一些空白區域（或者我到達畫布邊緣），則複製的圖像會如圖所示下面的屏幕截圖：

爲什麼會發生這種情況，我能做些什麼來解決這個問題？

Answer 1

在畫布上設置背景圖像或顏色可防止發生此問題。

var canvas = new fabric.Canvas('c', { 
    backgroundColor: 'rgb(255,255,255)' 
}); 

我仍然得到圖像拖尾現象，當我離開的外周長，但預計並通過設置視口對象不能離開邊界可以預防的。