Диаграмма не заполняет ширину муравейника, даже с нулевым полем и отступом

Question

Как видно из рисунка ниже, диаграмма не может использовать 100% ширины строки antd. Я попытался установить ширину на 100% и window.innerWidth, но ни один из них не работал.

Диаграмма построена с использованием response-chartjs-2, который является тонкой оболочкой файла chart.js, и я пока не нашел никакой полезной информации из их документации.

Я также обнаружил эту отзывчивую опцию Chart.js - Диаграмма не заполняет контейнер , но мои пакеты являются самыми последними версиями, когда отмечены (response-chartjs-2@2.7.6 и chart.js@2.8. 0).

Я уже некоторое время ломаю голову над этим, и я не уверен, где искать ключи. Если вы знаете что-то об этом, пожалуйста, сообщите мне, большое спасибо!

Вот параметры, которые я использовал для гистограммы:

var options = {
  scales: {
    yAxes: [{
      ticks: {
        beginAtZero: true,
        min: 0,
        maxTicksLimit: 5
      },
      gridLines: {
        display: true
      }
    }],

    xAxes: [{
      barPercentage: 0.7,
      gridLines: {
        display: false
      },
      offset: true,
      type: "time",
      time: {
        unit: "day",
        stepSize: 1
      }
    }]
  },
  maintainAspectRatio: true
};

Метод визуализации (я использую React):

render() {
      return (
        <Bar
          data={this.state.chartData}
          width={this.state.appWindow.width}
          height={this.state.appWindow.width*0.5}
          options={this.changeDateOptions(options)}
          legend={legend}
        />
      )
    //}
  }

Стиль, используемый для муравейника:

const rowStyle = {
  width: '100%',
  display: 'flex',
  flexFlow: 'row wrap',
};

И картинка, показывающая, как диаграмма не заполняет 100% ширины: