如何强制highcharts显示每个x轴标签而不考虑间距限制？ [英] How can I force highcharts to show every x-axis label regardless of spacing constraints?

问题描述

我想展示每个x轴标签，并且您可以看到它只显示其他每一个标签：

jsfiddle.net/f48cjf01/2/rel =nofollow> http://jsfiddle.net/f48cjf01/2/

相关代码：

  xAxis：{
类别：_.pluck（_mainData，number）
，labels： {
 rotation：290 
，step：1 //显示每个tick而不管间距
，align：'right'
} 
} 
  

我需要做什么才能显示每个勾号？ （我知道这里可能看起来很丑陋，考虑到这里有多少空间......但我仍然想强制它）

解决方案

一个解决方案是使用 tickPositioner 函数并指定每一个索引：



  xAxis：{
 tickPositioner：function（）{
 var result = []; 
 for（i = 0; i< _mainData.length; i ++）
 result.push（i）; 
返回结果; 
 
 
  

请参阅这个JSFiddle示例。你可以在使用它的时候删除 xAxis.labels.step 。



起初 tickInterval 看起来比较容易，但不幸的是，由于以下提示无效：



如果tickInterval太密Highcharts可能会删除勾号。




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)

解决方案

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.

这篇关于如何强制highcharts显示每个x轴标签而不考虑间距限制？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！