最近在研究html5 canvas的过程中,发现,canvas为前端对图像的处理开辟了一条新的道路,canvas可以做到很多事情,甚至可以做个类似于PhotoShop的东西,曾经本人在一家软件工作就做类似的工作,可以看一下我之前开发的软件:
这个就是canvas实现的类似于Adobe Photoshop,足以见得canvas的强大之处!
本文就是抽出其中一个小的功能点,来简单聊聊canvas强大之处:我们来一步步实现一个简单的智能抠图功能:(具体的代码见我的github:monkeyWangs/Matting)
1.环境准备
本人采用ES6语法作为开发环境,选用webpack作为构建工具,于是乎,我们有了webpack.config.js
/**
* @author monkeyWang
*
*/
/* 引入操作路径模块和webpack */
var path = require(‘path‘);
var webpack = require(‘webpack‘);
module.exports = {
/* 输入文件 */
entry: ‘./src/index.js‘,
output: {
/* 输出目录,