I have a stock price chart with variance along xAxis (its a special chart). I want to plot this variance as histogram.I can draw it successfully but I can't get rid of the space between histogram columns. fiddle here https://jsfiddle.net/Lng1w0my/1/ (click on price series to generate histogram)
I have set
groupPadding: 0,
pointPadding: 0
but doesn't work.
I tried a simpler fiddle https://jsfiddle.net/hpdru52b/1/ And this one works fine.
I can't find what is the difference.
Any help is highly appreciated.
You need to set ordinal option to false:
xAxis: {
ordinal: false
}
Live demo: https://jsfiddle.net/BlackLabel/ush37qox/
API Reference: https://api.highcharts.com/highstock/xAxis
Related
We have to create a chart and tried but it is not showing the column in case of negative value in the data.
for link :
'https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/column-placement'
I have put a negative value and it is not showing a column for it, how we can achieve it for column-placement chart.
You just need to remove min restriction for y-axis.
yAxis: [{
// min: 0,
...
}]
Live demo: https://jsfiddle.net/BlackLabel/xq8ejgnf/
API Reference: https://api.highcharts.com/highcharts/yAxis.min
I want to decrease the tickinterval of primary y-axes in my dual axes chart so that the columns height could increase. Chart is working well but due to high intervals, columns height is getting small. The data is dynamic and will remain the same as I have used in the example on jsfiddle.
Please see the jsfiddle i have created for this.
`http://jsfiddle.net/mr6dyh94/2/`
You have to set alignTicks property to false. In API documentation we can read:
tickInterval: number
...
If the chart has multiple axes, the alignTicks option may interfere with the tickInterval setting.
chart: {
alignTicks: false
}
Live demo: http://jsfiddle.net/BlackLabel/dcpz592x/
API: https://api.highcharts.com/highcharts/chart.alignTicks
We have column chart, but it will display very ugly when it have lot of column, we enable the scrollbar but its not working properly. Please see the below image.
Please help me on,
How to add margin between group of column.
Or any other way to display the column chart with huge amount of data.
jsFiddle :
`http://jsfiddle.net/utq6zjh5/4/`
Try something like this :
xAxis: {
min: 100
},
Fiddle here: http://jsfiddle.net/utq6zjh5/5/
Try setting some max to xAxis that will work,
setting both min and max to the xAxis will make a pericular range of values to be hown and the chart will be scrollable now,
xAxis: {
max: 3 //3 is just a smple, just check which will work in your case
}
updated your fiddle here
I'm trying to use highcharts' spider chart. No problem to load it.
I have a problem in axis ranges. Some data is between 0-100 and some is 1.000.000-10.000.000. By default, highchart makes that min : 0 and max : 10.000.000 and some data's difference doesn't seem.
Could you help please ?
Thanks
You need a logarithmic chart.
yAxis: {
type: 'logarithmic'
}
Before and After
I need to add a new series to this chart which will allow me to highlight / shade a particular range of dates. It needs to be 100% height of the chart.
I was looking at using another area series, but I couldn't get it working as I wanted it given I have two existing area series on this chart.
I thought another series which had a 1 or 0 for the particular point to indicate if it should be highlighted or not?
{name: 'mydates',
color:'red',
fillOpacity: 0.3,
data: [0, 0, 0,1,1,1,1, 1, 1,1,0,0],
type:'area',
stacking: 'percent'
},
http://jsfiddle.net/L3ynM/
The problem with my sample:
The 'mydates' series doesn't take 100% height of the chart
If the 'mydates' series begins midchart, it starts with an angle. I'd like it to go straight up
Unless you really need the legend entry, I would recommend using plotBands instead
http://api.highcharts.com/highcharts#xAxis.plotBands
You can also do it like this, if you do really need the legend:
http://jsfiddle.net/jlbriggs/JVNjs/305/
data:[[1.5,0],[1.5,80],[2.25,80],[2.25,0]]
It relies in part on setting a min and max, and using those min and max values as your y data points.