Как получить многосерийные данные в диаграммах всплывающих подсказок?

18

Я хочу отображать несколько рядов данных в подсказке в каждом столбце

tooltip: {
    formatter: function() {
        return '<span style="color:#D31B22;font-weight:bold;">' +this.series.name +': '+ this.y +'<br/>'+
               '<b style="color:#D31B22;font-weight:bold;">'+this.x +'</b><span>';
    }
},

и данные

series: [{
    showInLegend: false,
    name: 'Total Click',
    data: [3000,200,50,4000],
    color: '#9D9D9D'
}, {
    showInLegend: false,
    name: 'Total View',
    data: [100,2000,3000,4000],
    color: '#D8D8D8'
}]

Я использую подобное, но в подсказке инструмента показывается только одна серия данных. Я хочу отображать данные, подобные этому (Total View: 100 и Total Click: 3000)

    
задан Mohit Gupta 11.10.2013 в 09:14
источник
  • добавьте свой код, чтобы я мог вам помочь :) –  Pragnesh Chauhan 11.10.2013 в 09:15
  • эй, мохит, пожалуйста, проверьте мой код, я думаю, что это то, что вам нужно jsfiddle.net/pintu31/AcNUM/2 –  Pragnesh Chauhan 11.10.2013 в 12:05
  • приятная работа ............... Pragnesh –  Mohit Gupta 11.10.2013 в 12:16
  • Есть ли способ сделать это без установки backgroundColor на null? Это значение по умолчанию удаляет указатель стрелки stackoverflow.com/questions/42772038/... –  es3735746 13.03.2017 в 21:47

3 ответа

30

попробуйте использовать этот код

обновленный DEMO

tooltip: {
        formatter: function() {
            var s = [];

            $.each(this.points, function(i, point) {
                s.push('<span style="color:#D31B22;font-weight:bold;">'+ point.series.name +' : '+
                    point.y +'<span>');
            });

            return s.join(' and ');
        },
        shared: true
    },
    
ответ дан Pragnesh Chauhan 11.10.2013 в 11:46
источник
  • s.push ('<span style="color:"' + point.series.color + '"; font-weight: bold;">' –  grantiago 16.01.2018 в 17:48
12

Вам нужно использовать общий параметр Ссылка , а затем в formater итерации в каждой точке.

    
ответ дан Sebastian Bochan 11.10.2013 в 10:51
источник
1

Если кто-то ищет диаграмму рассеяния, вот решение , чтобы показать общую подсказку.

formatter: function(args) {
    var this_point_index = this.series.data.indexOf( this.point );
    var this_series_index = this.series.index;
    var that_series_index = this.series.index == 0 ? 1 : 0; // assuming 2 series
    var that_series = args.chart.series[that_series_index];
    var that_point = that_series.data[this_point_index];
    return 'Client: ' + this.point.name +
           '<br/>Client Health: ' + this.x +
           '<br/>' + this.series.name + ' Bandwidth: ' + this.y + 'Kbps' +
           '<br/>' + that_series.name + ' Bandwidth: ' + that_point.y + 'Kbps';
}

ссылка Jsfiddle для решения

    
ответ дан drj 12.06.2014 в 08:44
источник
  • Есть ли такое решение для столбчатых диаграмм? –  es3735746 12.03.2017 в 01:23