如何消除在高图中定义的条宽的条形图中的条之间的间隙

Question

我正在尝试使用定义的{pointWidth: 30}来消除Highcharts中条形图之间的间隙，使用{pointPadding: 0, groupPadding: 0, borderWidth: 0}无效。 （请参阅JSFiddle）

如何在没有差距的情况下获得以下结果：

谢谢。

Answer 1

在定义pointWidth之后，Highchart似乎无法计算x轴上的填充。参考 https://api.highcharts.com/highcharts/series.column.pointWidth。不确定是否限制Highchart。

尽管这不是完美的解决方案，但我尝试使用css3（scss）来定位栏。解决方案很奇怪。

请看看，希望您能提出比这个更好的主意。 https://jsfiddle.net/6f9yvcan/105

SCSS

$columns-list: 1 3 5 7 9 11 13;
$column-left-offset: 200px;
@each $col in $columns-list {
    $i: index($columns-list, $col);

    $column-left: (30px * $i) + $column-left-offset; 
    .highcharts-series:nth-child(#{$col}) {
      rect {       
       x: $column-left;
      }
    }

    .highcharts-data-labels:nth-child(#{$i}) .highcharts-data-label {
      background-color: red;
      left: ($column-left - 20px) !important;
    }
}