I have to create controls based on an object that I'm getting from a db call. The object can be anything, so the chart has to be created dynamically. To illustrate my issue lets say that the object looks like
var obj = [{name:"int",data:[2,5,8,11,12]},
{name:"double",data:[1.1,4.1,7.1,10.1,11]}]
After parsing the obj the user can select what they want to plot. Whether they want to see int or double on the x/y Axis. Then plot the series they want to see. My issue is that every time I plot the series no matter how I format it plots the series with the yAxis and the value's array index on the xAxis. How could I make it so the user can plot the int/double relation using either series? Thanks.
So you can use select html obejct, then catch select event and i.e addSeries() function to chart.
http://api.highcharts.com/highcharts#Chart.addSeries()
Related
is there a way to made the value of "total" in the middle of doughnut chart instead part of the chart itself, I've try to create in a different series, but it won't work in doughnut chart. its very useful for me since the actual data keep update in 1 minute
data range selected A1:B4
enter image description here
One approach would be to create a scorecard chart using total value and overlay it on the doughnut chart.
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.
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.
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
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.