首页
首页
沸点
课程
直播
活动
竞赛
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
天天修改
掘友等级
前端小飞机
|
起飞
CSS、WEBPACK、VITE、REACT、VUE、小程序、APP、3D
获得徽章 0
动态
文章
专栏
沸点
收藏集
关注
作品
赞
541
文章 539
沸点 2
赞
541
返回
|
搜索文章
赞
文章( 539 )
沸点( 2 )
张鑫旭
前端打杂师 @阅文集团
·
3年前
举报
新文章:“尝试使用JS IntersectionObserver让标题和导航联动” -
www.zhangxinxu.com
折腾了我一个下午和2个晚上。
收起
查看大图
向左旋转
向右旋转
好文推荐
分享
评论
33
Daisy_D
前端
·
5年前
举报
「每天一点点🕐」【HTMLCanvasElement.toBlob() 方法需兼容】
前端通常会利用 Canvas 的图片绘制、裁剪、宽高等比压缩等能力,对图片进行处理,利用 Canvas 的 toDataURL 或 toBlob 方法,进行处理后的输出;且这两种方法可进一步控制图片类型和图片质量。
toDataURL 方法特点:
1、用法:canvas.toDataURL(mimeType, qualityArgument);
2、返回一个 数据URL(data:[<mediatype>][;base64],<data>);
3、数据存储大小比原图片大33.3%(通过Base64编码,原来的3个字节编码后将成为4个字节,即字节增加了33.3%);
4、同步执行;
5、浏览器支持相对较好(见图1);
toBlob 方法特点:
1、用法:canvas.toBlob(callback, mimeType, qualityArgument);
2、返回一个 Blob对象(可以得到图片存储大小 size ,图片类型 type 等属性);
3、异步执行,返回一个回调函数,且 Blob对象 作为唯一参数;
4、
需要对浏览器做兼容(见图2、3)。
展开
收起
查看大图
向左旋转
向右旋转
今天学到了
分享
评论
23
个人成就
文章被点赞
227
文章被阅读
106,335
掘力值
2,606
关注了
30
关注者
38
收藏集
4
关注标签
40
加入于
2016-09-10