[js] 使用js实现一个图片剪裁的功能

/** * 裁切图片* @param imgUrl 原始图片路径* @param x,y,width,height 从点[x, y]开始，将宽度width,高度height的区域裁切下来* tips：需要运行于服务器环境下切图片为同域*/
function clipImage(imgUrl, x, y, width, height) {return new Promise((resolve, reject) => {let cvs = document.createElement("canvas");cvs.width = width;cvs.height = height;var ctx = cvs.getContext('2d');let _img = new Image();_img.src = imgUrl;_img.onload = () => {ctx.drawImage(_img, 0 - x, 0 - y);resolve(cvs.toDataURL());}})
}clipImage("./img/loginbg.jpg", 100, 100, 300, 400).then(res => {let __img = document.createElement("img");__img.src = res;document.body.appendChild(__img);
})

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题