Nhận màu pixel của Base64 PNG bằng javascript?

Question

Tôi có PNG được mã hóa base64. Tôi cần để có được màu sắc của một điểm ảnh bằng cách sử dụng javascript. Tôi cho rằng tôi sẽ phải chuyển nó trở lại PNG bình thường. Có ai có thể chỉ cho tôi đúng hướng không?

Answer 1

Tạo đối tượng Image với hình ảnh base64 làm nguồn. Sau đó, bạn có thể vẽ hình ảnh vào khung và sử dụng hàm getImageData để lấy dữ liệu pixel.

Dưới đây là ý tưởng cơ bản (Tôi đã không kiểm tra này):

var image = new Image(); 
image.onload = function() { 
    var canvas = document.createElement('canvas'); 
    canvas.width = image.width; 
    canvas.height = image.height; 

    var context = canvas.getContext('2d'); 
    context.drawImage(image, 0, 0); 

    var imageData = context.getImageData(0, 0, canvas.width, canvas.height); 

    // Now you can access pixel data from imageData.data. 
    // It's a one-dimensional array of RGBA values. 
    // Here's an example of how to get a pixel's color at (x,y) 
    var index = (y*imageData.width + x) * 4; 
    var red = imageData.data[index]; 
    var green = imageData.data[index + 1]; 
    var blue = imageData.data[index + 2]; 
    var alpha = imageData.data[index + 3]; 
}; 
image.src = base64EncodedImage;