来源:https://blog.csdn.net/david_jiahuan/article/details/80096922
案例一
项目中现有样式:
客户需求:将图例分为两列,并且上下两列的图例要对齐:
==================================================
具体思路:将原有的一个 legend,分成7个小 legend 显示(形容的可能不太形象,下面看代码吧):
(1)原先的代码:
legend: {
orient: 'horizontal',
top:'8%',
right:'0%',
data: ['0-5分钟','5-15分钟','15-30分钟','30-60分钟','60-120分钟','120-240分钟','大于240分钟'],
textStyle:{
fontSize: difSize_title,
color:'#fff'
}
}
(2)修改后的代码:
legend:[
{
orient: 'horizontal',
x : '5%',
y : '10%',
align: 'left',
data: ['0-5分钟'],
textStyle:{
fontSize: difSize_legend,
color:'#fff'
}
},{
orient: 'horizontal',
x : '30%',
y : '10%',
align: 'left',
data: ['5-15分钟'],
textStyle:{
fontSize: difSize_legend,
color:'#fff'
}
},{
orient: 'horizontal',
x : '55%',
y : '10%',
align: 'left',
data: ['15-30分钟'],
textStyle:{
fontSize: difSize_legend,
color:'#fff'
}
},{