Create a Dynamic Line Chart Using Chart js



chart js dynamic line card demo source code. it helps you to integrate the line chart in your website or admin panel. this chart helps you to show reports graphically. this is a canvas graphic chart that you can customize very easily. you can change the values of the chart dynamically




<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Chart Demo</title>
</head>
<body>
  <center> <h1>This is a demo Chart</h1> </center>
  
  <center>
      <div class="card_body">
        <canvas id="myChart"></canvas>
      </div>
  </center>
  
  <script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>
</body>
</html>                    
                  
                



.card_body{
  width: 700px;
  height: 400px;
}                
              



var ctx = document.getElementById('myChart').getContext('2d');
var chart = new Chart(ctx, {
    // The type of chart we want to create
    type: 'line',

    // The data for our dataset
    data: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'aug'],
        datasets: [{
            label: 'Total Revenue',
            backgroundColor: '#eeeeee',
            borderColor: 'green',
            data: [0, 10, 5, 2, 20, 30, 25, 47]
        }]
    },

    // Configuration options go here
    options: {}
});