fabricjs是一個canvas的庫，底本canvas的操縱重要基於上下文，須要運用者本身從0最先去完成一些基本功能。而canvas庫文件封裝好了很多方便的對象，這些canvas庫使得用戶能夠在比較高等的層面上舉行繪製。fabricjs就是其中之一。

上手發起：官方api寫得比較簡約，發起先看看官方
疾速教程，也能夠參考這部
中文教程

運用fabricjs的新手套路：

1. 建立fabric的canvas對象。
2. 建立fabric的種種對象，包含：rect，circle，line，image等。
3. 將建立好的對象添加到canvas。
4. 能夠對每個fabric對象運用動畫，克隆，修正屬性，事宜監聽，碰撞檢測等。修正屬性需實時襯着canvas才展示出結果。   

fabricjs運用注重要點：

1. 每次修正對象的參數后須要實行canvas.renderAll()從新襯着，不然不會出結果。
2. fabric對象用acoords參數（bl，br，tl，tr）【大概是topleft，bottomright的意義】表達本身地點canvas中的位置。 每次更改了對象的位置，大小時（比方left，width），若要canvas感知該對象的具體位置（用於對象間碰撞邊沿檢測，或事宜響應），須要運用setCoords要領重設對象的四個角坐標。

引見下經常使用的設置參數，這些設置參數可用來設置fabric對象
width寬：number,
height高：number,
fill添補色彩：string,
stroke描邊色彩:string,
strokeWidth描邊寬度：number,
angle角度:number,
left左側距:number,
top上邊距:number,
originX橫軸中心點:[‘center’|’left’|’right],
originY縱軸中心點:[‘center|’top’|’bottom’],
flipX程度翻轉:boolean,
flipY垂直翻轉：boolean,

更多設置參數請參考：fabric.Object，以及其子類

引見下官方響應的demo
事宜
動畫
克隆
邊沿檢測
精靈動畫
分組和作廢分組