How to get series marker symbol when displaying shared tooltips? - highcharts

Question

Link to JSFiddle with question content marked by comments: https://jsfiddle.net/z1q7aqo3/
Specifically, the part which needs filling in is
'tooltip': {
'formatter': function(){
var output = '<strong>' + this.y + '</strong>';
var sorted = this.points.sort(function(a, b){
if (a.y == b.y){
return 0;
}
return a.y < b.y ? 1 : -1;
});
sorted.forEach(function(point, index){
var marker = '';
/*
TODO: How do I determine what symbol is used for the marker?
*/
output += '<br /><span style="color: ' + point.series.color + '">' + marker + '</span> ' + point.series.name + ': ' + point.y;
});
return output;
},
'shared': true
}
I have a line chart with a number of series. On mouseover, the tooltip displays all the values of all of them, in sorted order. This part is done and can be seen in the JSFiddle. My question is, I want each the text for each series in the tooltip to include the marker symbol used for that series, styled in the color of the series. The color styling is also complete and can be seen in the JSFiddle, but how do I get the marker symbol?

Answer 1

Modifying form earlier Answer it is for individual series tooltip. Here modified to shared tooltip
Fiddle demo
Highcharts.chart('container', {
'title': {
'text': 'Random Chart'
},
'tooltip': {
'formatter': function(){
var output = '<strong>' + this.y + '</strong>';
var sorted = this.points.sort(function(a, b){
if (a.y == b.y){
return 0;
}
return a.y < b.y ? 1 : -1;
});
sorted.forEach(function(point, index){
var marker = '';
if ( point.point.graphic && point.point.graphic.symbolName ) {
switch ( point.point.graphic.symbolName ) {
case 'circle':
marker = '●';
break;
case 'diamond':
marker = '♦';
break;
case 'square':
marker = '■';
break;
case 'triangle':
marker = '▲';
break;
case 'triangle-down':
marker = '▼';
break;
}
}
/*
TODO: How do I determine what symbol is used for the marker?
*/
output += '<br /><span style="color: ' + point.series.color + '">' + marker + '</span> ' + point.series.name + ': ' + point.y;
});
return output;
},
'shared': true
},
'series': [{
'name': 'Series 1',
'data': [1, 3, 7, 19, 11, 27, 8, 15]
}, {
'name': 'Series 2',
'data': [2, 1, 8, 12, 14, 20, 9, 10]
}]
});