Suppose there is a point in the data highstock 'x', 'y' and 'b', if we want to point 'y' in the tooltip we can call by calling point.y, how to call point.b ?
Thank's
Use point.options.b to get your custom point options.
Remember, that in Highstock you have dataGrouping, which will NOT group custom options.
Related
I want to change the display position of the chart y axis value.
In the example chart, the y-axis values are displayed to the right of the entire chart.
But I want to display it on the left rather than on the right.
What to do in this case?
enter link description here
You need to use the opposite property:
yAxis: {
opposite: false
}
Live demo: https://jsfiddle.net/BlackLabel/wx0qdypt/
API Reference: https://api.highcharts.com/highstock/yAxis.opposite
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',
}
Short question : Is there a way to set min/max in Highcharts AFTER the chart has been created. I am aware of intial setup like y: {min: 100,max: 200} at the chart initialization but I want to change max/min later on dynamically.
I guess setExtremes is the best way to go about it.
Syntax should be: chart.yAxis[0].setExtremes(100,300);
If one wants to just set minimum then chart.yAxis[0].setExtremes(100,null); worked for me.
we can also use update method
chart.yAxis[0].update({
max: 100
});
chart.xAxis[0].update({
max: 150
});
Also you can use tickPositioner http://api.highcharts.com/highcharts#yAxis.tickPositioner to define min/max values and ticks between these values.
There, bizarrely, doesn't seem to be a way to target which Y axis a series is added to using the chart.addSeries() method. Nothing here (http://api.highcharts.com/highstock#Chart.addSeries%28%29) about targeting axes. This results in lines destined to be plotted against the oposite axis being incorrectly plotted in the left hand one; something I would have thought to be a basic prerequisite of the method.
Has anyone seen any hacks or plugins that might solve this or know where to go in the source to fix this?
That's what the yAxis property is used to specify in the series configuration object you pass into addSeries as the options parameter.
You can add serie as you define series in Highcharts, so you can use yAxis index. Take look at example http://jsfiddle.net/68Fp4/1/
$('#button').click(function() {
chart.addSeries({
name: 'ADBE',
data: ADBE,
yAxis:1
});
});
I need to output a plot on page, and I'm considering Highstock or Highcharts to implement this. Highstock interface is more preferable due to navigator pane showing the rest of plot after rezooming.
However my plot has numbers in x-asis, but not date/time. Is there any way to use Highstock with numerical x-scale? Or add similar navigator to Highcharts?
Below X Axis formatter can be used with high Stock for displaying numbers in X-Axis:
xAxis: {labels: { formatter: function () {return this.value;}} }
Highstock's only type of xAxis is datetime, so using it with numbers is not an option. (Maybe if you make some tricky formatting actions and define a custom tooltip with the same formatting options it might be possible).
Leaves only Highcharts and there is an example called master-detail chart that could meet your requirements.
Hope that helps.
xAxis: {
type: 'linear' // Other types are "logarithmic", "datetime" and "category"
},