Javascript 计算出的直方图不'；I don’看起来不像预期的那样

我试图实现直方图RGB，但我的算法并没有像图形程序中那样生成类似于曲面的效果。例如，此网站上的图像：

我的版本如下：

正如我正确理解的，RGB直方图只是测量每个值在特定通道中出现的频率。因此，我以以下方式实施：

公共流程（layerManager:dl.layerManager）{ var surface=layerManager.GetCurrent（）； var组件=新的Uint8Array（1024）； surface.ForEachPixel（（arr:number[]，i:number）：void=>{ 分量[arr[i]]+=1； 组件[arr[i+1]+256]+=1； 组件[arr[i+2]+512]+=1； 组件[arr[i+3]+768]+=1； }); var histogram=layerManager.GetHistogram（）； 直方图。清除（）； var viewPort=layerManager.getHistorogramViewport（）； viewPort.Clear（）； 这个.DrawColor（直方图，分量，0，新的ut.Color（255，0，0，255））； //直方图.SetBlendMode（ds.BlendMode.Overlay）； //这个.DrawColor（直方图，分量，256，新的ut.Color（0，255，0，255））； //这个.DrawColor（直方图，组件，512，新的ut.Color（0，0，255，255））； } 私有DrawColor（表面：ds.ICanvas，组件：Uint8Array，i:编号，填充样式：ut.Color）{ var点=新的ut点（0，255）； surface.BeginPath（）； surface.FillStyle（FillStyle.R，FillStyle.G，FillStyle.B，FillStyle.A）； 表面.RGBAStrokeStyle（fillStyle.R，fillStyle.G，fillStyle.B，fillStyle.A）； 表面。线宽（1）； 表面。移动到（点）； 对于（变量j=i+256；i

---

我遗漏了什么吗？

您有一个

Uint8Array

数组来保存结果，但最常见的RGB值出现了255次以上。这会导致溢出，最终会看到256模的值的直方图，这对于高值来说实际上是随机的。这就是为什么图的左侧和中间部分（值小于255）是正确的，但较高值的区域到处都是

使用较大的数据类型来存储结果，并在绘制前将其规格化为输出画布的大小