Echarts图例数据太多实现滚动效果
Echarts图例数据太多实现滚动效果当我们引入echarts图表,当展示的数据项比较多的时候,尤其是在展示环形图或者是饼状图的时候,当数据项比较多,图例就会堆积到一起,显示的很乱,这时候就需要显示个翻页效果。下面是图例的设置legend: {type: 'scroll',// 设置图例翻页icon: 'rect',itemWidth: 12,// 图例图形宽度
·
Echarts图例数据太多实现滚动效果
当我们引入echarts图表,当展示的数据项比较多的时候,尤其是在展示环形图或者是饼状图的时候,当数据项比较多,图例就会堆积到一起,显示的很乱,这时候就需要显示个翻页效果。
下面是图例的设置
legend: {
type: 'scroll', // 设置图例翻页
icon: 'rect',
itemWidth: 12, // 图例图形宽度
itemHeight: 10,
orient: 'horizontal', // 图例横向排布
data: title, // title是一个列表,存着图例的数据
left: 15, // 图例位置
bottom: 8,
textStyle: {
color: '#fff',
fontSize: 12
},
pageIconColor: '#fff',
pageTextStyle: {
color: '#fff'
},
itemGap: 20
},

DAMO开发者矩阵,由阿里巴巴达摩院和中国互联网协会联合发起,致力于探讨最前沿的技术趋势与应用成果,搭建高质量的交流与分享平台,推动技术创新与产业应用链接,围绕“人工智能与新型计算”构建开放共享的开发者生态。
更多推荐
所有评论(0)