如何分别为每个rangeSelector按钮设置xAxis maxRange/minRange

Question

如何分别为每个rangeSelector按钮设置xAxis maxRange(minRange(？

例如：当我点击rangeSelector按钮"时；Day bars"；，我想将xAxis极限设置为放大到10天(因此放大的最小值为10天或10条，将显示在绘图区中(和缩小到60天(缩小的最大值为60天或60条，将在绘图区显示(。当我点击rangeSelector按钮时；周条"；，我想将xAxis极限设置为放大到10周(因此放大的最小值为10周或10条，将显示在绘图区域中(和缩小到60周(缩小的最大值为60周或60条，将在绘图区域显示(。

我可以在rangeSelector中使用maxRange、minRange函数吗？我可以设置图表事件、rangeSelector事件或xAxis事件吗？我试图在SetExtremes事件后通过xAxis设置它，但不起作用。

xAxis: {
type: 'datetime',
events: {
afterSetExtremes: 
function(e)                                                         
{
if (e.trigger == "rangeSelectorButton" && e.rangeSelectorButton.text == "Day")
{
console.log("day");
var maxDistance = 1 * 30 * 24 * 3600 * 1000; //1 months time
var xaxis = this;
if ((e.max - e.min) > maxDistance) {
var min = e.max - maxDistance;
var max = e.max;
window.setTimeout(function() {
xaxis.setExtremes(min, max);
}, 1);
}
}
if (e.trigger == "rangeSelectorButton" && e.rangeSelectorButton.text == "Week")
{
console.log("Week");

var maxDistance = 12 * 30 * 24 * 3600 * 1000; //12 months time
var xaxis = this;
if ((e.max - e.min) > maxDistance) {
var min = e.max - maxDistance;
var max = e.max;
window.setTimeout(function() {
xaxis.setExtremes(min, max);
}, 1);
}
} 

},

}
}

请参阅jsFiddle：https://jsfiddle.net/PaulJaker/mrgk5s19/120/

非常感谢
Paul

Answer 1

试着为每个按钮编写一个自定义功能来实现它，例如，几天来尝试做这样的事情：

{
text: 'Day',
dataGrouping: {
forced: true,
units: [
['day', [1]]
]
},
events: {
click(e) {
e.preventDefault();
const maxDistance = 60 * 60 * 24 * 1000 * 10; // where 10 is the days amount
const min = chart.xAxis[0].min;
window.setTimeout(function() {
chart.xAxis[0].setExtremes(min, min + maxDistance);
}, 1);
}
}
},

演示：https://jsfiddle.net/BlackLabel/2bf5tp0h/