Chartjs show labels and ticks in bar chart - Javascript Chart.js

Javascript examples for Chart.js:Bar Chart

  1. HOME
  2. Javascript
  3. Chart.js
  4. Bar Chart

Description

Chartjs show labels and ticks in bar chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <title>Chart.js 2.0.0-beta Play</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript">
    window.onload=function(){/* w  ww .ja v  a  2s.  c  om*/
   var ctx = document.getElementById("mybarChart");
   var barChart = new Chart(ctx, {
      type: 'bar',
      data: {
         labels: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
         datasets: [{
            label: 'My Chart',
            data: [2137680, 6282693, 805566, 2568163, 598599, 3189284, 599112, 926340, 5548295, 11847685, 66445, 5983242],
            backgroundColor: 'rgba(65, 142, 200, 0.2)',
            borderColor: 'rgba(65, 142, 200, 1)',
            borderWidth: 1
         }],
      },
      options: {
         scales: {
            xAxes: [{
                gridLines: {display:false}
            }]
         }
      }
   });
    }

      </script> 
   </head> 
   <body> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.12.0/moment.min.js"></script> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.0.0-beta2/Chart.min.js"></script> 
      <canvas id="mybarChart" width="470" height="200"> 
      </canvas>  
   </body>
</html>

Related Tutorials