【问题标题】:how to adjust distance between to bars in bar chart highchart如何调整条形图highchart中条形之间的距离
【发布时间】:2021-12-14 09:57:43
【问题描述】:

highchart issue screenshot

我想调整 highhcart 条形间距,我想消除两个条形图上的间隙和重叠问题

【问题讨论】:

  • 您需要显示代码,请显示您尝试过的内容并显示您的问题。

标签: javascript angular highcharts react-highcharts angular-highcharts


【解决方案1】:

您可以使用groupPadding 属性控制间隙。要删除一组中两列之间的空格,请将pointPaddingborderWidth 设置为0。

plotOptions: {
    series: {
        borderWidth: 0,
        groupPadding: 0.1,
        pointPadding: 0
    }
}

现场演示: http://jsfiddle.net/BlackLabel/uhkfj93w/

API 参考:

https://api.highcharts.com/highcharts/series.bar.pointPadding

https://api.highcharts.com/highcharts/series.bar.groupPadding

【讨论】:

  • 在增加组填充后,它会减小条形图的大小@ppotaczek
  • 嗨@Juberkhan Pathan,所以,你需要增加chart.height。示例:jsfiddle.net/BlackLabel/vkw02s35