echarts做了一张饼图，由于图例太多结果惨不忍读，整体效果如下：

001

 

这个效果肯定不能看，图例太多了。修改后效果如下：

002

修改办法如下：legend的配置中添加type。

legend: {
        type: 'scroll', //分页
        bottom: 10,
        data: mdata
},

其它不用修改，这个特性是从3.7开始支持的。

 

 

配置说明

图例过多时，为 legend 设置 type: 'scroll' 即可开启分页/滚动显示，避免图例堆叠影响阅读。

  • type: 'scroll' 自 ECharts 3.7 起支持。
  • 可配合 top / bottom 调整图例位置。
  • 图例过多本质上是分类过细，必要时也可合并小类。

相关阅读