Добавление настраиваемой всплывающей подсказки в пузырьковую диаграмму/highchart

Question

Я пытаюсь настроить всплывающую подсказку в диаграмме пузырьков высоких диаграмм. Вместо того, чтобы показывать только фигуры во всплывающей подсказке, я хотел бы добавить контекст, основанный на названиях x, y и z (например, «50 погибших, 100 раненых, 150 жертв» вместо текущего »(50,150). Размер : 150 "дисплей). Я могу сделать так, чтобы это произошло в диаграммах графика разброса, используя следующее, но без пузырей в пузырьках. Есть идеи? Благодарю. :)

tooltip: { 
        headerFormat: '<b>{series.name}</b><br>', 
        pointFormat: '{point.x} fatalities, {point.y} injured, {point.z} total' 
       } 

Answer 1

Надеюсь, я правильно понимаю ваш вопрос, это то, что вы ищете.

$(function() { 
    $('#container').highcharts({ 

     chart: { 
      type: 'bubble', 
      zoomType: 'xy' 
     }, 
     plotOptions: { 
      bubble: { 
       tooltip: { 
        headerFormat: '<b>{series.name}</b><br>', 
        pointFormat: '{point.x} fatalities, {point.y} injured, {point.z} total' 

       } 
      } 
     }, 
     title: { 
      text: 'Highcharts Bubbles' 
     }, 

     series: [{ 
      data: [ 
       [97, 36, 79], 
       [94, 74, 60], 
       [68, 76, 58], 
       [64, 87, 56], 
       [68, 27, 73], 
       [74, 99, 42], 
       [7, 93, 87], 
       [51, 69, 40], 
       [38, 23, 33], 
       [57, 86, 31] 
      ] 
     }, { 
      data: [ 
       [25, 10, 87], 
       [2, 75, 59], 
       [11, 54, 8], 
       [86, 55, 93], 
       [5, 3, 58], 
       [90, 63, 44], 
       [91, 33, 17], 
       [97, 3, 56], 
       [15, 67, 48], 
       [54, 25, 81] 
      ] 
     }, { 
      data: [ 
       [47, 47, 21], 
       [20, 12, 4], 
       [6, 76, 91], 
       [38, 30, 60], 
       [57, 98, 64], 
       [61, 17, 80], 
       [83, 60, 13], 
       [67, 78, 75], 
       [64, 12, 10], 
       [30, 77, 82] 
      ] 
     }] 

    }); 

}); 

DEMO

Answer 2

Вы должны использовать ToolTip formatterhttp://api.highcharts.com/highstock#tooltip.formatter

EDIT: http://jsfiddle.net/7nqB5/