2023.1.6今天我学习了如何使用echarts line折线图,效果如:
首先是给容器设置id,宽高
然后是
var lineChart = echarts.init(document.getElementById('line'));
lineChart.setOption({
title: {
text: '校企合作总体情况',
textStyle: {
color: 'white'
},
left: "20px",
top: "10px"
},
tooltip: {
show: true
},
legend: {
show: true,
// 设置按钮开关的高度
itemHeight: 6,
// 设置按钮开关的样式
icon: 'rect',
textStyle: {
color: 'white'
},
top: '40px'
},
xAxis: {
data: ['0', '0.2', '0.4', '0.6', '0.8', '1'],
axisLabel: {
textStyle: {
color: "white"
}
},
// x轴网格线开启
splitLine: {
show: true
}
},
yAxis: {
axisLabel: {
show: false
},
// y轴网格线关闭
splitLine: {
show: false
}
},
series: [{
name: '合作企业数',
type: 'line',
color: 'rgb(25,163,246)',
data: [27]
}, {
name: '合作项目数',
type: 'line',
color: 'rgb(43,217,178)',
data: [0]
}]
});