在用echarts做柱状图或者折线图的时候遇到了这样一个问题:当图例过多且条目固定时,默认将图例显示在上面时不美观。于是乎查找资料,找到了echarts设置图例位置的属性。
但是这样又出现了另外一个问题,图表的显示是根据外层的div的宽高来显示的,所以就出现了图例和图表重叠的问题,苦逼的我又查阅资料,找到了设置图表位置的属性。
具体设置如下:
定位图例的属性:
legend: {
orient: 'vertical',//垂直布局
x: 'left', //水平方向居左显示
y: 'center', //垂直方向居中显示
data:['累计销量','去年同期累计销量','计划销量','计划完成率','同比增减']//图例名称
},
设置图表位置的属性:
grid: {
left: '15%',//距离div左边的距离
right: '4%',//距离div右边的距离
bottom: '3%',//距离下面
containLabel: true
},
欢迎批评指正。