2023.1.6今天我学习了如何使用echarts line折线图,效果如:
首先是给容器设置id,宽高
然后是
var lineTwoChart = echarts.init(document.getElementById('lineTwo'));
lineTwoChart.setOption({
title: {
text: '总体走势',
textStyle: {
color: 'white',
},
left: "20px",
top: "10px"
},
tooltip: {
show: true
},
legend: {
show: true,
icon: 'rect',
itemHeight: 6,
textStyle: {
color: 'white'
},
top: '40px'
},
xAxis: {
data: ['12-27', '12-28', '12-29', '12-30', '12-31', '01-01', '01-02', '01-03', '01-04'],
axisLabel: {
textStyle: {
color: "white"
}
},
splitLine: {
show: false
},
// 设置x轴线的宽度
axisLine: {
lineStyle: {
width: 2,
color: 'rgb(59,77,147)'
}
}
},
yAxis: {
axisLabel: {
show: true,
textStyle: {
color: 'white'
}
},
splitLine: {
show: true
},
},
series: [{
name: '企业入驻',
type: 'line',
color: 'rgb(43,217,178)',
data: [0]
}, {
name: '企业申报数',
type: 'line',
color: 'rgb(247,230,63)',
data: [0]
}, {
name: '企业培育数',
type: 'line',
color: 'rgb(98,113,248)',
data: [0]
}]
});