HighStock graph for non date records - highcharts

In highstock chart,
Is it possible to achieve the bar chart with range selector at the yaxis instead of xaxis.
Is it possible to have the non-date values (i.e some customer names) as x axis(if xaxis as range selector) and alphabets as the range selector?
Thanks.

Related

Setting min max values for the Horizontal Axis on a Google Sheets chart

I have a google sheet with an embedded chart. I am able to add min/max values that display on the chart for the vertical axis, but not the horizontal.
Here are the details for the verticle axis:
But I don't have min/max options for the horizontal axis:
What am I missing?
The Min-Max option will only appear if the defined X-axis range contains only numeric values:
I was able to reproduce this with a sample table. My X-axis range is A3:A6.
When numeric values are used for the X-axis range:

Show only month labels on HighChart xAxis

I have some list of dates as categories for xAxis.
Example of collection : 2018-01-01, 2018-01-03, 2018-01-10, 2018-01-17, 2018-01-29;
I want to display on chart dates in format MMM yy (Jan 18)
So I've tried to group all this dates by this date format. As result I received only 1 item in collection which is logically. But on chart I saw labels like this
Jan 18, 1, 2, 3, 4
How to "group" values on chart to display only month labels?
Example what I have now https://jsfiddle.net/phwgo4jz/7/
You could use the dateTimeLabelFormats option of xAxis to format the label. Or simply set the type of xAxis to datetime. Highcharts scales the axis and inserts appropriate labels as required.
Here is the highcharts documentation : https://api.highcharts.com/highcharts/xAxis.dateTimeLabelFormats
Also a sample codepen with similar functionality as your requirement. Have a look
https://codepen.io/samuellawrentz/pen/XYVyNR?editors=1010
categories are basically just an information how to display labels and position ticks - the axis still behaves like a "normal" linear axis. Highcharts will fill the axis labels up with subsequent integers if you don't provide categories for all y positions.
You can use xAxis.labels.formatter to filter categories out:
formatter: function() {
return Number.isInteger(this.value) ? '' : this.value;
}
Live demo: https://jsfiddle.net/BlackLabel/ytoj9ng2/
API reference: https://api.highcharts.com/highcharts/xAxis.labels.formatter

how to split by hour in highcharts while using x-axis type date range

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

Highcharts: How can I take X-axis value in tooltip?

I am using Highcharts to draw a graph. I want the tooltip show the exact values of x-axis (eg. 1930-07-01). I used (this.x) in tooltip formatter and it is showing x-axis 0.
How can i the 1930-07-01 value here in tooltip?
In case when you use formatter and categories you can use this.key or this.x
http://jsfiddle.net/wxxEu/2/

Highcharts - changing x-axis labels with rangeselector

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

Resources