html5畫布：按顏色剪輯

有什麼方法可以按顏色選擇畫布上的某個區域並剪輯它？我想能夠剪輯一個未定義的aread，所有像素之間唯一共同之處在於它們都具有相同的顏色。感謝html5畫布：按顏色剪輯

2011-09-08 Amit Hagin

你說的'clip'意思？ – Loktar

下面的方式來選擇一種顏色..和做任何你想用它。我傳遞一個顏色，我想查找遍歷每像素，並刪除匹配的顏色，因爲我不知道你的意思是剪裁我假設你的意思是刪除。但是請注意，在大圖像上這種方法會很慢。

// Takes an array with 3 color components, rgb  
function removeColor(color){ 
    var canvasData = ctx.getImageData(0, 0, 256, 256), 
     pix = canvasData.data; 

    for (var i = 0, n = pix.length; i <n; i += 4) { 
     if(pix[i] === color[0] && pix[i+1] === color[1] && pix[i+2] === color[2]){ 
      pix[i+3] = 0; 
     } 
    } 

    ctx.putImageData(canvasData, 0, 0); 
} 

removeColor([0,0,255]); // Removes blue.

而像西蒙指出，上面的代碼將得到確切顏色。以下將抓取近似的顏色，如果您的顏色重疊或彼此非常接近，則這很好。

Demo 2 with approximation

來源

2011-09-08 13:34:51 Loktar

除非所討論的圖像是像素完美的，否則它可能值得逼近你的條件，即使是大量的：http://jsfiddle.net/CqTEV/9/ –

@SimonSarris是的我認爲這一點，我注意到了由於顏色流失並丟棄了確切的值，因此在我的礦區選擇了邊緣。我把你的js小提琴添加到答案並給你信用。 – Loktar

@SimonSarris偉大的腳本。它工作完美。 :-) 謝謝 –

html5畫布：按顏色剪輯

回答

相關問題