HighCharts - compare series with values instead of percentage - highcharts

Just a simple answer needed, is there a simple way to compare a series on values rather than percentages? Something like "compare : 'values'" rather than "compare : 'percent'" or do I manually have to add data points for given time intervals? Thanks!

Yes, but the option is called value
From the plotOptions.series.compare documentation:
compare: String
Compare the values of the series against
the first value in the visible range. The y axis will show percentage
or absolute change depending on whether compare is set to "percent" or
"value". When this is applied to multiple series, it allows comparing
the development of the series against eachother. Defaults to
undefined.
The demos from the documentation: Setting compare to percent, value.

Related

Tableau map tooltip not displaying average reference line

I created a chart visualising the cost of living in different cities and entered a line indicating the average. When integrating this sheet into the tooltip of my map, the line is not representing the average anymore but the actual cost of living for each city. I have been trying a lot but can't seem to figure it out. Thankful for any tip!
That's because the tooltip, triggered by the click/hover, is taking into consideration just a city at once, and so the average value is equal to the sum of that specific city: you're running average on just one city.
In order to compute the correct reference value you should create a calculated field like this using LOD:
{ FIXED : SUM([Cost Of Living])} / { FIXED : COUNTD([City])}
Then you could use that calculated field in a dual axis chart.
Doing so, since EXCLUDE acts before dimension filters, you will be able to preserve your average across City even though tooltip will trigger a filter.
Take a look at this simple example made with superstore and keep and eye on the red line (LOD v2) which relates to the calulated field above.
As you can see there's also a blue line which relates to the previous calculated field I wrote (LOD v1):
{ EXCLUDE [State] : AVG( { FIXED [State] : SUM([Sales])})}
Once we move to our main worksheet triggering the viz in tooltip, you'll see that the red value still keep the correct value calculated on all data, while the blue value is taking into consideration just data according to filter.
In fact FIXED is the only LOD calculus which act before the dimension filters and it's able to bypass the filtering triggered by the tooltip.

Where to set displayed data vs plotted data in Highcharts?

I am looking for a setting in Highcharts/stock that would allow me to apply a different format to displayed values of data, but not to the actual data as it is loaded into the series data. For example, we would like to plot y-axis data with precision up to 16 significant digits, and likewise, time values that use 6-8 sig figs. But that's not the precision we would like displayed in the tooltips, or other labels. However I am unable to find a way to format it without affecting both what is plotted and what is displayed. Here is an example of why this is a problem: let's say we have data points taken at .0001234s, .0001244s, .0001254s, and .0001264s, but we want to format the display of the time to ".0001" for all 4 data points. If we format it, then the "plotted" data ends up looking like it occurred at the same time-stamp, thus producing a stair-step look to our waveform.
I have looked at the custom functions that I can create to override tooltip display, but it doesn't appear that there is an easy way to make that very generic so that I can apply to all of the various chart instantiations (we use lots of different chart types), and that only covers tooltips; X-axis labels and Y-axis labels would also need separate functions for overriding those display values; there's possibly other places I haven't thought where the display might be affected as well. Is there any single, centralized place where the data points display value or format can be changed?
Example of stair-step appearance:
TIA
If you want to display various numbers (axis labels, tooltip, etc.) with various number of decimal places, you can use Highcharts.numberFormat function.
API Reference:
https://api.highcharts.com/class-reference/Highcharts#numberFormat
Example:
http://jsfiddle.net/eg0vepgq/

Charts - set Tooltip format per series

I have a use case where the client needs to see the previous date ranges stats overlaid on the current date range. This will allow them to easily compare current vs previous performance.
To do this I'm adding another series to the charts and retrieving the previous periods data. Previously, we then set the tooltip for the X value which was the current dates. I'm now needing to modify the tooltip to show the correct date value for each series such that a previous periods data point tooltip might look like:
12/1 : $4432.00
and the current periods data point:
1/1 : $21321.12
However it seems the charts are only capable of a single tooltip formatter instead of a per series formatter. If I continue to use the X axes label it will display the incorrect date on the previous periods data points. Using the above example would come out with 1/1 for the previous point:
1/1 : $4432.00
Is there a method by which I can set a tooltip format per series? Is there also any means by which we can modify and extend the underlying Highcharts?
I've found one solution for this function. Create a new XAxis and assign it to the Series.
XAxis xAxis = new XAxis();
xAxis.setCategories(categories);
xAxis.setOpposite(true);
configuration.addxAxis(xAxis);
series.setxAxis(1);
By adding the new XAxis the tooltip formatter can you use the same logic but receive different values depending on which axes the series is attached to.
I found setting the X axis by Integer a bit odd though. It should take the object imo but I suppose it needs to know which axis in the configuration's array to assign it to.
This solves the use case I have but won't be a solution if there are more than 2 axes to label.

Highcharts Column chart Series data formatting change

I have a simple column chart where the yAxis series data contains numeric strings in the millions and tens of millions. The chart therefore displays the graph numbers like this: "12.5M"(on the side of the grid) and in the points tooltip it is being displayed with a decimal point at the end. How do I make the data be shown in the thousands with commas? Will the chart be adjusted automatically to display more grid lines and raise the columns higher? Thanks a lot in advance.
I would have added an image, however it seems that that requires more reputation points. Sorry. Here's a link to it Screenshot
1) you can change the formatting of the axis labels by setting your own format with the formatter function
http://api.highcharts.com/highcharts#yAxis.labels.formatter
2) you can change the number of ticks by setting a tickInterval or tickPixel interval setting
http://api.highcharts.com/highcharts#yAxis.tickInterval
http://api.highcharts.com/highcharts#yAxis.tickPixelInterval
3) You can change how much extra space is added at the top/how many ticks there are, in part, by setting the maxPadding setting to 0
http://api.highcharts.com/highcharts#yAxis.maxPadding
When you have a small chart like the one you posted, Highcharts will often have trouble adapting its normal tick pattern, and you will often end up with just a min and max tick by default.
It's pretty easy to work these setting to get what you need though.

High Charts add variance instead of values

Hi am using high charts in my website and they are just awesome.I wold like to know whether there is any option to include variance in graph instead of the original values like the one in below snip.
instead of displaying the values of each bars i would like to display the difference between two.Is this possible?Thanks in advance
You need to enabled dataLabels for one series, and disable for second one. Then in dataLabels.formatter you need to compare values, and return value you want.

Resources