Echarts图表如何解决legend数量过大导致遮挡图表

设置后可以让legend设置为一行显示，通过箭头进行上下页切换。

解决echarts图表legend文本太长；echarts图表的图例legend省略号显示

Echarts图表legend过多被遮挡

echarts的官网地址 上面的例子只能满足一些简单的需求，复杂的设计的话，仔细研究它的每个属性 在公司实习，突然要修改一个图例太多的显示问题，如下图： 原来以为又什么属性可以直接设置，后来研究了好一会好像并没有； 最后我的解决方案就是：放一个大一点的div装这个chart，然后dataZoom、legend等的位置慢慢调整，比如设置bottom、top的大小。 不过这样的坏处就是，...

<template> <ve-line :legend-visible="true" :toolbox="toolbox" :after-config="afterConfig" :data-empty="dataEmpty" :loading="loading" /> </template&gt...

问题： echarts图例太多，实在太占用空间，遮挡图表，又无法移动legend层。当屏幕小，满屏幕都是图例呀。。。如下图，头疼。 翻阅echarts相关文档，百度，Q群等途径寻找解决方法，都没有得到想要答案。鼓起勇气尝试修改源码。 开始的想法是：右边一列，不换行显示，出现滚动条，可以向下滚动。后来研究了echarts源码，觉得在canvas上加滚动条有点困难，所以选择了 向下翻页 的方式。

在使用echarts 2.0的过程中发现legend过多没有分页的情况    经百度各种查没有查到想要的效果  因此自己动手扩展了一个效果，现在发布出效果  如果有问题可以问我 在调试echarts源码过程中发现有判断legend到底部放不下然后另起一排的逻辑效果，因此我就延续用了此逻辑 ，在此逻辑的基础上，判断我自己的出现分页的属性是否为true，如果是true就调用自己的方法进行分页

【代码】echarts 折线图 legend太多与图重叠。

echart的legend过多

legend: { itemHeight: 12, //圆点大小 itemWidth: 12, width: "70%", itemGap: 29, type: "scroll",//这句 icon: "circle", top: 5, right: "center", textStyle: { //图例文字的样式 color: "#fff", fontSize: 14 }

在我们使用图表饼图的时候会发现因为数据太多导致页面的布局发现重叠或者不好看，比如label的文字太长了，legend的数量太多了等一些问题，所以今天我们就来聊聊遇到这些问题的是可以通过那些设置来进行改进。legend的数量太多需要进行分页处理的方法，就是给legend的添加一个。分页信息的文字样式的修改，就是正常的css样式属性，只是记得要用驼峰命名。下面是处理文字太长的行数，这里设置的是超过8个字就进行换行。分页图标箭头的设置，可以修改，可以用原本的箭头模式。的属性，就可以实现分页的效果。

echarts legend legend太多 legend太多显示分页