分类: canvas

通过视频url，获取缩略图

发布于 2019/06/20 ·分类：canvas

通过视频url，获取缩略图 getVideoImg (url) { let _this = this // 创建视频对象 let video = document.createElement('video') video.src = url video.

“被污染”的 canvas

发布于 2018/04/19 ·分类：canvas

什么是“被污染”的 canvas?尽管不通过 CORS 就可以在画布中使用图片，但是这会污染画布。一旦画布被污染，你就无法读取其数据。例如，你不能再使用画布的 toBlob(), toDataURL() 或 getImageData() 方法，调用它们会抛出安全错误。这种机制可以避免未经许可拉取远程

HTML5 Canvas手机九宫格手势密码解锁 ，支持N*N个点

发布于 2018/03/10 ·分类：canvas

对于canvas不熟悉的可以查看 MDN 上的canvas教程在开始之前，先介绍一个数学知识，怎么判断一个点是否在圆内通过判断一个点到圆心的距离是否大于半径。例如：半径是R  如O(x,y)点圆心，任意一点P（x1,y1） （x-x1）*(x-x1)+(y-y1)*(y-y1)>R*R 那么在

Web动画优化--requestAnimationFrame

发布于 2017/05/03 ·分类：canvas

什么是requestAnimationFramewindow.requestAnimationFrame（callback）方法告诉浏览器您希望执行动画，并请求在下一次重新绘制之前,浏览器调用指定的函数更新。 callback该方法作为参数，在重绘之前调用回调。注意：如果您要在下一次重新绘制时进行别

canvas实现圆形进度条

发布于 2017/04/30 ·分类：canvas