前端小工具函数

获取图片指定像素颜色

const getImgColor = (imgUrl) => {
	return new Promise((resole) => {
		const image = new Image();
		image.src = imgUrl;
		image.onload = function () {
			const canvas = document.createElement("canvas");
			const context = canvas.getContext("2d");
			canvas.width = image.width;
			canvas.height = image.height;
			context.drawImage(image, 0, 0);

			const x = 20; // 指定像素的横坐标
			const y = 20; // 指定像素的纵坐标

			const imageData = context.getImageData(0, 0, canvas.width, canvas.height);
			const pixelData = imageData.data;

			const pixelIndex = (y * canvas.width + x) * 4;
			const red = pixelData[pixelIndex];
			const green = pixelData[pixelIndex + 1];
			const blue = pixelData[pixelIndex + 2];
			const alpha = pixelData[pixelIndex + 3];

			console.log(`像素(${x}, ${y})的颜色为：rgba(${red}, ${green}, ${blue}, ${alpha})`);
			resole(`rgba(${red}, ${green}, ${blue}, ${alpha})`);
		};
	});
};