highchart tooltip with multiple additional data in tooltip? - highcharts

I m using Dotnet Highchart. I m getting data from a data base table which has 10 columns in total and using its two columns to display chart.
I need to show all 10 columns in tooltip (sort of summary), but I dont have an idea if it can be done or not ? Can you please guide me how to pass data of all columns to table and display in tooltip ?
Thanks for your time and help.

if you are maintaining the entire data to be plotted in a separate list/array you can access it from the formatter function of the tooltip
tooltip: {
formatter: function() {
//apply your logic here like a regular js method
//the returned value will be displayed on tooltip
return this.y;
}
}
refer api documentation : http://api.highcharts.com/highcharts#tooltip.formatter
Hope this will help you.

Related

Show more than 20 categories on highcharts heatmap xaxis

I am working with Highcharts heatmaps.
I have multiple data points (I am calling them functions), each having some data series defined as
The format of the above is
string, epochtime, value
The series1 or series2 (see comment below) are series names associated with each function. I want to update the series in the chart based on the click of a button associated with a function. There are multiple such functions and each function has its own button. Clicking on the button populates the respective data in the heatmap using the above array of arrays.
Th problem is when I click on adding a function which has more than 20 series defined in the format above, it doesn’t work . The screen displays time since 1970(for some reason). While it works for less than 20 series.
Figured it out, my bad. Apparently had to disable the turbothreshold for the heatmap via the plotOptions. Everything worked fine and i could have as many categories in the x axis.

A different suffix from an array for each line on Highcharts

What I need is to show a different valuesuffix for each chart type value based on a unique array for each series.
I have considered the answer in this question and created this jsfiddle.a
It will only work when the tooltip is displayed for one series at a time. If I set the series tooltip to be shareda, it will not work.
Any ideas?
For tooltip shared with multiple series, you need to loop the points like this in order for the tooltip to work.
Edited: Added valuePrefix

Accessing series data in tooltip formatter highcharts

I am trying to calculate the difference between the total of 2 stacked columns for which I am trying to access series data in tooltip formatter. Is there a way I can do that?

Modify value shown in tooltip in highcharts

I am trying to plot three time-series data from csv in a single chart using highcharts. Before plotting the data I am normalizing the data so that all the three data sources plot data which can be easily compared for a given range.
But when I use the tooltip I want to show what the original value of the data is in the tooltip on hover.
I looked at the tooltip formatter but could not get through for changing the value for only one of the data series.

Highcharts showing image in tooltip and get column index

I am using the highcharts javascript library with the column chart. What I am trying to do is show an image in a tooltip when the user rolls over the column. I am able to show images, but not the one I want.
I have an array of image links
var imagesLinks = ["img1","img2","img3","imgN"];
What I am trying to do is show the image based upon which column they are on so if they on the first column it would show imagesLinks[0], third column would show imageLinks[img3] etc.
Basically I need to know how to get the column index. I found this code below that helps me get the images on click, but it does not really help with the tooltip.
plotOptions: {
column :{
point:{
events:{
click:function(){
console.log(this.x);
}
}
}
}
},
I have found the answer.
Inside the formatter function you use this.point.x

Resources