看板 Ajax 關於我們 聯絡資訊
var c = document.getElementById("myCanvas2"); var ctx = c.getContext("2d"); ctx.drawImage(img, 0, 0, c.width, c.height); var imgData = ctx.getImageData(0, 0, c.width, c.height); //alert(img.width); //alert(img.height); //alert(c.width); //alert(c.height); //alert(img.width*img.height*4); //alert(imgData.data.length); // invert colors var i; for (j = 0; j < img.height; j += 1) { var m_i = 0; for (i = 0; i < img.width; i += 1) { if (((imgData.data[(j * img.width + i) * 4] + imgData.data[(j * img.width + i) * 4 + 1] + imgData.data[(j * img.width + i) * 4 + 2]) / 3) > 20) { imgData.data[(j * img.width + i) * 4] = 255; imgData.data[(j * img.width + i) * 4 + 1] = 255; imgData.data[(j * img.width + i) * 4 + 2] = 255; } else { imgData.data[(j * img.width + i) * 4] = 0; imgData.data[(j * img.width + i) * 4 + 1] = 0; imgData.data[(j * img.width + i) * 4 + 2] = 0; m_i = m_i + 1; } imgData.data[(j * img.width + i) * 4 + 3] = 255; } //alert(m_i); if (m_i < 60) { j = j - 1; for (i = 0; i < img.width; i += 1) { imgData.data[(j * img.width + i) * 4] = 255; imgData.data[(j * img.width + i) * 4 + 1] = 0; imgData.data[(j * img.width + i) * 4 + 2] = 0; imgData.data[(j * img.width + i) * 4 + 3] = 255; } j = j + 1; } } ctx.putImageData(imgData, 0, 0); 這串程式碼他會顯示如圖一的圖 圖一:http://imgur.com/6Bfj5QB 請問該如何修改程式碼使他顯示如圖二這樣的圖 圖二:http://imgur.com/syFEIuy -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 61.223.199.120 ※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1444758441.A.DDB.html
mmis1000: https://goo.gl/yKqvJf 拜託不要直接貼code上來阿... 10/14 10:38
shadowjohn: 按 run 應該可以看到 XD 10/15 00:02