对于Canvas的使用，官方还是提供了不少api，但是任然有许多使用的功能官方没有提供，需要我们自己去实现。

1、增，即颜色填充。

对于颜色填充用fill相关的方法可以实现基本的填充，但是如果我们有更多的条件，比如需要将特定区域内的透明区域填充上颜色，fill方法就没办法实现了，我们可以通过imageData入手，根据透明区域的像素alpha值为0这个特性来实现这个方法：

/**
 * @params imageData 输入像素
 * @params x 开始填充的x坐标
 * @params y 开始填充的y坐标
 * @params fillColor 需要填充的颜色
 * @aprams width 填充区域的宽
 * @params height 填充区域的高
 */
function fillColor(imageData,x,y,fillColor,width,height){
    var x = x || 0,
        y = y || 0,
        w = x + w || imageData.width,
        h = y + h || imageData.height;
    if(x<0 || y<0 || w>imageData.width || h>imageData.height){
        throw new Error("error params!");
    }
    for(var j=y;j<h;j++){
        for(var i=x;i<w;i++){
            var index = j * imageData.width + i,
                a = imageData.data[4*index+3];
            if(a == 0){
        		imageData.data[4*index] = fillColor.r;
            	imageData.data[4*index+1] = fillColor.g;
            	imageData.data[4*index+2] = fillColor.b;
            	imageData.data[4*index+3] = 255;
            }
        }
    }
    return imageData;
}

2、删，改即颜色的删除和替换

对于特定区域的图形的清除，我们可以通过clearRect来达到目的，但是对于特定区域内颜色的替换，我们需要另觅他径，同样的我们可以通过像素的操作来实现：

/**
 * @params imageData 输入像素
 * @params x 开始替换的x坐标
 * @params y 开始替换的y坐标
 * @params sourceColor 需要替换的颜色的rgb值，以对象形式传入
 * @aprams w 替换区域的宽
 * @params h 替换区域的高
 * @params replaceColor 需要替换成的颜色，留空则删除原颜色
 */
function replaceColor(imageData,x,y,sourceColor,w,h,replaceColor){
    var x = x || 0,
        y = y || 0,
        w = x + w || imageData.width,
        h = y + h || imageData.height;
    if(x<0 || y<0 || w>imageData.width || h>imageData.height){
        throw new Error("error params!");
    }
    for(var j=y;j<h;j++){
        for(var i=x;i<w;i++){
            var index = j * imageData.width + i,
                r = imageData.data[4*index],
                g = imageData.data[4*index+1],
                b = imageData.data[4*index+2];
            if(r==sourceColor.r && g==sourceColor.g && b==sourceColor.b){
            	if(replaceColor){
            		imageData.data[4*index] = replaceColor.r;
                	imageData.data[4*index+1] = replaceColor.g;
                	imageData.data[4*index+2] = replaceColor.b;
                	imageData.data[4*index+3] = 255;
            	}else{
            		imageData.data[4*index+3] = 0;
            	}
            }
        }
    }
    return imageData;
}