我想不出为什么它不会工作，接缝足够简单：

function update() {
  const durationget = $("#duration").val();
  $("#totalMilksaleChartfor7days, #totalMilksaleChartcurrentmonth, #totalMilksaleChartlastmonth, #totalMilksaleChart").hide();
  if (durationget == "currentmonth") {
    $("#totalMilksaleChartcurrentmonth").show();
  } else if (durationget == "lastmonth") {
    $("#totalMilksaleChartlastmonth").show();
  } else if (durationget == "currentyear") {
    $("#totalMilksaleChart").show();
  } else {
    $("#totalMilksaleChartfor7days").show();
  }
}

个字符

ApexCharts提供了一个API，允许您动态更新图表数据。

<button id="toggleButton">Toggle Chart</button>
<div id="chartContainer" class="chart-container">
 <div id="chart"></div>
</div>

<style>
 .chart-container {
   max-height: 0;
   overflow: hidden;
   transition: max-height 0.3s ease;
 }
</style>

<script>
function toggleChartContainer() {
   const chartContainer = document.getElementById("chartContainer");
   const isContainerVisible = chartContainer.style.maxHeight !== "0px";

   if (isContainerVisible) {
      // If the container is visible, hide it
      chartContainer.style.maxHeight = "0px";
   } else {
      // If the container is hidden, show it
      chartContainer.style.maxHeight = "500px"; // Set your desired height here
      // Call the function to render the chart (if it hasn't been rendered yet)
      renderChart();
   }
}

// Function to render the Apex chart
function renderChart() {
  const options = {
  // Your Apex chart options here
};
 const chartData = {
  // Your Apex chart data here
};

// Check if the chart has been initialized already
if (typeof chart === "undefined") {
// If not, create the chart
chart = new ApexCharts(document.querySelector("#chart"), options);
chart.render();
} else {
// If the chart has been initialized, update the data
chart.updateSeries(chartData);
}
}

// Event listener for the toggle button
document.getElementById("toggleButton").addEventListener("click", 
toggleChartContainer);
</script>

字符串