如何在页面加载时设置ApexCharts高度，然后在滚动到视图中呈现图表

Question

我有一个带有一些ApexCharts的项目，它们工作得很好，但是我想知道如何渲染图表以足以设置页面加载时的高度，然后在滚动到视图中时在图表中设置动画。

var graphs = document.querySelectorAll('[data-graph]')

for(var i = 0; i < graphs.length; i++) {
    if (isScrolledIntoView(graphs[i])) {

        if (!graphs[i].classList.contains('has-animated')) {
            graphs[i].classList.add('has-animated')

            var data = JSON.parse(graphs[i].dataset.graph)

            var chart = new ApexCharts(graphs[i], data)

            chart.render()
        }
    }
}

• isScrolledIntoView是用于检查每个项目是否在视图中的功能。
• 将is-animated类设置为仅显示每个图形一次。
• 在CMS中设置了图表中的内容，因此数据已存储在图表div的data-graph属性中。