Non sono affatto esperto in Computer Grafica e ho bisogno di creare un selettore di colori come strumento javascript da incorporare in una pagina HTML.Creare un selettore colori, simile a Photoshop, utilizzando Javascript e HTML Canvas
Per prima cosa, guardando quello di Photoshop, ho pensato alla tavolozza RGB come a una matrice tridimensionale. Il mio primo tentativo envolved:
<script type="text/javascript">
var rgCanvas = document.createElement('canvas');
rgCanvas.width = 256;
rgCanvas.height = 256;
rgCanvas.style.border = '3px solid black';
for (g = 0; g < 256; g++){
for (r = 0; r < 256; r++){
var context = rgCanvas.getContext('2d');
context.beginPath();
context.moveTo(r,g);
context.strokeStyle = 'rgb(' + r + ', ' + g + ', 0)';
context.lineTo(r+1,g+1);
context.stroke();
context.closePath();
}
}
var bCanvas = document.createElement('canvas');
bCanvas.width = 20;
bCanvas.height = 256;
bCanvas.style.border = '3px solid black';
for (b = 0; b < 256; b++){
var context = bCanvas.getContext('2d');
context.beginPath();
context.moveTo(0,b);
context.strokeStyle = 'rgb(' + 0 + ', ' + 0 + ', ' + b + ')';
context.lineTo(20, b);
context.stroke();
context.closePath();
}
document.body.appendChild(rgCanvas);
document.body.appendChild(bCanvas);
</script>
questo si traduce in qualcosa di simile
Il mio pensiero è questo è troppo lineare, confronto con quelli che vedo in Photoshop e sul web. Vorrei conoscere la logica dietro la mappatura dei colori in un selettore come questo:
non ho davvero bisogno gli algoritmi si, sto principalmente cercando di capire la logica.
Grazie
grazie, ma sto provando a crearne uno da zero per due motivi: per il divertimento e usando solo la tela, indipendente da imgs –
"per il gusto di farlo" la parte vale sicuramente la pena! :) Probabilmente lo farò anche io. Saluti. – techfoobar