I am setting up a candlestick chart from this example:
https://www.amcharts.com/demos/candlestick-chart/
What I am trying to do is to pre-zoom the chart to the last 10% of the available data. In the documentation ( https://www.amcharts.com/docs/v5/charts/xy-chart/zoom-and-pan/ ) it says to use the start parameter:
var xAxis = chart.xAxes.push(
am5xy.DateAxis.new(root, {
start: 0.9,
renderer: am5xy.AxisRendererX.new(root, {})
})
);
In the note below this code it says if a scrollbar is used, add the very same start offset as in the chart date axis.
So, within the sample code I set:
var xAxis = chart.xAxes.push(
am5xy.DateAxis.new(root, {
start: 0.95,
groupData: true,
maxDeviation:0.5,
baseInterval: { timeUnit: "day", count: 1 },
renderer: am5xy.AxisRendererX.new(root, {pan:"zoom"}),
tooltip: am5.Tooltip.new(root, {})
})
);
and for the srollbar:
var sbxAxis = scrollbar.chart.xAxes.push(
am5xy.DateAxis.new(root, {
start: 0.95,
groupData: true,
groupIntervals: [{ timeUnit: "week", count: 1 }],
baseInterval: { timeUnit: "day", count: 1 },
renderer: am5xy.AxisRendererX.new(root, {
opposite: false,
strokeOpacity: 0
})
})
);
I tried everything. I tried from https://www.amcharts.com/docs/v5/charts/xy-chart/axes/category-date-axis/
xAxis.zoomToDates(new Date(2021, 0, 1), new Date(2022, 0, 1));
and
series.events.once("datavalidated", function(ev) {
ev.target.get("xAxis").zoomToDates(new Date(2021, 0, 1), new Date(2022, 0, 1));
});
I tried adding "end: 1" to both elements. No luck.
Please, advice. Thanks a lot in advance.
from AmCharts v5: pre-zooming date axis
No comments:
Post a Comment