option: {
legend: {
data: ['邮件营销', '联盟广告', '视频广告'],
textStyle: { fontSize: 16 }
},
tooltip: {//工具提示信息
trigger: 'axis'
},
grid: {// 类似于position定位;调整图表在容器中的位置
left: '4%',
right: '4%',
bottom: '3%',
containLabel: true,//防止标签溢出:标签长度动态变化时,可能会溢出容器或者覆盖其他组件
},
xAxis: {
type: 'category',
data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
boundaryGap: false,
axisLabel: {
interval: 1,//设置横轴刻度,横轴信息全部显示为0
rotate: 40,//角度倾斜显示
}
},
yAxis: {
type: 'value',
},
series: [
{
data: [120, 132, 101, 134, 90, 230, 210],
name: "邮件营销",
smooth: true,//设置曲线
type: "line",
connectNulls: false,//是否连接空值点
itemStyle: {
normal: {
color: '#4562FF', //改变折线点的颜色
lineStyle: {
color: '#4562FF' //改变折线颜色
}
}
}
},
{
data: [220, 182, 191, 234, 290, 330, 310],
name: "联盟广告",
smooth: true,
type: "line",
connectNulls: false,
itemStyle: {
normal: {
color: '#DC4C40', //改变折线点的颜色
lineStyle: {
color: '#DC4C40' //改变折线颜色
}
}
}
},
{
data: [150, 232, 201, 154, 190, 330, 410],
name: "视频广告",
smooth: true,
type: "line",
connectNulls: false,
itemStyle: {
normal: {
color: '#9EDF7F', //改变折线点的颜色
lineStyle: {
color: '#9EDF7F' //改变折线颜色
}
}
}
}
]
}
echarts绘制三条颜色不同的曲线统计图,并设置其相关属性
最新推荐文章于 2024-03-07 11:26:07 发布