HighChart Форматирование номера общей подсказки - PullRequest
Новая
       2

HighChart Форматирование номера общей подсказки

10 голосов
/ 09 февраля 2012

Я использую HighCharts JS в первый раз.Пока что я очень впечатлен.Я строю графики для нескольких серий и использую общую подсказку.Числа в общей подсказке верны, но они не отформатированы так, как мне бы хотелось.Например, я вижу 9876 вместо 9,876.

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

Вопрос: Можно указать формат для числа (с)) во всплывающей подсказке без написания пользовательского форматера?

Ответы [ 4 ]

14 голосов
/ 09 февраля 2012

К сожалению, это невозможно, я боюсь: стандартные средства форматирования всплывающих подсказок несколько скрыты внутри объектов Point и Tooltip и не обеспечивают доступ к форматированию чисел.

Однако, вы можете переопределить реализацию Point tooltipFormatter по умолчанию чем-то своим, например, 

Highcharts.Point.prototype.tooltipFormatter = function (useHeader) {
    var point = this, series = point.series;
    return ['<span style="color:' + series.color + '">', (point.name || series.name), '</span>: ',
        (!useHeader ? ('<b>x = ' + (point.name || point.x) + ',</b> ') : ''),
        '<b>', (!useHeader ? 'y = ' : ''), Highcharts.numberFormat(point.y, 0), '</b>'].join('');
};

Эта реализация такая же, как и по умолчанию, за исключением вызова Highcharts.numberFormat в последней строке, который будет выполнять форматирование вашего номера.

Имейте в виду, что такое изменение будет распространяться на все ваши графики.

2 голосов
/ 13 марта 2015

Используйте pointFormatter для форматирования общей подсказки.Это доступно с версии 4.1.0: 

tooltip: {
    shared: true,
    pointFormatter: function() { 
        return '<span style="color:' + this.series.color + ';">●</span> ' + this.series.name + ': <b>' + numberFormat(this.y) + '</b><br/>'; 
    }
}
1 голос
/ 28 августа 2012

Начиная с версии 2.2 появилась новая опция «PointFormat», позволяющая указать отдельный форматер только для значений точек: http://api.highcharts.com/highcharts#tooltip.pointFormat

0 голосов
/ 06 июня 2013

Способ применения функции Math.round() внутри скрипта старшей диаграммы. 

series: [{
    type: 'pie',
    name: 'CPU (GHz)',
    data: [
            ['Used',Math.round( <?php echo $gSum_Allocated_CPU; ?>, 2)],
            {
                name: 'Available',
                y:Math.round(<?php echo $gSum_Available_CPU; ?>, 2),
                sliced: true,
                selected: true
             }
          ]
     }]
...