Почему chartjs обрезает график?

Question

[Владимир Голубь]

Хочу вывести диаграмму из 158 значений, но на 110 происходит обрезание.



Хотя сама сетка рисуется.

Но лейблы и графики обрезает.

Пробовал ставить v2 тоже самое, сейчас на 3й.

Конфиг:

<template>
  <div>
    <canvas id="myChart"></canvas>
  </div>
</template>

<script>
import { Chart, registerables } from 'chart.js3'
import ChartJsPluginDataLabels from 'chartjs-plugin-datalabels';

export default {
  props: ['items'],
  mounted() {
    var ctx = document.getElementById('myChart');

    const dataGraph = {
      labels: this.items.map(item => item['date']),
      datasets: [
        {
          data: this.items.map(item => item['actual'] || item['forecast'] || 0),
          backgroundColor: '#698ED1'
        }
      ]
    };

    const optionsGraph = {
      maintainAspectRatio: false,
      animation: {
        duration: 0
      },
      legend: {
        display: false,
      },
      scales: {
        x: {
          grid: {
            color: '#000'
          }
        },
        y: {
          ticks: {
            display: false
          },
          grid: {
            color: function(context) {
              return '#000';
            }
          }
        }
      },
      // plugins: {
      //   datalabels: {
      //     color: '#768CB7',
      //     font: {
      //       family: 'Roboto',
      //       size: '11',
      //       weight: '700'
      //     },
      //     anchor: 'end',
      //     align: 'top',
      //     textAlign: 'center',
      //     offset: '-3',
      //   }
      // }
    };

    Chart.register(...registerables);
    //Chart.register(ChartJsPluginDataLabels);

    var myChart = new Chart(ctx, {
      type: 'bar',
      data: dataGraph,
      options: optionsGraph
    });
  }
}
</script>

Answer 1

[Владимир Голубь]

Данная проблема будет исправлена в версии 3.4.0