CSS中要想实现元素的翻转效果，比较简单，例如我们希望某一张图片水平镜像翻转，只需要一行CSS就可以了。但是在canvas中，则要麻烦一些，麻烦的并不是无法翻转，而是坐标系的定位……
“Graphic相关”目录存档
小tips: 在canvas上实现元素图片镜像翻转动画效果
2018年03月18日，星期日CSS, SVG和canvas分别实现文本文字纹理叠加效果
2018年02月27日，星期二本文这里所说的叠加，就是混合模式中的叠加，也就是说，本文要实现的效果是，文字本身的颜色和纹理进行叠加，而非直接填充纹理。
CSS, SVG和canvas都能实现类似的效果，我们一个一个来看一下……
解决canvas图片getImageData,toDataURL跨域问题
2018年02月10日，星期六对于跨域的图片，只要能够在网页中正常显示出来，就可以使用canvas的drawImage() API绘制出来。但是如果你想更进一步，通过getImageData()方法获取图片的完整的像素信息，则多半会出错。
那有没有什么办法可以解决这个问题呢？
canvas文本绘制自动换行、字间距、竖排等实现
2018年02月5日，星期一和CSS相比，SVG以及canvas对文字排版的支持很弱。
在CSS中天然支持的文本自动换行，其他letter-sapcing字间距，writing-mode竖排等都是一个CSS属性就可以实现。但是在canvas中，全部都不支持。
但是canvas可以方便把文字转换成图片，有些场合，例如广告生成工具就需要canvas前端图片生成，此时我们该如何处理这些文字排版呢？
小tips: 0学习成本实现HTML元素粘滞融合效果
2017年12月21日，星期四元素粘滞融合效果很酷，看上去很难实现，实际上实现却非常容易，几乎0学习成本，一起来看看究竟吧！
小tip: 了解LinearRGB和sRGB以及使用JS相互转换
2017年12月18日，星期一LinearRGB顾名思义就是线性RGB颜色。
假设白板的光线反射率是100%，黑板的光线反射率是0%。则在线性RGB的世界中，50%灰色就是光线反射率为50%的灰色。
然而，人这种动物，对于真实世界的颜色感受，并不是线性的，而是曲线的……
深入理解SVG feDisplacementMap滤镜及实际应用
2017年12月14日，星期四借助SVG feDisplacementMap滤镜可以实现非常有意思的水波效果。本文深入介绍feDisplacementMap滤镜的作用原理，同时展示其在实际项目中可以大规模实际应用的潜力。
canvas实现iPhoneX炫彩壁纸屏保外加pixi.js流体动效
2017年12月14日，星期四iPhone X手机默认的壁纸是一个非常绚丽多彩的效果，实际上我们使用代码也能实现类似的效果，并且颜色可以定制，甚至我们可以加一些动效，比如说它的颜色像水一样的不断的流动流淌，像云雾一样翻腾。
本文将通过实际案例的方式展示这种效果，同时介绍如何在项目中使用这个效果，以及它实现的原理。希望本文的内容能够对您的学习有所帮助。
用3D LUT滤镜我做了个在线专业电影级别照片调色工具
2017年12月11日，星期一花了周日一整天时间做了个专业电影级别照片调色工具，使用的是3D LUT滤镜。欢迎围观。
canvas实现任意字符图形的打点或连线动画
2017年12月9日，星期六
本文介绍如何借助canvas的getImageData方法实现动态文本字符以及图形图像相关的动效。
多种特效，多种实现方法展示。有JS注释详细为压缩demo，有GIF截屏演示，必要的源代码展示。希望本文的内容能够对您的学习有所帮助。
我的应用
我的应用