canvas

因为图片的加载是一个异步的过程，因此我们需要借助 promise, 以new ImageCompress(option).then(instance => {})创建并在 then 中调用实例的方法。因为 file 可以是 url 也可以是 file 对象，因此在构建函数中需对…

之前看过一篇写关于图片滤镜的文章，蛮有兴趣，因此作出了这个小 DEMO,可以切换多种图片滤镜并提供图片下载功能。 话不多说，先上 demo 及 github地址. 1. 引入 iview 与 vue 2. 设计整体静态页面 首先页面须有两个 canvas 标签，一个绘制原始图片…

1. 背景 之前公司项目有一个刮奖小游戏的需求，因此有了本文记录该“刮刮乐”游戏的实现过程。 话不多说，先上 Demo 和 项目源码. 2. 实现 我们创建一个 ScrapAward 类，通过传入 option 和调用其 restart() 方法实现重新开始。 首先合并用户的配…

1. 背景 之前写过一篇文章 ES6 手写一个“辨色”小游戏, 感觉好玩挺不错。岂料评论区大神频出，其中有人指出，打开控制台，输入以下代码： 即可破解，分数蹭蹭上涨，这不就是bug吗？同时评论区 【爱编程的李先森】建议，让我用 canvas 来画会更简单，因此有了这篇文章。 有…

最近接触到的需求，前端生成一个带企业logo的二维码，并支持点击下载它。 1. toCanvas() 一种是直接画图 ctx.drawImage(image, logoXY, logoXY, logoWidth, logoWidth);，可拓展性不强。 2. toImage()…

因此，打算写一系列关于 canvas 的文章，探索学习提升自己的同时顺便分享给大家。 二维码的生成需借助第三方库，利用其算法对文本转化成二维码，并用 canvas 绘画出来。利用 canvas.toDataURL('image/png') 获取二维码转 base64 值，再将其…