How can I force highcharts to show every x-axis label regardless of spacing constraints?

北慕城南 提交于 2019-12-22 08:08:12

问题


I'd like to show every x-axis label, and you can see it's only showing every other one:

http://jsfiddle.net/f48cjf01/2/

The relevant code:

xAxis: {
    categories: _.pluck(_mainData, "number")
    , labels: {
         rotation: 290
         , step: 1 //show every tick regardless of spacing
         , align: 'right'
    }
}

What do I need to do to show every tick? (I know it may look ugly here considering how little space there is...but I'd like to force it nonetheless)


回答1:


One solution is to use a tickPositioner function and specify every single index:

xAxis: {
    tickPositioner: function() {
        var result = [];
        for(i = 0; i < _mainData.length; i++)
            result.push(i);
        return result;
    }
}

See this JSFiddle example. You can remove xAxis.labels.step when using this.

At first tickInterval looks easier, but unfortunately doesn't work because of the following note:

If the tickInterval is too dense for labels to be drawn, Highcharts may remove ticks.



来源:https://stackoverflow.com/questions/30061624/how-can-i-force-highcharts-to-show-every-x-axis-label-regardless-of-spacing-cons

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!