Question

我试图为我的Highchart柱形图设置最大列数，如此

xAxis: {
    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas', 'Kiwi'],
    tickAmount: 3
}

使用tickAmount阅读文档说明设置轴数量。

由于空间限制，我希望我的图表只显示三个xAxis。这需要动态发生，因此从阵列中删除项目不是一种选择。

这是我的jsfidddle http://jsfiddle.net/rjayako/mt4x95rd/1/

非常感谢任何帮助。

Answer 1

来自tickAmount文档：

此选项仅对线性轴有影响。日期时间，对数或类别轴不受影响。

您的轴是一个类别轴。

您可以尝试使用tickInterval和一些额外的计算来实现类似的效果：

var categories =  ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas', 'Peaches', 'Lemons', 'Apricots']
var tickAmount = 3

//best effort, for tickAmounts > categories.length / 2 it will show all ticks
var tickInterval = tickAmount > 1
    ? Math.floor((categories.length - 1) / (tickAmount - 1))
  : tickAmount == 1 ? categories.length : NaN

然后

xAxis: {
    categories: categories,
    tickInterval: tickInterval
}

http://jsfiddle.net/peterlgh7/6anq4p8s/

修改阅读完评论后，鉴于您不仅要隐藏刻度而且还要隐藏列，我在文档中找不到任何内容。我的建议仍然是预处理您的数据，即过滤它。您可以定期对其进行采样，类似于tickInterval的工作方式，或者您可以简单地采用前n个元素，因为它可能对您没有任何影响。你可以在这里看到两种方式：http://jsfiddle.net/peterlgh7/L9fa1hg9/

但这只是javascript，不涉及高级图表。

Answer 2

您可以设置tickInterval: n以使其跳过轴中的每个n项。

xAxis: {
    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'],
    tickInterval: 2
},

http://jsfiddle.net/mt4x95rd/2/

Answer 3

您可以使用xAxis.max属性设置可在x轴上显示的最大索引。类别索引从0开始，它们是后续整数。

xAxis: {
    categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'],
    max: 2
}

现场演示： http://jsfiddle.net/kkulig/q9p3b8hw/

API参考： https://api.highcharts.com/highcharts/xAxis.max

在高图列图表类型中设置最大列数量

3 个答案: