I am developing a graph in highcharts and I need a linear graph with the y-axis on the right, how can I do this?
you should add
opposite: true,
to yAxis options
watch this
Related
I have in excess of three years data being shown along the xAxis of a graph.
I'd like a user to be able to zoom into the xAxis to view data points more closely (yAxis doesn't need to change), by clicking buttons that will show "1 month", "6 months", "1 year" worth of data points in the visible chart area.
I can achieve this zoom using chart.xAxis[0].setExtremes(startDate, endDate) but I'd then like the user to be able to scroll along the xAxis at the specified zoom level to view the data that is off the side of the visible chart area and this I can't work out.
I imagine the issue is that setExtremes sets specific start and end points to the visible area, whereas what I really want to do is limit the view by a generic time period.
Appreciate any pointers!
I recommend you to use Highstock. You will be able to create a stock chart with additional features that you need or create a chart with scrollbar.
scrollbar: {
enabled: true
}
Live demo: http://jsfiddle.net/BlackLabel/8L0aj1wt/
Thanks for the Highstock recommendations #ewolden & #ppotaczek I can see it does have the right kind of functionality, but I managed to solve it by adding the following (panning, panKey and pinchType) to my chart options:
chart: {
type: 'spline',
panning: true,
panKey: 'shift',
pinchType: 'x',
}
I have a client that needs a pyramid chart. The funnel chart is perfect if only I could flip it around so it becomes a pyramid.
Seems like there would be a way to flip it but I cannot figure it out.
Any help would be appreciated!
Why not just modify the neckWidth and neckHeight and make the total width 0?
neckWidth: '100%',
neckHeight: '0%',
width: '0%'
See this example.
If you only want flip the Funnel chart you can use reversed attribute
in the series section of the chart
Funnel reveresed
instead of using funnel chart you can use, area chart or stacked area chart.
type: 'area'
that will be an easier way to get pyramid like in here http://jsfiddle.net/KQ344/
hope this will help you in getting what you want.
Is there any way of rounding both edges of the spline chart? I am almost sure I saw it done before but can't find it in the API docs.
Now my chart looks like:
Unfortuantely this option is not avaiable, but you can try to modify i.e SVG element (series).
You can use linecap, which defaults to round in the current Highcharts version.
plotOptions: {
spline: {
linecap: 'round'
}
}
As far as I know, the only two options are round (default) and square.
Official docs: http://api.highcharts.com/highcharts#plotOptions.spline.linecap
I would like that both yAxis and their labels in charts located at http://contenidopremium.estrategiasdeinversion.com/modulos/indicadores/framework_indicadores.php?t=BBVA&k=msdgv8IUDfviuqweRH9snsdvu7wsaeuvc87awer43sdney where displayed out the plot (not overflow in chart) as you can see in this chart http://www.highcharts.com/demo/spline-symbols but I don't find the difference or the correct options. I think that the difference is that demo is highchart and mine is highstock but I'm not sure.
Could anybody help me?
Thank ins advance, txetxu.
Set yAxis.labels.align to right, and manipulate x/y values, see: http://jsfiddle.net/JJLBp/
You can alter the position of the legend using the 'align' and 'verticalAlign' options. Try something like this:
legend: {
enabled: true,
verticalAlign: 'bottom'
},
This works with highstock http://jsfiddle.net/PZzYR/.
With Highcharts 3.0 it is possible to create charts with type 'bubble', whereas prior to 3.0 it was necessary to use a 'scatter' chart and modify marker size to make bubble charts. The nice thing about the old way is you had complete control over the visible pixel radius of each bubble--the new bubble charts automatically resize the bubbles so they are sized relative to each other. Is there any way to turn off this behavior or set bubble radius manually?
I am having a hard time seeing how a bubble chart, where the bubbles are not sized relative to each other, would be of any use.
You should be able to use the minSize and maxSize options, however, to control them the way that you need to:
bubble: {
minSize:2,
maxSize:50
}
{{edit:
I don't see them in the docs either, actually. But you can see an example here: http://jsfiddle.net/fXzke/13/ use either number as pixel value, or string with percent of chart height
}}
I found that adding an "empty" bubble to the series helps keep the size of all bubbles in the chart relative to each other:
name: '',
data: [{x:0,y:0,z:0}],
showInLegend: false,
color: 'transparent',
enableMouseTracking: false
Here's a sample on JSFiddle: http://jsfiddle.net/9bebT/2/. The legend, color, and mouse tracking variables each help keep the item in the series but otherwise invisible to the user. If you simply remove the empty bubble or set its visibility to "false," the chart doesn't register the empty bubble's z axis (diameter) as the minSize.