本文介绍如何利用 sheetjs（xlsx.js）将图像像素逐个映射为 excel 单元格背景色，替代仅写入 rgb 文本的原始方式，实现真正的“彩色 excel 图像”。
本文介绍如何利用 sheetjs（xlsx.js）将图像像素逐个映射为 excel 单元格背景色，替代仅写入 rgb 文本的原始方式，实现真正的“彩色 excel 图像”。
要将图像转换为彩色 Excel 表格，关键在于不向单元格写入文本值，而是为其设置背景填充色（fill）。SheetJS 支持通过单元格对象的 s（style）属性定义样式，其中 fill.fgColor.rgb 可指定十六进制颜色值（格式为 AARRGGBB，Excel 中透明度 AA 通常设为 FF 表示不透明）。
以下是完整、可运行的改造方案：
✅ 核心修改：用样式对象替代纯字符串
原代码中 rowData.push('RGB(...)') 仅写入文本；新逻辑需构造带样式的单元格对象 { v: '', s: style }，其中 v 为空值（避免显示文字干扰配色），s 包含填充样式：
function createExcelWorkbook(imageData, width, height) {
const wb = XLSX.utils.book_new();
const wsData = [];
for (let y = 0; y < height; y++) {
const rowData = [];
for (let x = 0; x < width; x++) {
const pixelIndex = (y * width + x) * 4;
const red = imageData[pixelIndex];
const green = imageData[pixelIndex + 1];
const blue = imageData[pixelIndex + 2];
// 将 RGB 转为 Excel 兼容的 8 位十六进制颜色（FFRRGGBB）
const hexColor = `FF${red.toString(16).padStart(2, '0')}${green.toString(16).padStart(2, '0')}${blue.toString(16).padStart(2, '0')}`;
const style = {
fill: {
fgColor: { rgb: hexColor }
}
};
rowData.push({ v: '', s: style }); // 空值 + 样式 → 纯色单元格
}
wsData.push(rowData);
}
// 创建工作表并添加到工作簿
const ws = XLSX.utils.aoa_to_sheet(wsData);
XLSX.utils.book_append_sheet(wb, ws, 'Image');
// 导出为 .xlsx 文件（需引入 FileSaver.js）
const blob = XLSX.write(wb, { bookType: 'xlsx', type: 'blob' });
saveAs(blob, 'image-as-excel.xlsx');
}⚠️ 注意事项
- 依赖项：确保已引入 SheetJS（xlsx.full.min.js）和 FileSaver.js（用于 saveAs）。
- 颜色精度：toString(16).padStart(2, '0') 确保单字节值（如 10 → '0a'）正确补零，避免颜色失真。
- 性能提示：高分辨率图像（如 1000×1000）将生成百万级单元格，可能触发浏览器内存限制或 Excel 打开缓慢——建议预缩放图像至合理尺寸（如 ≤200×200）。
- 兼容性：该方案生成标准 .xlsx，支持 Excel、WPS、Numbers 等主流表格软件，但部分在线表格工具（如旧版 Google Sheets）可能忽略单元格填充样式。
✅ 验证效果
运行后生成的 Excel 文件中，每个单元格将精确呈现对应像素的 RGB 颜色，形成一幅由单元格阵列构成的“马赛克图像”，真正实现图像→Excel 的视觉还原。
