如何清除 apache Echart？我需要重新初始化它

Question

我在单个页面上有堆叠水平条形图，每个图表都会根据用户选择的内容（下拉选择）而变化。我有一个 ajax 调用来检索数据，因此数据会根据用户选择而变化并且是动态的。我在清除旧数据时遇到问题。如果没有数据，则应显示水平条形图。但它显示以前的数据。如果没有数据，它不会变空。基本上，我只想在每次选择后重新初始化图表并从头开始。我怎样才能做到这一点？

<script type = "text/javascript" >
    var series;
$("#sub_project3").change(function() {
    $.ajax({
        url: "<?php echo base_url("
        Manage_procurement_plan / load_bar_chart ");?>",
        type: "POST",
        data: {
            drop_value: $(this).val()
        },
        dataType: "text",
        cache: false,
        success: function(data) {
            series = data;
            var dom = document.getElementById("main");
            var myChart = echarts.init(dom);
            var app = {};
            var option;
            getBarGraph(series);

            function getBarGraph(data) {
                option = {
                    tooltip: {
                        trigger: 'axis',
                        axisPointer: {
                            type: 'shadow'
                        }
                    },
                    legend: {
                        top: '3%',
                    },
                    grid: {
                        top: '28%',
                        left: '3%',
                        right: '4%',
                        bottom: '3%',
                        containLabel: true,
                    },
                    xAxis: {
                        type: 'value',
                    },
                    yAxis: {
                        type: 'category',
                        data: ['Actual Avg', 'ADB Min Standard']
                    },
                    series: JSON.parse(data),
                };
                /*if (option && typeof option === 'object') {
                    
                    myChart.setOption(option);
                }*/
                myChart.setOption(option);

            }
        }
    });
}); 
</script>

Answer 1

每次进行新选择时，您都可以series在将新数据推入其中之前“重新初始化”列表（使其成为空列表）。因此，如果没有数据，则将series保持为空。

然后，您可以使用 更新图表notMerge = true。根据echarts 文档：

notMerge 可选。是否不与之前的选项合并。false默认情况下，意味着合并，请参阅组件合并模式中的更多详细信息。如果 true当前的所有组件都将被删除，并且新的组件将根据新选项创建。

myChart.setOption(option, true);