javascript - 订购抖动到 256 种颜色

Question

我每次都尝试将HTML5 画布中的抖动图像向下或接近 256 色。我有抖动算法工作，您可以在我的测试页面上看到（检查浏览器控制台的颜色计数）。

但是我无法理解如何为不同的图像选择或生成最佳深度和阈值图，结果根据原始图像有多少颜色而有很大差异。

到目前为止，我有 2x2,3x3,4x4,8x8 地图的这些功能之一，

    function ditherImageData4x4(imageDataToDither){
    var depth = $('#depth').val();
    var threshold_map = [
        [  1,  9,  3, 11 ],
        [ 13,  5, 15,  7 ],
        [  4, 12,  2, 10 ],
        [ 16,  8, 14,  6 ]
    ];
    var dataWidth  = imageDataToDither.width;
    var dataHeight = imageDataToDither.height;
    var pixel  = imageDataToDither.data;
    var x, y, a, b;
    for ( x=0; x<dataWidth; x++ ){
        for ( y=0; y<dataHeight; y++ ){
            a    = ( x * dataHeight + y ) * 4;
            b    = threshold_map[ x%4 ][ y%4 ];
            pixel[ a + 0 ] = ( (pixel[ a + 0 ]+ b) / depth | 0 ) * depth;
            pixel[ a + 1 ] = ( (pixel[ a + 1 ]+ b) / depth | 0 ) * depth;
            pixel[ a + 2 ] = ( (pixel[ a + 2 ]+ b) / depth | 0 ) * depth;
            //pixel[ a + 3 ] = ( (pixel[ a + 3 ]+ b) / depth | 3 ) * depth;
        }
    }
    return pixel;
};