Highcharts Bar Graph Tool Tip Point Format

Question

Я создал гистограмму с использованием 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-скрипт Я создал функцию ниже:

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.

Answer 1

Вместо использования 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

Проверьте также глобальные опции Ланг, где вы можете определить thousandStep и decimalPoint http://api.highcharts.com/highcharts/lang.thousandsSep