Get the dominant color of an image using JS

dominant-color.js

function getAverageRGB(img) {
	var block = 10;
	var defaultRgb = {
		r: 0,
		g: 0,
		b: 0
	};
	var canvas = document.createElement('canvas');
	var context = canvas.getContext('2d');
	var data, width, height, length;
	var i  = -4;
	var rgb = {
		r: 0,
		g: 0,
		b: 0
	};
	var count = 0;

	if (!context) {
		console.log('no context');
		return defaultRgb;
	}

	height = canvas.height = img.naturalHeight || img.offsetHeight || img.height;
	width = canvas.width = img.naturalWidth || img.offsetWidth || img.width;

	context.drawImage(img, 0, 0);

	try {
		data = context.getImageData(0, 0, width, height);
	} catch(e) {
		alert('Image on different domain');
		return defaultRgb;
	}

	length = data.data.length;

	while ((i += block * 4) < length) {
		rgb.r += data.data[i];
		rgb.g += data.data[i + 1];
		rgb.b += data.data[i + 2];
		count++;
	}

	rgb.r = ~~(rgb.r / count);
	rgb.g = ~~(rgb.g / count);
	rgb.b = ~~(rgb.b / count);

	return rgb;
}