js+bmp+获取rgb

<input type="file" id="bmpFile" accept="image/bmp" />
<canvas id="canvas"></canvas>

document.getElementById('bmpFile').addEventListener('change', function(event) {
    const file = event.target.files[0];
    if (file) {
        const reader = new FileReader();
        reader.onload = function(e) {
            const img = new Image();
            img.onload = function() {
                const canvas = document.getElementById('canvas');
                const ctx = canvas.getContext('2d');
                canvas.width = img.width;
                canvas.height = img.height;
                ctx.drawImage(img, 0, 0);
                const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
                const data = imageData.data;

                // 遍历像素数据并获取 RGB 值
                for (let i = 0; i < data.length; i += 4) {
                    const red = data[i];
                    const green = data[i + 1];
                    const blue = data[i + 2];
                    console.log(`RGB: (${red}, ${green}, ${blue})`);
                }
            };
            img.src = e.target.result;
        };
        reader.readAsDataURL(file);
    }
});