Могу ли я использовать два разных форматирования для всплывающих подсказок?

У меня есть таблица с большими номерами с двумя сериями данных, в которых используются именованные значения. В моих подсказках для одной серии я хочу ссылаться на точку данных из серии. Итак, решение в этом ответе: Как использовать другой форматтер на Highcharts в каждой кривой одной и той же графикой? не помогает мне. Мне нужно больше, чем просто tooltipText, мне нужен форматтер:

Для одного:

formatter: function() {
    return this.x + ': ' + this.series.name +
    '<br> $' + Highcharts.numberFormat(this.y, 0);
     }

А для другого:

formatter: function() {
    return 'In ' + this.x + ' the median value was' + this.median + 
    'and the total $' + Highcharts.numberFormat(this.y, 0);                        
 }

Ответы

Ответ 1

Внутри форматирования this ссылается на целенаправленную серию, вы можете добавить if/else внутри форматирования и вернуть строку для каждого из них, например, следующее.

tooltip: {
    shared: false,
    formatter: function() {
        var text = '';
        if(this.series.name == 'MSFT') {
            text = this.x + ': ' + this.series.name +
                   '<br> $' + Highcharts.numberFormat(this.y, 0);
        } else {
            text = 'In ' + this.x + ' the median value was' + this.median +
                   'and the total $' + Highcharts.numberFormat(this.y, 0);
        }
        return text;
    }
}

демонстрация

Ответ 2

Вы можете легко определить форматщик для каждой серии - см. здесь: http://api.highcharts.com/highcharts/plotOptions.series.tooltip

{
  tooltip: {
          shared: true
  },
  series: {
     name: 'some series name',
     data: mydata,
     tooltip: {
        valueSuffix: ' bar'
     }
  }
}

Пример: http://jsfiddle.net/28qzg5gq/

Ответ 3

Вот пример. Пример скрипта здесь:

tooltip: {
            formatter: function () {
                var s = '<b>' + Highcharts.dateFormat('%A, %b %e, %Y', this.x) + '</b>';

                $.each(this.points, function () {
                    s += '<br/>1 USD = ' + this.y + ' EUR';
                });

                return s;
            }
        },