Нашел скрипт который при клике на изображение получает цвет пикселя
<body>
<canvas width="600" height="440" id="canvas_picker"></canvas>
<div id="hex">HEX: <input type="text"></input></div>
<div id="rgb">RGB: <input type="text"></input></div>
<div id="rgb5"style=' margin-left: 333px; position: absolute; margin-top: 325px; width:60px;height:70px; border: 1px solid #000;' > </div>
<script type="text/javascript">
var canvas = document.getElementById('canvas_picker').getContext('2d');
// создание изображения
var img = new Image();
img.src = 'dv.jpg';
// копируем изображение в canvas
$(img).load(function(){
canvas.drawImage(img,0,0);
});
function rgbToHex(R,G,B) {return toHex(R)+toHex(G)+toHex(B)}
function toHex(n) {
n = parseInt(n,10);
if (isNaN(n)) return "00";
n = Math.max(0,Math.min(n,255));
return "0123456789ABCDEF".charAt((n-n%16)/16) + "0123456789ABCDEF".charAt(n%16);
}
$('#canvas_picker').click(function(event){
// получение координат
var x = event.pageX - this.offsetLeft;
var y = event.pageY - this.offsetTop;
// получение цвета пикселя
var img_data = canvas.getImageData(x, y, 1, 1).data;
var R = img_data[0];
var G = img_data[1];
var B = img_data[2]; var rgb = R + ',' + G + ',' + B;
// конвертируем из RGB в HEX
var hex = rgbToHex(R,G,B);
// показываем значения
$('#rgb input').val(rgb);
$('#hex input').val('#' + hex);
$('#rgb5').css('background-color', hex );
});
</script>
</body>
мне нужно получить не цвет пикселя на который будут нажимать, а цвета всех пикселей изображения в виде массива чтобы я мог в дальнейшем работать как изменить код чтобы например выводились значения всех пикселей изображения, а не то на что кликнули?