Question

我正在使用 chartsJS 制作条形图。但是我希望 br 图表的条形图从“Y”轴突出。我认为我下面的代码可以做到这一点，但由于某种原因我无法让它工作。条从 x 轴突出。我想知道我哪里出错了。

<div class="hello">
        <canvas id="sChartSum2" width="750" height="350"></canvas>
        <script>
            var ctx = document.getElementById('sChartSum2').getContext('2d');
            var myChart = new Chart(ctx, {
                type: 'bar',
                axis: 'y',
                data: {
                    labels: ["L1", "L2", "L3", "L4", "L5", "L6"],
                    datasets: [{
                                axis: 'y',
                                label: 'My First Dataset',
                                data: [65, 59, 80, 81, 56, 55, 40],
                                fill: false,
                                backgroundColor: [
                                  'rgba(255, 99, 132, 0.2)',
                                  'rgba(255, 159, 64, 0.2)',
                                  'rgba(255, 205, 86, 0.2)',
                                  'rgba(75, 192, 192, 0.2)',
                                  'rgba(54, 162, 235, 0.2)',
                                  'rgba(153, 102, 255, 0.2)',
                                  'rgba(201, 203, 207, 0.2)'
                                ],
                                borderColor: [
                                  'rgb(255, 99, 132)',
                                  'rgb(255, 159, 64)',
                                  'rgb(255, 205, 86)',
                                  'rgb(75, 192, 192)',
                                  'rgb(54, 162, 235)',
                                  'rgb(153, 102, 255)',
                                  'rgb(201, 203, 207)'
                                ],
                                borderWidth: 1
                              }]
                },
                options: {
                    indexAxis: 'y',
                }
            });
        </script>
    </div>

Answer 1

您在选项中所做的应该适用于 v3，axis: 'y' 不是 chart.js 的选项，因为它对您不起作用我假设您使用的是 lib 的第 2 版，在这种情况下您有将您的 type 从 bar 更改为 horizontalBar

启用 chartsJS 条形图从 y 轴开始

1 个答案: