简介

由于工作从传统业务转型到图形图像了，为了熟悉canvas的api和操作做的一个项目，只是拿来练手而已。
项目预览地址
项目源码地址
喜欢的话记得给个star一下。

Canvas实验室 效果图如下：

特别介绍一下绘制矩形的功能，仿照fabric自己做的类似的效果，可以通过鼠标交互进行旋转、缩放、平移的功能。 如图：

生成的梅花树效果

可爱的哆啦a梦，眼球可以跟着鼠标移动

测试电脑性能的效果

用canvas实现一些功能，可以通过配置项进行操作，分为通用类、文本类和图片类如：

通用类：

• 线宽
• 阴影模糊半径
• 阴影X轴偏移量
• 阴影Y轴偏移量
• 缩放
• 旋转
• 不透明度
• 阴影颜色
• 填充颜色
• 边框颜色
• 线的类型

文本类：

• 文本内容
• 字体大小
• 对齐方式
• 基线对齐
• 文本方向

图片类：

• 图片地址
• 切片X
• 切片Y
• 原点坐标X
• 原点坐标Y

实现的功能有：

• 绘制矩形
• 绘制三角形
• 绘制直线
• 绘制圆形
• 绘制文本
• 绘制二次贝塞尔曲线
• 绘制三次贝塞尔曲线
• 绘制图片
• 绘制哆啦A梦