How to determine the color of the outermost pixel of an image?

Question

JavaScript

There is an image with an even color along the edge, one-color. How to determine the color, taking from the edge and set the parent to this color in style?

Answer 1

var ctx = document.querySelector('canvas').getContext('2d');
var img = document.querySelector('img');
if (img.complete) drawBackground();
else img.onload = drawBackground;

function drawBackground() {
    ctx.drawImage(img, 0, 0);
    var d = ctx.getImageData(0, 0, 1, 1).data;
    img.parentNode.style.backgroundColor = 'rgb(0, 1, 2)'.replace(/\d/g, function(s) {
        return d[s];
    });
}

JS Bin

Answer 2

Only with Canvas. Here is a thread discussing how it works.