【方法1】echarts自身支持legend分页，找了好久，太赞了，注意echarts的图例滚动式v3.7.0版本新加的
http://echarts.baidu.com/examples/editor.html?c=radar2
//折线图
option = {title: {
text: 'Step Line'
},
tooltip: {
trigger: 'axis'
},
legend: {
type: 'scroll',
//y:bottom,
bottom: 10,
data: (function (){
var list = [];
for (var i = 1; i <=10; i++) {
list.push(i + 2000 + '');
}
return list;
})()
},
grid: {
left: '3%',
right: '4%',
bottom: '7%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [
{
name:'2001',
type:'line',
step: 'start',
data:[101, 101, 101, 101, 101, 101, 101]
},
{
name:'2002',
type:'line',
step: 'middle',
data:[112, 112, 112, 112, 112, 112, 112]
},
{
name:'2003',
type:'line',
step: 'end',
data:[123, 123, 123, 123, 123, 123, 123]
},
{
name:'2004',
type:'line',
step: 'start',
data:[134, 134, 134, 134, 134, 134, 134]
},
{
name:'2005',
type:'line',
step: 'start',
data:[145, 145, 145, 145, 145, 145, 145]
},
{
name:'2006',
type:'line',
step: 'start',
data:[156, 156, 156, 156, 156, 156, 156]
},
{
name:'2007',
type:'line',
step: 'start',
data:[167, 167, 167, 167, 167, 167, 167]
},
]
};
//series内的name要与legend的data数据一致
【方法2】
https://blog.csdn.net/danhuan/article/details/72831245