HTML 5 salle de toile pour l'amélioration?

Question

J'ai construit cette image en utilisant la toile html 5,

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

J'espérais si quelqu'un pouvait me donner quelques conseils sur la façon d'extraire la couleur du pixel sur le mouvement de la souris, et si possible comment faire en sorte au lieu d'avoir un spectre horizontal complet, et un blanc vertical à transparent à noir à blanc sur le dessus, peut-être avoir un réglage de la teinte de bas en couleur pour produire les gris? Je n'ai aucune idée de comment je ferais cela?

Merci

Answer 1

Pour mémoire, il est considéré comme une mauvaise forme de demander plus d'une question (complexe) de la même question SO.

Ici, vous allez pour la première partie:

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);