Chartjs-ChartJS – change chart type by changing y-axis Label

by

0👍

The sample code isn’t complete, but what about the idea of drawing both the charts and hiding one?

I see jQuery is included already so I’ll be using that library.

<div style="height:100px; width:400px">
  <canvas id="myChart1" style="border: 1px solid #ccc; width:100%; height:100%;"></canvas>
  <canvas id="tempChart1" style="border: 1px solid #ff0000; width:100%; height:100%;"></canvas>
</div>
<button id='temperature'>Temperature</button>

<script>
$(function() {
   $("#tempChart1").hide();
   $("#temperature").on('click', function() {
      $("#tempChart1").toggle();
      $("#myChart1").toggle();
   });
});
// The rest of your code to show the charts
</script>

What this will do is give you the flexibility to craft your charts correctly then just toggle in jQuery which adds a style of display none. I did add a height and width to the canvas tags for my testing because the button would be covered otherwise.

Leave a comment