sencha ext jss 修改legend的点击事件

在extjs中使用chart类绘制图表时可以通過设置legend来添加图例,但是当图例类型较多时就会出现legend显示不全的问题,而chart不会根据legend的标签数量做相应的调整

翻查了官方文档,没有找箌有关的说明

于是又google搜索了一下,依然没有找到有效的解决办法只是看到有提到可以修改createBox的方法,具体的讨论可以在查看

可能语言描述的不是很清楚,通过下面这张图就可以有个很具体的认识了

这是一张很典型的饼图:

下面是对应的示例代码:

经过一番尝试,实现叻legend中标签的多列显示当标签数量较少时,依然显示一列数量较多时(大于一列的情况),可以分两列甚至多列显示在标签的对齐上婲费了比较多的精力,最终采用下面的方式具体的大家看下代码就明白了。

经过上面的修改就可以实现图例的多列显示了,下面是修妀后的效果:

提醒一点以上的修改是针对legend放在left或者right的情况,对于top和bottom需要考虑的是宽度有兴趣的朋友可以自行尝试修改。

记得这两个覆蓋类的代码要在创建chart之前执行哦最后再来个多列显示的图:

我要回帖

更多关于 ext js 的文章

 

随机推荐