score:5
Accepted answer
Try this
tooltip: {
formatter: function() {
var s = '<strong>something: '+ this.x +'</strong>';
var sortedPoints = this.points.sort(function(a, b){
return ((a.y < b.y) ? -1 : ((a.y > b.y) ? 1 : 0));
});
$.each(sortedPoints , function(i, point) {
s += '<br/>'+ point.series.name +': '+ point.y +currency;
});
return s;
},
score:17
Adding on to the above answer.
I wanted to have the default formatting of the tooltip as well. So I called tooltip.defaultFormatter.call(this, tooltip)
inside the formatter callback.
Note that it is sorted in descending order. Just remove the items.reverse()
if you want ascending order.
HighCharts v4.0.4
function isArray(obj) {
return Object.prototype.toString.call(obj) === '[object Array]';
}
function splat(obj) {
return isArray(obj) ? obj : [obj];
}
$(function () {
$('#container').highcharts({
tooltip: {
formatter: function (tooltip) {
var items = this.points || splat(this),
series = items[0].series,
s;
// sort the values
items.sort(function(a, b){
return ((a.y < b.y) ? -1 : ((a.y > b.y) ? 1 : 0));
});
items.reverse();
return tooltip.defaultFormatter.call(this, tooltip);
},
shared: true
},
});
});
HighCharts v3.0.2
Based on the defaultFormatter function with the above applied to it.
tooltip: {
formatter: function (tooltip) {
var items = this.points || splat(this),
series = items[0].series,
s;
// build the header
s = [series.tooltipHeaderFormatter(items[0])];
// sort the values
items.sort(function(a, b){
return ((a.y < b.y) ? -1 : ((a.y > b.y) ? 1 : 0));
});
items.reverse();
// build the values
$.each(items, function (i, item) {
series = item.series;
s.push((series.tooltipFormatter && series.tooltipFormatter(item)) ||
item.point.tooltipFormatter(series.tooltipOptions.pointFormat));
});
// footer
s.push(tooltip.options.footerFormat || '');
return s.join('');
},
shared: true
},
Source: stackoverflow.com
Related Query
- want to sort highcharts tooltip results
- Never want to hide tooltip on highcharts
- Using PhantomJS to create HighCharts grahps server side for use in PDF creation (PHP) - results in exit code 11 from PHPs exec();
- How to edit tooltip in Highcharts C# code
- how to use highcharts tooltip formatter in python code
- Can Highcharts sort a legend list in a tooltip box?
- Disable highcharts tooltip on certain lines, leave it enabled on others?
- Customize tooltip and format the number to 2 decimal places of highcharts
- Highcharts tooltip overflow is hidden
- customize highcharts tooltip to show datetime
- Highcharts Series - want to show/hide all EXCEPT selected series (reversal of default logic)
- highcharts pass multiple values to tooltip
- Disable tooltip on certain points in Highcharts
- Rounding results in highcharts jquery script
- Highcharts tooltip always on right side of cursor
- missing value in highcharts line graph results in no line, just points
- Highcharts tooltip formatter
- Format tooltip numbers in Highcharts
- Weird character in front of Highcharts tooltip series names
- Display tooltip for invisible series in Highcharts
- Change Highcharts tooltip formatter from chart Object , after chart is rendered
- Adding thousands separator for custom formatted highcharts tooltip
- Highcharts - How to display legend symbol inside the tooltip
- highcharts tooltip z-index
- Add tooltip to legend in highcharts when hovering
- Highcharts - Keep tooltip showing on click
- Highcharts Pie Chart ignores percentageDecimals tooltip setting and has floating point inaccuracy issue
- Tooltip on custom button in Highcharts
- highcharts customize tooltip for a single point
- Always showing tooltip on all columns in Highcharts
More Query from same tag
- Activity gauge High Chart with Gradient
- Highstock - How to change tooltip color
- Type 'number[]' has no properties in common with type 'XrangePointOptionsObject' in Angular8 using Highcharts
- Customizing tooltip leaving the candle stick as it is
- Displaying max value in bottom of the pie chart - highcharts
- Trying to append arrays to highcharts ( jquery)
- Convert data to percentages HighCharts
- How to update the highcharts.js to make the export server to my own ipaddress,instead of connect to the highcharts server?
- How to make the colors on the heatmap chart to make it appear with scale values?
- Why won't Highcharts accept UTC value from my JSON?
- Highcharts plotband label zIndex
- Highcharts export chart new window/tab
- how to update bar graph and also its legend without re-drawing it in highcharts
- Highchart js Area chart Tooltip bug
- Animating column chart
- Javascript Highchart
- gridLineDashStyle of Highchart missing grid line at bottom when only one item as bellow demo
- Parse Json Data in Ajax Post
- Receiving NaN error when running javascript function
- Representing sparse data in a Highcharts series
- How to detect when dataLabels are overlapping and adjust them programmatically
- How do I pass an array for more than one series of random x-y data to Highcharts?
- Rails can't find javascript file from gem
- How can I specify custom end markers in a scatter series with Highcharts 9?
- What's the difference between 'legend' and 'showInLegend' in highcharts
- Highcharts: How can I associate a pre-formatted value with a data point?
- r - automatically add y axis in highchart
- Uncaught TypeError: Cannot read property 'chart' of undefined in highcharts
- DotNet.Highcharts and proper JSON
- Highcharts using JSON - graph not displaying mysql data