调整图表高度(高图)

时间:2019-12-18 09:44:21

标签: charts highcharts

我正在尝试将图表的高度(高图)调整为150像素。图表的最高数据点的高度应为150px,而其他数据点的百分比应为这150px。我的问题是,最高的条形图始终始终具有110px,120px或有时150px的高度。有人知道如何解决这个问题吗?

Screenshot of the chart

我的JSON:

chart: {
     type: 'column',
     className: 'chart-wrapper',
     spacing: [0, 0, 0, 0],
     margin: [0, 40, 0, 40],
     height: 450,
},
credits: {
    enabled: false
},
series: [
    {
         name: 'Gains',
         type: undefined,
         data: [[1, 1], [2, 1], [3, 12], [4, 1], [5, 1], [6, 1], [7, 1], [8, 1]],
         // data: data,
         color: '#63CCA6',
         borderRadius: 4,
         maxPointWidth: 10,
         pointPadding: 0
     }
],
legend: {
     enabled: false,
},
title: {
     text: null
},
yAxis: {
     gridLineColor: 'transparent',
     className: 'axis-y',
     minPadding: 0,
     maxPadding: 0,
     height: 150,
     top: 196,
     min: 0,
     title: {
          text: null
     },
     labels: {
          enabled: false
     },
},
xAxis: {
     tickLength: 0,
     className: 'axis-x',
     categories: dates,
     crosshair: {
          className: 'crosshair',
          dashStyle: 'Dash',
          snap: false,
          width: 1
     },
     labels: {
          useHTML: true,
          autoRotation: [0],
          step: 2,
          formatter: function () {
               return moment(this.value).format('MM/YYYY');
          },
     },
}

1 个答案:

答案 0 :(得分:0)

您需要设置max并禁用endOnTick选项:

yAxis: {
    height: 150,
    endOnTick: false,
    max: 12,
    ...
}

实时演示: http://jsfiddle.net/BlackLabel/12r6z4j9/

API参考:

https://api.highcharts.com/highcharts/yAxis.max

https://api.highcharts.com/highcharts/yAxis.endOnTick