numeri Format tooltip in Highcharts

Question

io uso tooltip.pointFormat di rendere i dati aggiuntivi nel tooltip. Sfortunatamente solo point.x è formattato correttamente con un separatore di migliaia.

jsFiddle

$(function() { 
    Highcharts.setOptions({ 
    global: { 
     useUTC: false, 
    }, 
    lang: { 
     decimalPoint: ',', 
     thousandsSep: '.' 
    } 
    }); 
    $('#container').highcharts({ 
    xAxis: { 
     type: 'datetime' 
    }, 
    tooltip: { 
     pointFormat: '{series.name}: <b>{point.y}</b><br/>' + 'Count: <b>{point.count}</b><br/>', 
     shared: true 
    }, 
    series: [{ 
     data: [{ 
     y: 20009.9, 
     count: 20009.9 
     }, { 
     y: 10009.9, 
     count: 20009.9 
     }, { 
     y: 40009.9, 
     count: 20009.9 
     }], 
     pointStart: Date.UTC(2010, 0, 1), 
     pointInterval: 3600 * 1000 // one hour 
    }] 
    }); 
}); 

Answer 1

Trovato la risposta here.

I numeri sono formattati con un sottoinsieme di convenzioni di formattazione float dalla libreria C funciton sprintf. La formattazione viene aggiunta all'interno di le parentesi variabili, separate da due punti. Per esempio:

• due cifre decimali: "{point.y:.2f}"
• Separatore di migliaia, senza cifre decimali: {point.y:,.0f}
• Migliaia separatore, primo decimale: {point.y:,.1f}

Quindi, utilizzando :,.1f all'interno le parentesi formeranno il numero correttamente.

tooltip: { 
    pointFormat: '{series.name}: <b>{point.y}</b><br/>' + 'Count: <b>{point.count:,.1f}</b><br/>', 
    shared: true 
} 

jsFiddle

Answer 2

instaed di pointFormat, utilizzare il tooltip formatter e poi Highcharts.numberFormat

tooltip: { 
      formatter:function(){ 

       return this.point.series.name + ': <b>' + Highcharts.numberFormat(this.point.options.count,1,',','.') + '</b><br/>' + 'Count: <b>'+Highcharts.numberFormat(this.point.y,1,',','.')+'</b><br/>'; 
      } 
     }, 

Esempio: http://jsfiddle.net/8rx1ehjk/4/

Answer 3

Nel nostro caso tooltipFormatter vale formato solo per y proprietà, ho trovato paio di modi per aggiungere formato non solo per y,

1. formato aggiuntivo per ogni suggerimento e per ogni proprietà come questa point.count:,.f

   pointFormat: '{series.name}: <b>{point.count:,.f}</b><br/>' + 'Count: <b>{point.y}</b><br/>', 
   

2. creare piccola estensione come questo

   (function (Highcharts) { 
       var tooltipFormatter = Highcharts.Point.prototype.tooltipFormatter; 
   
       Highcharts.Point.prototype.tooltipFormatter = function (pointFormat) { 
       var keys = this.options && Object.keys(this.options), 
        pointArrayMap = this.series.pointArrayMap, 
        tooltip; 
   
       if (keys.length) { 
        this.series.pointArrayMap = keys; 
       }  
   
       tooltip = tooltipFormatter.call(this, pointFormat);   
       this.series.pointArrayMap = pointArrayMap || ['y']; 
   
       return tooltip; 
       } 
   }(Highcharts)); 
   

Example