如何在印度格式的堆积柱状高图中添加逗号？

Question

我正在使用堆积柱形高图。我在列和工具提示中获得的价值很少。现在我想用逗号分隔符以印度格式显示这个值。假设我有一个像 123456789.So 这样的值，我想以 12,34,56,789 格式显示这个值。我怎样才能做到这一点？如果有人有任何想法，请与我分享。

我试过下面的代码。

    Highcharts.setOptions({
        lang: {
            thousandsSep: ','
        }
    });

但是它给出了 123,456,789 格式，我想要类似 12,34,56,789 的格式。印度格式。

我的代码如下：

function draw_charts(amount, interest , year)
    {
        /*Highcharts.setOptions({
            lang: {
                thousandsSep: ','
            }
        });*/
        $('#chart_area').highcharts({
        chart: {
            type: 'column',
            backgroundColor: 'transparent'
        },
        title: {
            text: 'Year wise break-up'
        },
        xAxis: {
            categories: year,
             title: {
                text: 'Year'
            }
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Amount'
            },
            stackLabels: {
                enabled: true,
                style: {
                    fontWeight: 'bold',
                    color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
                }
            }
        },
        legend: {
            align: 'right',
            x: -30,
            verticalAlign: 'top',
            y: -5,
            floating: true,
            backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
            borderColor: '#CCC',
            borderWidth: 1,
            shadow: false
        },
        tooltip: {
            headerFormat: '<b>{point.x}</b><br/>',
            pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}'
        },
        plotOptions: {
            column: {
                stacking: 'normal',
                dataLabels: {
                    enabled: true,
                    color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
                    style: {
                        textShadow: '0 0 3px black'
                    }
                }
            }
        },
        series: [{
            name: 'Interest',
            data: interest, color: '#7fb801'
        },{
            name: 'Principal',
            data: amount, color: '#4fc1e9'
        }],
        exporting: { enabled: false },
        credits: { enabled: false },

    });

    }

Answer 1

您可以稍微修改 numberFormat 函数，从 (from source):

行更改

thousands = strinteger.length > 3 ? strinteger.length % 3 : 0;
// ...
ret += strinteger.substr(thousands).replace(/(\d{3})(?=\d)/g, '' + thousandsSep);

到这些行：

thousands = strinteger.length > 3 ? (strinteger.length - 1) % 2 : 0;
// ...
ret += strinteger.substr(thousands).replace(/(\d{2})(?=\d{3})/g, '' + thousandsSep);

结束这个函数：

Highcharts.numberFormat = function (number, decimals, decimalPoint, thousandsSep) {

    number = +number || 0;
    decimals = +decimals;

    var lang = Highcharts.getOptions().lang,
        origDec = (number.toString().split('.')[1] || '').length,
        decimalComponent,
        strinteger,
        thousands,
        absNumber = Math.abs(number),
        ret;

    if (decimals === -1) {
        decimals = Math.min(origDec, 20); // Preserve decimals. Not huge numbers (#3793).
    } else if (!isNumber(decimals)) {
        decimals = 2;
    }

    // A string containing the positive integer component of the number
    strinteger = String(Highcharts.pInt(absNumber.toFixed(decimals)));

    // Leftover after grouping into thousands. Can be 0, 1 or 3.
    thousands = strinteger.length > 3 ? (strinteger.length - 1) % 2 : 0;

    // Language
    decimalPoint = Highcharts.pick(decimalPoint, lang.decimalPoint);
    thousandsSep = Highcharts.pick(thousandsSep, lang.thousandsSep);

    // Start building the return
    ret = number < 0 ? '-' : '';

    // Add the leftover after grouping into thousands. For example, in the number 42 000 000,
    // this line adds 42.
    ret += thousands ? strinteger.substr(0, thousands) + thousandsSep : '';

    // Add the remaining thousands groups, joined by the thousands separator
    ret += strinteger.substr(thousands).replace(/(\d{2})(?=\d{3})/g, '' + thousandsSep);

    // Add the decimal point and the decimal component
    if (decimals) {
        // Get the decimal component, and add power to avoid rounding errors with float numbers (#4573)
        decimalComponent = Math.abs(absNumber - strinteger + Math.pow(10, -Math.max(decimals, origDec) - 1));
        ret += decimalPoint + decimalComponent.toFixed(decimals).slice(2);
    }

    return ret;
};

我在一些函数调用前添加了 Highcharts 前缀，以使其在没有自定义 js 文件的情况下工作。

查看 this JSFiddle demonstration 的使用情况。

如何在印度格式的堆积柱状高图中添加逗号？

How to add comma in stacked column highchart in indian format?

charts

highcharts

stacked-chart