减少分组类别highcharts的x轴标签区域高度

时间:2015-06-22 13:16:38

标签: javascript highcharts

由于存在大量空白空间,我怎么能减少x轴上的单元格高度。我已经使用了x轴groups-categories.js插件。正如你在图片中看到的那样,x-Axis上的灰线太长并占据了我的图表容器的太多空间。 下面是我用于图表的代码:

xAxis: {
                categories: [{
                    name: "Year 7",
                    categories: [1, 2, 3, 4]
                }, {
                    name: "Year 8",
                    categories: [1, 2, 3, 4]
                }, {
                    name: "Year 9",
                    categories: [1, 2, 3, 4]
                }, {
                    name: "Year 10",
                    categories: [1, 2, 3, 4]
                }, {
                    name: "Year 11",
                    categories: [1, 2, 3, 4]
                }],
                drawHorizontalBorders: false,
                labels: {
                    rotation: 0,
                    groupedOptions: [{
                        y: 4,
                        style: {
                            fontSize: '5.5px',
                            padding: 0
                        }
                    }],
                    y: 7,
                    style: {
                        fontSize: '5.5px',
                        padding: 0
                    }
                },
                plotLines: [{
                    color: '#5DA06E',
                    width: 2,
                    value: l
                }, {
                    color: '#5DA06E',
                    width: 2,
                    value: m
                }],
                min: m + 0.5,
                max: l - 0.5
            },

            yAxis: [{
                gridLineWidth: 0,
                labels: {
                    enabled: false
                },
                title: {
                    text: null
                },
                min: 0,
                max: 1000
            },
                {
                    gridLineWidth: 0,
                    title: {
                        text: false
                    },
                    labels: {
                        align: 'left',
                        x: 5,
                        formatter: function () {
                            var value = change[this.value];
                            return value !== 'undefined' ? value : this.value;
                        },
                        style: {
                            font: '8px arial'
                        }
                    },
                    tickPositions: [0, lines[0][1], lines[1][1], lines[2][1], lines[3][1], lines[4][1], lines[5][1], lines[6][1], lines[7][1], lines[8][1]],
                    gridLineColor: 'transparent',
                    opposite: true,
                    min: 0,
                    max: 1000
                }],

enter image description here

0 个答案:

没有答案