Блог

Я создал гистограмму, используя HighCharts.js . Ниже приведено мое объявление:

 var myChart = Highcharts.chart(id, {
    chart: {
        type: 'column'
    },
    title: {
        text: ''
    },       
    xAxis: {
        categories: x,
        crosshair: true
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Amount (Php)'
        }
    },
    tooltip: {
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
        pointFormat:'<tr>'  
                        '<td style="color:{series.color};padding:0">{series.name}: </td>'  
                        '<td style="padding:0"><b>{point.y}</b></td>'  
                    '</tr>',                        
        footerFormat:'</table>',
        shared: true,
        useHTML: true
    },
    plotOptions:{
        column:{
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: data        
}); 
  

Смотрите изображение ниже:

Я хочу, чтобы формат значения точки во всплывающей подсказке был таким:

 Apr
Collections: 7,903,113.53
Disbursements: 218,257,774.81
  

Я попытался изменить атрибут pointFormat в моем объявлении на приведенный ниже код:

  pointFormat:'<tr>'  
                        '<td style="color:{series.color};padding:0">{series.name}: </td>'  
                        '<td style="padding:0"><b>{point.y.formatMoney(2, ".", ",")}</b></td>'  
                    '</tr>',
  

В моем Java script я создал функцию ниже:

 Number.prototype.formatMoney = function(c, d, t){
    var n = this, 
    c = isNaN(c = Math.abs(c)) ? 2 : c, 
    d = d == undefined ? "." : d, 
    t = t == undefined ? "," : t, 
    s = n < 0 ? "-" : "", 
    i = String(parseInt(n = Math.abs(Number(n) || 0).toFixed(c))), 
    j = (j = i.length) > 3 ? j % 3 : 0;
    return s   (j ? i.substr(0, j)   t : "")   i.substr(j).replace(/(d{3})(?=d)/g, "$1"   t)   (c ? d   Math.abs(n - i).toFixed(c).slice(2) : "");
};
  

Но выдает ошибку:

 highcharts.js?Z:20 Uncaught TypeError: Cannot read property '", ",")' of undefined
  

Есть ли простой / другой способ реализовать то, что я хочу? Вот мой jsfiddle.

Вместо использования pointFormat используйте обратный вызов pointFormatter
pointFormatter: function() {
return '<tr>'
'<td style="color:' this.series.color ';padding:0">'
this.series.name ': </td>'
'<td style="padding:0"><b>' this.y.formatMoney(2, '.', ',')
'</b></td>'
'</tr>';
},

Пример: https://jsfiddle.net/w64runoo/11 /

Кроме того, загрязняющий Number.prototype не является чистым способом сделать это. Вы можете проверить обратный вызов NumberFormat Highcharts и расширить его своей функцией. http://api.highcharts.com/highcharts/Highcharts.numberFormat

Проверьте также параметры глобального языка, где вы можете определить тысячный шаг и десятичную точку http://api.highcharts.com/highcharts/lang.thousandsSep