This is chart that I need:
This is my chart:
How to change the xAxis via time like in first chart and focus
You need to set time xAxis type and define each point as array [x,y], where x is timestamp (time in miliseconds). Second solution is using pointInterval and pointStart params.
The focus on element, can be realised tooltip.refresh.
chart.tooltip.refresh(chart.series[0].data[0]); //first point of first serie
Related
Is there a way to create an empty point for the dates which are not included in the data?
Tried to use pointInterval: 24*3600*1000, but doesn't have any result.
In this example we have a gap between 31th July and 7th August which I would like to fill with empty points.
http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/stock/demo/candlestick/
You need to set ordinal: false as an option on the xAxis. Like this:
xAxis: {
ordinal: false
}
API on xAxis.ordinal: https://api.highcharts.com/highstock/xAxis.ordinal
In an ordinal axis, the points are equally spaced in the chart regardless of the actual time or x distance between them. This means that missing data for nights or weekends will not take up space in the chart.
Defaults to true.
Working example: http://jsfiddle.net/phLz68r9/
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.
I am trying to make a chart using Highcharts which shows no of days in the x-axis if the chart is for a week or month.
Now i want to split the x-axis by "hours" if the chart is for single day.
See the fiddle here
var checkin_failures_stats = {
xAxis: {
type: 'datetime'
},
You need to use tickPositioner and calculate your ticks dynamically.
http://api.highcharts.com/highcharts#xAxis.tickPositioner
It sounds like you just need to look at the tickInterval property:
http://api.highcharts.com/highcharts#xAxis.tickInterval
You'll need to know the time span of your chart - you can either specify this directly, or you can get the min and max values from the getExtremes function, and calculate the length of the time of the chart, and set your tickInterval accordingly.
http://api.highcharts.com/highcharts#Axis.getExtremes
I can't seem to show the series with empty data into my highcharts. I have some check-ins in a graph for each of the 7 weekdays. But when a day doesn't have data, it's hidden. What I would like to do is show the label of the empty serie on the x-axis (print the weekday name). I tried to populate my data with null values, using different options for highcharts, ...
I also can't set the color for the columns, I tried setting it to gray but that doesn't work.
Here's a demo in JSFiddle
You can set min and max for yAxis, instead of minPadding and maxPadding, take a look: http://jsfiddle.net/tgZcc/21/
I am trying to use the highstock graph. I want to update the xAxis labels according to the range which is selected from the rangeselector. eg. if it's a 1-year graph, i want the ticks to be at the end of each month with labels as Jan-12,Feb-12 etc.(by default it shows each month as the beginning of that month). And if it's a monthly graph i want the labels to be positioned at each friday ie. at an interval of 7 days.
Is there a way i can dynamically change which labels are displayed on the axis based on the extremes?
You can use tickPositioner (http://api.highcharts.com/highcharts#xAxis.tickPositioner) or formatter to change labels name http://api.highcharts.com/highcharts#xAxis.labels.formatter