chart.js labels

Hi @ivanradojevic

According to ChartJs documentation, you may try forcing the Time Unit of the corresponding Axis to the unit that you want, in this case, week:

var chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        scales: {
            xAxes: [{
                type: 'time',
                time: {
                    unit: 'week'
                }
            }]
        }
    }
});

For more options, check the docs: https://www.chartjs.org/docs/latest/axes/cartesian/time.html#time-units

Thank you, but it does not work. I have a blank page, the graphic is completely lost.

@ivanradojevic please consider that it's an example extracted from documentation, that probably doesn't have anything to do with your case, as you didn't posted any code.

So, you have to adapt that example to your needs.

If you post your configuration, maybe I could help you

$(function () {

    var areaChartCanvas = $('#areaChart').get(0).getContext('2d')

    var areaChartData = {
      labels  : [
      @foreach ($result as $key => $value)
                  "{{ $key }}",				//30 dates
      @endforeach
                ],
      datasets: [
        {
          label               : 'Value',
          backgroundColor     : 'rgba(60,141,188,0.9)',
          borderColor         : 'rgba(60,141,188,0.8)',
          pointRadius          : false,
          pointColor          : '#3b8bba',
          pointStrokeColor    : 'rgba(60,141,188,1)',
          pointHighlightFill  : '#fff',
          pointHighlightStroke: 'rgba(60,141,188,1)',
          data                : [
       @foreach ($result as $key => $value)
                  "{{ $value }}",	//30 values
       @endforeach
          ]
        },       
      ]
    }

    var areaChartOptions = {
      maintainAspectRatio : false,
      responsive : true,
      legend: {
        display: false
      },
      scales: {
        xAxes: [{
         

 gridLines : {
            display : false,
          },
          

     

        }],
        yAxes: [{
          gridLines : {
            display : false,
          }
        }]
      }
    }

    
    var areaChart       = new Chart(areaChartCanvas, { 
      type: 'line',
      data: areaChartData, 
      options: areaChartOptions
    })




 });