Chartjs-Chart.js how to set start and end values to plot

by

0👍

Yes possible, check the options provided for (scale) chart below :

var ctx = $("#graphTest").get(0).getContext("2d");


var options = {
      barShowStroke: false,
      scaleShowGridLines: true,
      scaleOverride: true,
      scaleStartValue: 1,
      caleStepWidth: 1,      
      responsive: true,
      barBeginAtOrigin: true
    };
    
var data = {
labels: [10,9,8,7,6,5,4,3,2,1],
datasets: [
    {
        label: "My First dataset",
        backgroundColor: [
            'rgba(255, 99, 132, 0.2)',
            'rgba(54, 162, 235, 0.2)',
            'rgba(255, 206, 86, 0.2)',
            'rgba(75, 192, 192, 0.2)',
            'rgba(153, 102, 255, 0.2)',
            'rgba(255, 159, 64, 0.2)'
        ],
        borderColor: [
            'rgba(255,99,132,1)',
            'rgba(54, 162, 235, 1)',
            'rgba(255, 206, 86, 1)',
            'rgba(75, 192, 192, 1)',
            'rgba(153, 102, 255, 1)',
            'rgba(255, 159, 64, 1)'
        ],
        borderWidth: 1,
        data: [2,6,5,8,7,3,2],
    }
]
};


var myBarChart = new Chart(ctx, {
    type: 'horizontalBar',
    data: data,
    options: options
});

      
        
    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.js"></script>
<canvas id="graphTest" width="400" height="190" style="padding-left:10px; padding-right:10px;"></canvas>

Leave a comment