如何使用image-js和JavaScript实现图像归一化（直方图拉伸）？

完全可以基于image-js的直方图接口实现你需要的灰度色彩归一化（即GIMP的Normalize/直方图拉伸效果），具体方案如下：

你需要的归一化本质是线性直方图拉伸：先统计当前图像所有像素的有效灰度范围，再把这个范围的最小值映射到0（纯黑）、最大值映射到255（纯白），中间灰度值按比例线性换算，不会改变原有灰度分布的相对关系，完全符合你提到的GIMP工具的效果。

• 调用image-js内置的getHistogram()方法，获取灰度图的像素分布统计结果
• 遍历直方图定位有效灰度边界：从0开始找第一个有像素分布的灰度值作为minGray，从255倒序找最后一个有像素分布的灰度值作为maxGray
• 如果minGray已经为0且maxGray已经为255，说明图像本身就是归一化状态，无需处理
• 遍历所有像素做线性映射，替换原灰度值即可

import { Image } from 'image-js';

// 加载你的灰度高度图
const heightMap = await Image.load('your-heightmap-path.png');

// 校验是否为单通道灰度图
if (heightMap.channels !== 1) {
  throw new Error('仅支持处理单通道灰度高度图');
}

// 获取直方图，数组索引对应灰度值，数组值对应该灰度的像素数量
const histogram = heightMap.getHistogram();

// 计算最小有效灰度
let minGray = 0;
while (minGray < 256 && histogram[minGray] === 0) {
  minGray++;
}

// 计算最大有效灰度
let maxGray = 255;
while (maxGray >= 0 && histogram[maxGray] === 0) {
  maxGray--;
}

// 异常/无需处理的边界情况
if (minGray >= maxGray || (minGray === 0 && maxGray === 255)) {
  console.log('当前图像无需归一化处理');
} else {
  const grayRange = maxGray - minGray;
  // 遍历所有像素做拉伸转换
  for (let i = 0; i < heightMap.data.length; i++) {
    const originalVal = heightMap.data[i];
    heightMap.data[i] = Math.round(255 * (originalVal - minGray) / grayRange);
  }
}

// 导出处理后的高度图
await heightMap.save('normalized-heightmap.png');

如果你的高度图存在少量噪点，可以在计算minGray和maxGray时增加阈值过滤：比如跳过前后累计占比0.1%的像素，避免极端噪点拉偏整体拉伸效果，和GIMP归一化的可选参数效果一致。

内容的提问来源于stack exchange，提问作者dan