条形图上的标签丢失

时间:2015-08-24 12:03:46

标签: highcharts

如何确保酒吧的所有标签都可见?此图表显示每个其他标签。另请注意,每个其他栏上都缺少数字标签。这是字体大小问题还是别的什么?

http://jsfiddle.net/brookssh/a0xdsc3q/

var chart = new Highcharts.Chart({
    chart: {
        renderTo: "chartContainer",
        defaultSeriesType: 'bar',
        height: 595
    },
    title: {
        text: '18 York Street Consumption (RankIt)',
        style: {
            color: '#484a4a',
            fontSize: '22px',
            fontFamily: 'Arial, Helvetica, sans-serif',
            fontWeight: 'bold'
        }
    },
    subtitle: {
        text: 'Saturday, August 15 2015 through Sunday, August 16 2015'
    },
    credits: {
        enabled: false
    },
    yAxis: {
        allowDecimals: false,
        title: {
            text: "Test",
            style: {
                color: '#0063A2',
                fontFamily: 'Arial, Helvetica, sans-serif',
                fontWeight: 'bold'
            }
        },
        plotLines: [{
            color: 'red', // Color value                            
            value: null, // Value of where the line will appear
            width: 2 // Width of the line    
        }],
        min: 0
    },
    xAxis: [{
        categories: ['9th Floor Total kWh', '9th Floor', '8th Floor Lighting Total kWh', '8th Floor', '7th Floor Lighting Total kWh', '7th Floor', '6th Floor Total kWh', '5th Floor Total kWh', '5th Floor', '4th Floor Total kWh', '4th Floor', '3rd Floor Total kWh', '3rd Floor', '26th Floor Total kWh', '26th Floor', '25th Floor Total kWh', '25th Floor', '24th Floor Total kWh', '24th Floor', '23rd Floor Total kWh', '23rd Floor', '22nd Floor Total kWh', '22nd Floor', '21st Floor Total kWh', '21st Floor', '20th Floor Total kWh', '20th Floor', '19th Floor Total kWh', '19th Floor', '18th Floor Total kWh', '18th Floor', '17th Floor Total kWh', '17th Floor', '16th Floor Total kWh', '16th Floor', '15th Floor Total kWh', '15th Floor', '14th Floor Total kWh', '14th Floor', '13th Floor Total kWh', '13th Floor', '12th Floor Total kWh', '12th Floor', '11th Floor Total kWh', '11th Floor', '10th Floor Total kWh', '10th Floor'],
        title: {

        },
        type: 'category',
        plotBands: [{
            color: '#DDECFF',
            from: 1439571600000,
            to: 1439744400000
        }],
        plotLines: [{
            color: 'grey', // Color value                            
            dashStyle: "dash",
            value: null, // Value of where the line will appear
            width: 0 // Width of the line    
        }],
    }, {
        labels: {
            rotation: -45,
            enabled: false
        },
        lineWidth: 0,
    }],
    exporting: {
        enabled: false
    },
    legend: {
        enabled: false
    },
    plotOptions: {
        series: {
            colorByPoint: true
        },
        spline: {
            enableMouseTracking: true,
            animation: {
                duration: 1500
            },
            marker: {
                enabled: false,
                states: {
                    hover: {
                        enabled: true,
                        symbol: 'circle',
                        radius: 5,
                        lineWidth: 1
                    }
                }
            }
        }

    },
    tooltip: {
        yDecimals: 2,
        formatter: function () {
            return tooltipFormat(this.x, null, this.y, yAxisTitle);
        }
    },
    series: [{
        data: [157, 169, 159, 173, 194, 203, 178, 144, 155, 411, 421, 275, 288, 266, 400, 214, 225, 142, 158, 112, 124, 114, 130, 112, 127, 134, 150, 107, 124, 143, 158, 85, 103, 99, 123, 174, 191, 327, 365, 221, 237, 241, 255, 310, 370, 133, 145],
        dataLabels: {
            enabled: true,
            color: '#000',
            style: {
                fontSize: '10px',
                verticalAlign: 'middle'
            }
        }
    }]

});

1 个答案:

答案 0 :(得分:4)

您可以使用then的{​​{3}}属性强制显示每个标签:

service

查看您的allowOverlap