taoge_xiaodi/td_official
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
ljx
2025-08-21 17:32:10 +08:00
parent 297048ab91
commit aab67593eb
9 changed files with 1154 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

169
src/views/largeScreen/components/optionList.ts
View File

@ -249,9 +249,10 @@ export const getOption2 = (data: any) => {
};
return option;
};
//食堂周报图
//z折线
export const getLineOption = (lineData: any) => {
const maxData = Math.ceil(Math.max(...lineData.line1));
const maxData = Math.max(...lineData.line1.flat());
const option = {
backgroundColor: '',
tooltip: {
@ -263,37 +264,41 @@ export const getLineOption = (lineData: any) => {
},
borderColor: '#7ec7ff'
},
// legend: {
// align: 'left',
// right: '5%',
// top: '1%',
// type: 'plain',
// textStyle: {
// color: '#fff',
// fontSize: 12
// },
// // icon:'rect',
// itemGap: 15,
// itemWidth: 18,
// data: [
// {
// name: '上周销售量'
// },
// {
// name: '本周销售量'
// }
// ]
// },
legend: {
align: 'left',
right: '5%',
top: '1%',
type: 'plain',
textStyle: {
color: '#fff',
fontSize: 12
},
// icon:'rect',
itemGap: 15,
itemWidth: 18,
data: [
{
name: '收款金额'
},
{
name: '付款金额'
},
{
name: '净现金流'
}
]
},
grid: {
top: '12%',
left: '1%',
right: '3%',
bottom: '12%',
bottom: '5%',
containLabel: true
},
xAxis: {
type: 'category',
data: lineData.xLabel,
boundaryGap: false,
axisLine: {
show: false
},
@ -318,21 +323,21 @@ export const getLineOption = (lineData: any) => {
}
}
},
dataZoom: [
{
// show: true,
start: 0,
end: 30,
bottom: 2, // 下滑块距离x轴底部的距离
height: 23
},
{
type: 'inside'
}
],
// dataZoom: [
// {
// // show: true,
// start: 0,
// end: 30,
// bottom: 2, // 下滑块距离x轴底部的距离
// height: 23
// },
// {
// type: 'inside'
// }
// ],
series: [
{
name: '逆变器功率',
name: '收款金额',
type: 'line',
symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
showAllSymbol: false,
@ -373,7 +378,95 @@ export const getLineOption = (lineData: any) => {
shadowColor: 'rgba(25,163,223, 0.5)', //阴影颜色
shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: lineData.line1
data: lineData.line1[0]
},
{
name: '付款金额',
type: 'line',
symbol: 'none', // 默认是空心圆（中间是白色的），改成实心圆
showAllSymbol: false,
symbolSize: 0,
smooth: true,
lineStyle: {
width: 1,
color: 'rgba(255, 224, 179, 1)', // 线条颜色
borderColor: 'rgba(0,0,0,.4)'
},
itemStyle: {
color: 'rgba(255, 224, 179, 1)',
borderWidth: 2,
show: true
},
tooltip: {
show: true
},
areaStyle: {
//线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: 'rgba(255, 224, 179, 0.4)'
},
{
offset: 1,
color: 'rgba(255, 224, 179, 0)'
}
],
false
),
shadowColor: 'rgba(255, 224, 179, 0.6)', //阴影颜色
shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: lineData.line1[1]
},
{
name: '净现金流',
type: 'line',
symbol: 'none', // 默认是空心圆（中间是白色的），改成实心圆
showAllSymbol: false,
symbolSize: 0,
smooth: true,
lineStyle: {
width: 1,
color: 'rgba(39, 255, 252, 1)', // 线条颜色
borderColor: 'rgba(0,0,0,.4)'
},
itemStyle: {
color: 'rgba(39, 255, 252, 1)',
borderWidth: 2,
show: false
},
tooltip: {
show: true
},
areaStyle: {
//线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: 'rgba(39, 255, 252, 0.4)'
},
{
offset: 1,
color: 'rgba(39, 255, 252, 0)'
}
],
false
),
shadowColor: 'rgba(39, 255, 252, 0.5)', //阴影颜色
shadowBlur: 20 //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
},
data: lineData.line1[2]
}
]
};