EXTJS图表不显示x轴上的所有标记名称

时间:2013-03-19 23:26:21

标签: extjs charts extjs4 axis labels

我正在使用Ext JS 4.1.3开发一个应用程序。应用程序处理数据并根据数据显示图表。

问题是:
如果图表上有超过80-90个条目(在x轴上),则省略一些标记名称。因此,代替标记名称,它显示部分空位置。虽然还有很多空间。

以下是截图:

enter image description here

问题是:

  • 我已经将标记的字体缩小了。也许有办法减少标记之间的填充?
  • 如何强制ExtJs图表显示所有条目?我可以更改图表(或x轴)的设置以显示所有标记名称(无论条目数量是多少)吗?
  • 这个问题有其他解决方案吗?

谢谢!

UPD1。这与css类“x-hide-visibility”和hideMode有某种关联。

  • 如何禁用标签的hideMode?

UPD2。我找到了以下解决方案。但它使图表变慢(不重要,但......)。也许有人知道其他方案?必须有一种方法可以提前关闭选项('hideMode')。

for (var i = 0; i< chart.axes.items[0].labelGroup.items.length; i++){
    chart.axes.items[0].labelGroup.items[i].el.removeCls(' x-hide-visibility');
}

2 个答案:

答案 0 :(得分:1)

我遇到了同样的问题,并通过将这行css添加到样式表来解决隐藏的标签问题。

svg text.x-hide-visibility {visibility:inherit!important;}

如果系列或轴上有一些配置选项来控制此行为,那将是很好的。希望它适合你!

答案 1 :(得分:0)

我遇到了同样的问题。

请添加以下内容:

chrChart1.ChartAreas(0).AxisX.Interval = 1