如何在条形图中对齐条形图 - Chart.js

问题描述 投票:0回答:1

我想把条形图向左对齐,但我还没有找到任何东西!如果只有一个条形图的数据,那么它将呈现在图表的中心,而我想把它呈现在左边!我想把条形图向左对齐,但我还没有找到任何东西。

enter image description here

javascript chart.js
1个回答
1
投票

你可以添加一些假条目到 data.labels.

data: {
  labels: ["A", "", "", ""],

请看下面的可运行代码片段。

new Chart("chart", {
  type: "bar",
  data: {
    labels: ["A", "", "", ""],
    datasets: [{
      label: "My Dataset",
      data: [1],
      backgroundColor: "rgba(255, 99, 132, 0.2)",
      borderColor: "rgb(255, 99, 132)",
      borderWidth: 1
    }]
  },
  options: {
    scales: {    
      yAxes: [{
        ticks: {
          min: 0,
          max: 1,
          stepSize: 1
        },
        gridLines: {
          drawOnChartArea: false
        }
      }],
      xAxes: [{
        gridLines: {
          drawOnChartArea: false
        }
      }]
    }
  }
});
canvas {
  max-width: 200px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="chart" height="200"></canvas>
© www.soinside.com 2019 - 2024. All rights reserved.