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屋!