单曲线图
function (data,params){
// const myChart = this.myChart;
const yearData2 = [2020, 2021, 2022, 2023, 2024, 2025];
const personData2 = [820, 932, 901, 934, 1290, 1330, 1320];
const { yearData, personData } = data;
const option = {
tooltip: {
trigger: "axis",
backgroundColor: "RGBA(0, 0, 0, 0.6)",
textStyle: {
color: '#fff'
}
//formatter: function (prams) {
//return "使用率：" + prams[0].data + "%";
//},
},
grid: {
left: '50px', // 设置柱状图 y 轴距离左边的位置，可以根据实际情况调整百分比
bottom: '20px',
top: '40px',
right: '35px'
},
xAxis: {
name: '年',
nameTextStyle: {
color: '#9AA6B8',
fontSize: 16
},
type: 'category',
boundaryGap: false,
data: yearData,
axisLabel: {
show: true,
fontSize: 16,
textStyle: {
color: '#9AA6B8',
}
},
},
yAxis: {
name: '单位: 人',
nameTextStyle: {
color: '#9AA6B8',
fontSize: 16
},
type: 'value',
splitLine: {
show: true,
lineStyle: {
type: 'dashed', // 设置刻度线为虚线个数
}
},
axisLabel: {
show: true,
fontSize: 16,
textStyle: {
color: '#9AA6B8',
}
}
},
series: [
{
data: personData,
type: 'line',
smooth: true,
symbol: 'circle', // 设置曲线两头的形状为圆形
symbolSize: 4, // 大小
showSymbol: false, // 默认不显示圆点
emphasis: { // 鼠标悬浮时显示原点【要配合tooltip: trigger: 'xxx'使用】
focus: 'series',
itemStyle: {
color: '#FFFFFF', // 鼠标悬浮时折线点的颜色
//borderColor: '#FFE04D',
borderWidth: 3
}
},
lineStyle: {
width: 2,
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{ offset: 0, color: '#00B0FD' }, // %0 处的颜色
{ offset: 0.5, color: '#00F8FF' }, // %50 处的颜色
{ offset: 1, color: '#00B0FD' }, // 100% 处的颜色
],
global: false // 缺省为 false
}
},
areaStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [
{ offset: 0, color: 'rgba(0, 176, 253, 0.75)' }, // 0% 处的颜色
{ offset: 1, color: 'rgba(0, 176, 253, 0)' } // 100% 处的颜色
],
global: false // 缺省为 false
}
}
}
]
};
return option;
}
