今天给大家分享一个不错的Vue构建Canvas画板Vue-SketchPad。

vue-sketchpad 基于 vue.js+fabric.js 构建的web画板。支持画箭头、虚线、圆形、文字、删除、撤销重做及清除画板等功能。

实现功能

• 直线
• 箭头
• 虚线
• 输入文字
• 矩形
• 标准圆形
• 椭圆形
• 等腰三角形
• 删除、移动、复位
• 历史记录

安装使用

# 克隆项目
git clone https://github.com/HWcool/vue-sketchpad.git
# 进入项目
cd vue-sketchpad
# 安装依赖
npm install
# 本地开发
npm run div
# 打包
npm run build

fabric.js 就是针对canvas繁琐的API进行的一系列封装操作，而且现在这个库还在维护中。在github上start高达16.7K+。

# fabric.js 高级画板
https://www.cnblogs.com/vipstone/p/8716419.html

# 官网
http://fabricjs.com/

# github地址
https://github.com/fabricjs/fabric.js

最后附上项目地址，需要的朋友不可错过。

# 仓库地址
https://github.com/HWcool/vue-sketchpad

ok，就介绍到这里。如果能对大家有所帮助的话，记得多支持一下哈~