欢迎加入站点基地设计开发交流群:30720409
详细内容
echarts开发概要
发布日期:2021-12-18     点击:256     字体:[ ]

1.饼状图


option = {
tooltip: {
trigger: 'item'//鼠标悬停,显示提醒信息
   },
legend: {//图例,各个颜色表达数据的说明
show:false,
top: '5%',
left: 'center'
   },

2.柱状图

yAxis: {//y轴
type: 'category',
data: ['电磁灶', '洗碗机', '油烟机', '蒸柜', '电冰箱', '烤箱'],//y轴上的文字
inverse: true,
animationDuration: 1,
animationDurationUpdate: 1000,
max: 6, // only the largest 3 bars will be displayed
splitLine: {show: false},//y轴的横线
axisLabel: {
formatter: '{value}',
color: val => '#fff'

}//y轴文字设置

},

series: [//数据

{

label: {//数据块上的文字提示
show: true,
position: 'right',
valueAnimation: true,
fontStyle:'normal',
color:'#fff'

},

itemStyle: {//数据条渐变色
normal: {//颜色渐变函数 前四个参数分别表示四个位置依次为左、下、右、上
       color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{offset: 0, color: '#006EFF'},
{offset: 0.5, color: '#188df0'},
{offset: 1, color: '#4CFFFF'}
]),
barBorderRadius: 5
   }

}





用户评论
昵称 
内容  *
验证码   
   
Copyright © 2010 zdbase.com All Rights Reserved. 苏ICP备15039389号-1 可人软件设计