'Chart.js data won't work corresponding number in y-axis ! In the screenshots i indicate the part which i want to set from [0, 200, 400, 600, 800, 100]

$(function () {
        const ctx = document.getElementById('myChart');
        const myChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels: ['H14', 'H15', 'H16', 'H17', 'H18', 'H19', 'H20', 'H21', 'H22', 'H23', 'H24', 'H25', 'H26', 'H27', 'H28', 'H29', 'H30', 'R1', 'R2'],
                datasets: [{
                    label: 'true',
                    data: [218.43, 193.72, 260.02, 251.62, 901.7, 1292.25, 996.27, 873.68, 932.3, 1030.04, 1104.2, 2356.66, 2688.95, 2352.42, 3003.72, 3869.95, 6153.28, 7069.44, 12012.23, 14000, 12000, 9000, 8000, 6000, 4000, 2000, 0],
                    backgroundColor: [
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178',
                        '#003178'
                    ],
                  barThickness: 20,  // number (pixels) or 'flex'
                  maxBarThickness: 20 // number (pixels)
                }]
            },
           options: {
            legend: {
              display: false
                },
                
                tooltips: {
              callbacks: {
                    
                label: function(tooltipItem) {
                console.log(tooltipItem)
                  return tooltipItem.yLabel;
                }
              }
            }
          }
        });
        const ctx_2 = document.getElementById('myChart_sub');
          const myChart_sub = new Chart(ctx_2, {
          type: 'bar',
          data: {
          labels: ['H25', 'H26', 'H27', 'H28', 'H29', 'H30', 'R1', 'R2',],
            datasets: [{
            label: '',
            data: [92.18, 124.15, 69.21, 176.03, 227.12, 102.7, 228.71, 806.47],
            backgroundColor: [
                '#003178',
                '#003178',
                '#003178',
                '#003178',
                '#003178',
                '#003178',
                '#003178',
                '#003178'
            ],
            barThickness: 20,  // number (pixels) or 'flex'
            maxBarThickness: 20 // number (pixels)
        }]
    },
    
            options: {




     scales: {
          y: {
            max: 1000,
            min: 0,
            ticks: {
              stepSize: 200,
            },
          },
          x: {
            max: 1000,
            min: 0,
            ticks: {
              stepSize: 200,
            },
            afterBuildTicks: function(humdaysChart) {
              humdaysChart.ticks.shift();
            }
          },
        },
        legend: {
          display: false
            },
            
            tooltips: {
          callbacks: {
                
            label: function(tooltipItem) {
            console.log(tooltipItem)
              return tooltipItem.yLabel;
            }
          }
        }
      }
    
    });
});


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source