subir - javascript mostrar imagen

Obtener color de píxel de una imagen

Question

Tengo una imagen en un navegador.

Quiero obtener el píxel superior izquierdo del color de la imagen (en coordenadas: 0,0), sin importar si la imagen está girada o no.

¿Cómo puedo hacer eso, usando código javascript o php?

Answer 1

Para una imagen en un navegador, no puede usar PHP a menos que primero pueda transferir la imagen a un servidor.

En el navegador, si puede dibujar la imagen en un canvas , puede usar el método getImageData() :

var myImg = new Image();
myImg.src = ''image.jpg'';
var context = document.getElementById(''canvas'').getContext(''2d'');
context.drawImage(myImg, 0, 0);
var data = context.getImageData(x, y, 1, 1).data;

Tendrías que permitir cualquier rotación, es de suponer que sabes qué rotación se ha aplicado.

Answer 2

• Crear un documento de lienzo.createElemento
• Obtenga el contexto 2.o canvas.getContext(''2d'')
• Dibuja la imagen en el lienzo context.drawImage(image, x, y)
  • Asegúrate de que la imagen sea del mismo dominio o no tendrás acceso a sus píxeles
• Obtenga los datos de píxeles de la imagen context.getImageData(x1, y1, x2, y2)
  • Quieres solo la parte superior izquierda para context.getImageData(0, 0, 1, 1)
• El resultado de getImageData tendrá una matriz de píxeles en su campo de data (context.getImageData(0,0,1,1).data )
  • La matriz tendrá valores r , g , b y a .