要显示给定系列的子集,可以使用ApexCharts的range
选项来指定要显示的数据范围。在range
选项中,可以指定要显示的数据的起始索引和结束索引。以下是一个示例代码,展示如何默认只显示系列的最后5个元素:
var options = {
series: [{
name: 'Series 1',
data: [30, 40, 35, 50, 49, 60, 70, 91, 125]
}],
chart: {
height: 350,
type: 'line'
},
dataLabels: {
enabled: false
},
stroke: {
curve: 'smooth'
},
xaxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep']
},
range: {
xaxis: {
min: 4, // 起始索引为4
max: 8 // 结束索引为8
}
}
};
var chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();
在上面的示例中,range
选项的xaxis
对象中的min
属性和max
属性分别指定了要显示的数据的起始索引和结束索引。在这个例子中,我们显示了系列的最后5个元素。
需要注意的是,range
选项中的索引是基于xaxis.categories
数组的索引。所以,在设置range
选项之前,确保xaxis.categories
数组的长度大于要显示的数据的结束索引。
运行上述代码,将会得到一个显示了系列最后5个元素的ApexCharts图表。