HTML 5帆布室有待改进吗?

时间:2011-10-14 14:52:35

标签: javascript html5 canvas

我使用html 5 canvas

构建了这个图像

http://jsfiddle.net/nvcode/YGD3q/1/

我希望有人可以给我一些关于如何在鼠标移动时提取像素颜色的指示,如果可能的话,如何制作它以使其不是具有完整的水平光谱,然后是垂直白色到透明到黑色在白色的顶部,可能有一个色调设置为全彩色,以产生灰色?我不知道我会怎么做?

谢谢

1 个答案:

答案 0 :(得分:1)

对于记录,在同一个SO问题中询问多个(复杂)问题被认为是不好的形式。

这里是第一部分:

http://jsfiddle.net/YGD3q/4/

elem.addEventListener('mousemove', function(e) {
    var x = e.offsetX; // lame but close enough for now
    var y = e.offsetY;
    var data = context.getImageData(x, y, 1, 1).data;
    // just paint it to the bottom right as an example for now:
    context.fillStyle = 'rgb(' + data[0] + ',' + data[1] + ',' + data[2] + ')';
    context.fillRect(280,280,20,20);    
}, false);