canvas製作滑鼠拖曳繪製圖形

使用canvas 實作了用滑鼠拖曳繪製各種圖形

其中包含矩形，圓形，箭頭，畫筆

使用方法

var paint = Ypaint(canvas)

繪製圓形：

paint.chooseCircle()

圓形其他參數

圓形的粗細paint.outerParams. circle.lineWidth
圓形的顏色paint.outerParams.circle.color

#繪製長方形：

##paint.chooseRect()

#矩形其他參數

矩形的粗細paint.outerParams.rect.lineWidth

矩形的圓角paint.outerParams.rect.radius
矩形的顏色paint.outerParams.rect.color

#繪製箭頭：

paint.chooseArrow()

#箭頭其他參數

箭頭的粗細paint.outerParams.arrow.range

箭頭的大小paint.outerParams.arrow.color

畫筆工具：

#paint.chooseCircle()

畫筆工具其他參數

畫筆的粗細paint.outerParams.line.lineWidth

畫筆的顏色paint.outerParams.line.color

demo實例截圖：

#後續有時間會加入的功能：撤銷、回撤、插入圖片、圖片在canvas內的拖曳等等有需求的可以提一提

在這裡因為程式碼比較長，只提供壓縮版本的程式碼，需要完整專案及demo的朋友可以去我的github上下載 

以上是canvas製作滑鼠拖曳繪製圖形的詳細內容。更多資訊請關注PHP中文網其他相關文章！