javascript中的图像缩放和像素数据的HTML5算法会导致粗图像吗？

Question

我正在尝试使用 Cornerstone DICOM 解析器 (https://github.com/cornerstonejs/dicomParser) 来使用 javascript 和 HTML5 画布提取 CT 扫描的像素数据。 我需要能够减少结果像素数据的大小。 使用 hermite-resize 算法： https://github.com/viliusle/Hermite-resize

请参阅我的以下概念证明，其中显示了上腹部的轴向切片： http://castlemountain.dk/dicomParser/index2.html

如您所见，生成了两种类型的压缩图像（图像 2 和图像 3），其中图像 2 明显比图像 3 更粗糙（尤其是在查看肋骨时）。我使用相同的压缩算法，但是当从绘制未压缩的像素数据（图像 1）中获取像素数据时，图像 3 的图像质量更好，我似乎无法弄清楚为什么会这样。 HTML5画布相关？

示例如下：

首先，我提取了 512x512 px CT 图像的 CT 像素数据，随后将其转换为 0-255 灰度值与 CT 窗口/级别（方法 convertToGreylevel）。 然后使用这个灰度像素值数组为 HMLT5 画布生成一个 imageData 对象 (imgData)，这显示为未压缩的图像（图 1）：

ctx.putImageData(imgData,0,0);

下一个函数

pixelData2 = resample_hermite(pixelData[slices], 512, 512, 
Math.round(512/compression2), Math.round(512/compression2));

用于生成压缩的像素数据（256x256 px），用于生成显示的 imageData 对象（图 2）：

ctx.putImageData(imgData2,512,0); 

后来

var imgInput = ctx.getImageData(0, 0, 512, 512);

用于从绘制到画布的第一个 512x512 图像中获取 imageData。 从画布中提取像素数据并用于生成像素数据数组，该数组被压缩：

var outputData = resample_hermite(inputData, 512, 512,Math.round(512/compression2), Math.round(512/compression2));

这个产生的像素数据数组（256x256 像素）用于生成显示的 HMTL5 图像对象（图 3）：

ctx.putImageData(img2, 512, Math.round(512/compression2));

图像 2 肯定比压缩后的图像 3 更粗糙（见白色肋骨）。 谁能指出我为什么会这样？

最好的问候

Answer 1

看起来您使用的是旧的 Hermite-resize lib 版本，您有“0.5”的操作，但原始 lib 没有类似的东西。

修复 resample_hermite 函数后（基本去掉 0.5，但我建议使用 github 上的最新代码），结果会好很多。