固定chart.js中条形图的Y轴高度? [英] Fix the height of Y-Axis of Bar chart in chart.js?

问题描述

要求:我正在使用chart.js.在条形图中，我要固定Y轴的高度.有任何属性或技巧可以做到这一点吗?

Requirement: I am working with chart.js. In Bar chart, I want to fix the height of Y-Axis. Is there any attribute or hack to do this?

推荐答案

如果要控制图表的高度，可以更改画布的高度

If you want to control the height of the chart you can change the height of the canvas

<canvas id="statement" height="100px"></canvas>

或者如果您想更改y轴值的高度，请尝试以下操作.下面将确保条形的最大大小为25000，每一步为5000，回调将分别标记为5k，10k，15k，20k，25k

or if you want to change the height of y-axis values try below. Below will make sure the maximum size of the bar is at 25000,and each step to be at 5000 and the callback will label each as 5k,10k,15k,20k,25k

 var chartConfig = {
         type: 'bar',
         data: data,
         options: {
             scales: {
                 yAxes: [{
                     display: true,
                     gridLines: {
                         color: "rgb(210,210,211)"
                     },
                     ticks: {
                         max: 25000,
                         min: 0,
                         stepSize: 5000,
                         beginAtZero: true,
                         padding: 20,
                         callback: function(value, index, values) {
                             return value / 1000 + "k";
                         }
                     }
                 }]
             }
         }

这篇关于固定chart.js中条形图的Y轴高度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！