JavaScript读取画布像素的RGB值

{"code":{"html":"\nYour browser does not support the canvas element.\n\n\n
\n\t
\n\t\n
","css":"","js":"var color = document.getElementById(\"color\");\nvar text = document.getElementById(\"text\");\nvar canvas = document.getElementById(\"myCanvas\");\nvar context = canvas.getContext(\"2d\");\nvar destX = 0;\nvar destY = 0;\nvar imageObj = new Image();\nimageObj.onload = function(){\n context.drawImage(imageObj, destX, destY);\n};\nimageObj.src = \"/uploads/users/1/images/1596023567451.jpg\";\n\ncanvas.onmousemove = function(e) {\n // not so sure about these... might need to offset them or so\n var x = e.x;\n var y = e.y;\n\n // set color now\n var canvasColor = context.getImageData(x, y, 1, 1).data; // rgba e [0,255]\n var r = canvasColor[0];\n var g = canvasColor[1];\n var b = canvasColor[2];\n\t\ttext.innerText=\"R=\"+r+\",G=\"+g+ \",b=\"+b;\n color.style.backgroundColor = 'rgb(' + r + ',' + g + ',' + b + ')';\n}"},"options":{"activeKey":"player","hide":{"html":false,"css":false,"js":false},"name":{"html":"HTML","css":"CSS","js":"JavaScript"},"layout":"left","profile":{"html":"","css":"type=\"text/css\"","js":""},"mode":{"html":"htmlmixed","css":"css","js":"javascript"}}}