保持 highcharts 堆叠列borderWdith 但消除堆叠间隙

【问题标题】：keeping highcharts stacked columns borderWdith but removing stacking gap保持 highcharts 堆叠列borderWdith 但消除堆叠间隙
【发布时间】：2016-10-25 03:57:36
【问题描述】：

如何将 highcharts 列的边框宽度保持为 1 像素，同时移除堆叠的边框宽度？

plotOptions: {

        series: {
            pointPadding: 0,
            groupPadding: 0,
            borderWidth: 1
        },
        column: {
            stacking: 'normal',
            borderWidth: 0 // this will not work
        }
    },

【问题讨论】：

我只是删除边框并调整pointPadding

标签： javascript jquery charts highcharts

【解决方案1】：

您可以保持borderWidth 等于0 并添加将分隔列的白色绘图线。

xAxis: {
        categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'],
        plotLines: [{
            value: 0.5,
          width: 1,
          color: 'white',
          zIndex: 5
        },

示例：http://jsfiddle.net/v6fwwLkq/

该解决方案的缺点是它覆盖了水平网格线（创建 1 px 空间）。如果您担心，则可以更改绘图线的高度（需要包装 Highcharts 代码）或添加具有适当高度的自定义垂直线。

【讨论】：