删除栏之间的列间距高图

Question

嗨有人可以帮我解决如何删除高图中堆栈栏之间的间距。

栏之间的空格更多

下面是我用于渲染图表的代码。 所以在x轴上我尝试添加风格，但它仍然没有按照期望工作

$('#tempstack').highcharts({
                            chart: {
                                type: 'bar',
                                backgroundColor: 'transparent'
                            },
                            title: {
                                text: 'Forms wise progress'
                            },                                
                            xAxis: {
                                categories: stkTemplateName,
                                startOnTick: false,
                                labels: {
                                    rotation: 0,
                                    useHTML: true,
                                    x: 0,
                                    y: 30,
                                    style: {
                                        color: '#000',
                                        font: '12px roboto',
                                        top: '0px',
                                        right: '10px',
                                        'margin-bottom': '0px',
                                        paddingLeft: '0px',
                                        paddingRight: '0px',
                                        paddingTop: '0px',
                                        paddingBottom: '0px',

                                    },

                                    step: 1
                                },
                                lineWidth: 0,
                                minorGridLineWidth: 0,
                                gridLineWidth: 0,
                                lineColor: 'transparent',
                                minorTickLength: 0,
                                tickLength: 0,
                                pointWidth: 0.1

                            },
                            yAxis: {
                                gridLineWidth: 0,
                                min: 0,
                                title: {
                                    text: ''
                                },
                                gridLineColor: '#ffffff',
                                labels: {
                                    enabled: false

                                },
                                minorGridLineWidth: 0


                            },

                            plotOptions: {
                                bar: {
                                    pointPadding: 0,
                                    borderWidth: 0,

                                },

                                series: {
                                    stacking: 'normal',
                                    pointWidth: 20,
                                    dataLabels: {
                                        enabled: true,
                                        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
                                    }
                                }

                            },
                            series: [{
                                name: 'Yet-toStart',
                                data: stkYetToStart
                            }, {
                                name: 'Completed',
                                data: stkCompleted
                            }, {
                                name: 'Inprogress',
                                data: stkInProgress
                            },
                             {
                                 name: 'Ongoing',
                                 data: stkOnGoing
                             }],

                        });

Answer 1

您可以通过减少groupPadding属性来减小条形之间的空间 - 同样，您设置了点宽度，如果修复了它，您将无法更改空间。

plotOptions: {
  bar: {
    pointPadding: 0,
    borderWidth: 0,
    groupPadding: 0.01
},

示例：https://jsfiddle.net/2c74x5jv/1/