Highcharts重叠类别标签 [英] Highcharts overlapping category labels

问题描述

我需要关于xAxis类别标签问题的帮助。当所有类别标签都没有空间时，它们会挤在一起并相互重叠。

我已经搜索了解我是否可以找到某种方法来确保这一点没有发生，首先我寻找一个滚动解决方案，然后进行某种缩放，最后我尝试去找到staggerLines。

问题是，如果我要使用staggerLines，我需要根据我拥有的类别数量来设置值。如果我有10或更少，staggerLine值设置为1,11-20我希望它变成2,21-30我想将它设置为3等等。我不能简单地将它设置为3，因为有些时候它只是显示的几个类别，而且用staggerLines看起来不太好。

任何人都有如何解决这个问题的好建议？

解决方案

您根本不必使用类别。一般而言，类别可以很好地显示水果或名字 - 如何定义哪个名字应该显示，哪些不应该显示？苹果比香蕉更重要吗？ 然而，解决方案非常简单，使用xAxis标签格式化程序，看一看： http://jsbin.com/oyudan/27/edit

  xAxis：{
标签：{
 formatter：function（）{
 return names [this.value]; 
} 
} 
}，
  

I need help with a problem with category labels for xAxis. When there is no room for all the category labels, they get crammed together and overlap each other.

I have searched to see if I could find some way to ensure that this does not happen, first I looked for a scrolling solution, then some sort of zooming, and eventually I tried to go for staggerLines.

The problem is, if I am to use staggerLines, I need to set the value depending on the number of categories I have. If I have 10 or less, staggerLine value is set to 1, 11-20 I want it stet to 2, 21-30 I want to set it to 3 and so on. I can not simply just set it to 3, because some times it will be just a few categories shown, and that won't look good with staggerLines.

Anyone have a good suggestion for how to solve this?

解决方案

You don't have to use categories at all. In general categories are good to show e.g. fruits, or names - how to define which name should be displayed, and which shouldn't? Is apple more important than banana?

However, solution is pretty simple, using xAxis label formatter, take a look: http://jsbin.com/oyudan/27/edit

xAxis: {
  labels: {
    formatter: function(){
      return names[this.value];
    }
  }
},

这篇关于Highcharts重叠类别标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！