是的,ApexCharts支持Y轴平移。您可以使用chart.updateOptions()方法动态更新图表选项。以下是一个包含Y轴平移的代码示例:
// 定义数据
const seriesData = [{
name: 'Series 1',
data: [45, 52, 38, 24, 33, 26, 19, 34]
},
{
name: 'Series 2',
data: [35, 41, 62, 42, 32, 41, 66, 64]
}
];
// 定义并渲染图表
const chart = new ApexCharts(document.querySelector("#chart"), {
series: seriesData,
chart: {
height: 350,
type: 'line'
},
dataLabels: {
enabled: false
},
title: {
text: 'Y轴平移示例'
},
xaxis: {
categories: ['01 Jan', '02 Jan', '03 Jan', '04 Jan', '05 Jan', '06 Jan', '07 Jan', '08 Jan']
},
yaxis: {
title: {
text: 'y轴标题'
}
},
tooltip: {
shared: true,
intersect: false
},
responsive: [{
breakpoint: 768,
options: {
chart: {
height: 250
}
}
}]
});
chart.render();
// 添加Y轴平移和动态更新
document.querySelector("#pan-y-axis").onclick = function() {
chart.updateOptions({
yaxis: {
pan: {
enabled: true,
mode: "xy"
}
}
});
};