Tengo un gráfico de barras horizontales apiladas en una sola página, y cada gráfico cambia según lo que seleccione el usuario (selección desplegable). Tengo una llamada ajax que recupera los datos, por lo que los datos varían y son dinámicos según la selección del usuario. Tengo un problema al borrar los datos antiguos. Si no hay datos, debería mostrar un gráfico de barras horizontales. Pero muestra datos anteriores. no se vacía si no hay datos. Básicamente, solo quiero, después de cada selección, reiniciar el gráfico y comenzar desde cero. ¿Cómo puedo hacer eso?
<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>Cada vez que realiza una nueva selección, puede 'reinicializar' su series (convertirla en una lista vacía) antes de insertar nuevos datos dentro de ella. Entonces, si no hay datos, la series permanecerá vacía.
Luego, puede actualizar su gráfico usando notMerge = true . De acuerdo con echarts doc :
no fusionar Opcional . Si no fusionarse con la opción anterior.
falsede forma predeterminada, significa fusionar; vea más detalles en Modos de fusión de componentes. Si estrue, se eliminarán todos los componentes actuales y se crearán nuevos componentes de acuerdo con la nueva opción .
myChart.setOption(option, true);