Усечение текста диаграммы Apex настроить

Я работаю над графиком Apex. Когда в массиве categories есть длинный текстовый элемент, диаграмма вершины не показывает весь текст, но показывает его часть, выполняя text-eclipse и показывая его с тремя точками, например: Department of Environmenta....

Можем ли мы настроить отображение всего текста? Было бы хорошо, если бы текст перешел на следующую строку below the first line, если он не помещается в той же строке.

Вот код

import React from "react";
import ReactApexChart from "react-apexcharts";

class ApexChart extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      series: [
        {
          name: "Progress",
          data: [64, 55, 21, 18, 76, 41, 44, 14, 66, 32]
        },
        {
          name: "Expenses (In thousound)",
          data: [53, 32, 42, 22, 29, 80, 16, 49, 78, 11]
        }
      ],

      options: {
        colors: ["#519ca5", "#2274A5"],
        plotOptions: {
          bar: {
            horizontal: true,
            dataLabels: {
              position: "top"
            }
          }
        },
        chart: {
          toolbar: {
            show: false,
          }
        },
        dataLabels: {
          enabled: true,
          offsetX: 0,
          style: {
            fontSize: "12px",
            colors: ["#fff"]
          }
        },
        stroke: {
          show: true,
          width: 1,
          colors: ["#fff"]
        },
        xaxis: {
          //   type: "datetime",
          categories: [
            "Department of Psychology",
            "Department of Natural Science",
            "Department of Environmental Science",
            "Department of Literature And Finance",
            "Department of Foreign Employement",
            "Department of Transport Management",
            "Department of culture media and sport",

          ]
        },
        legend: {
          position: "right",
          markers: {
            width: 24,
            height: 24,
            strokeWidth: 0,
            strokeColor: "#fff",
            fillColors: undefined,
            radius: 2,
            customHTML: undefined,
            onClick: undefined,
            offsetX: 0,
            offsetY: 0
          }
        }
      }
    };
  }

  componentDidMount() {
    fetch("http://my-json-server.typicode.com/apexcharts/apexcharts.js/yearly")
      .then(res => res.json())
      .then(res => console.log(res));
    this.setState({
      options: { ...this.state.options }
    });
  }

  render() {
    return (
      <div id="chart">
        <ReactApexChart
          height="100%"
          options={this.state.options}
          series={this.state.series}
          type="bar"
        />
      </div>
    );
  }
}

export default ApexChart;

А вот демонстрация