Highchart X-axis label too long

时间:2016-02-03 02:59:20

标签: javascript highcharts

Please refer the picture attached below. My X-Axis labels too long and Highchart managed to view only 3 characters. What code should add to view the entire label?

My highchart

            xAxis: {
                categories: []

            },

Solved

I added in "marginBottom: 70" and able to show full label. refer below.

    $(document).ready(function() {
        var options = {

            chart: {
                renderTo: 'container',
                type: 'column',

                marginBottom: 70,
                marginRight: 130

            },
            title: {
                text: 'All Gantries Instertions',
                x: -20 //center
            },
            subtitle: {
                text: '',
                x: -20
            },
            xAxis: {

                categories: [],

            },

2 个答案:

答案 0 :(得分:2)

您可以使用带有useHTML = true的标签格式化程序,并使用自定义类。

您的xAxis节点将如下所示。

       xAxis: {
            labels: {
                formatter: function () {
                    return '<span class="XYZ">' + this.value + '</span>';
                },
                useHTML: true
            }
        }

使用一些自定义css而不是XYZ来应用您的课程。

答案 1 :(得分:1)

您可以将useHTML设置为true并定义标签的宽度。此外,您可以增加spacingBottom参数。

bash update-repositories