修改echart

This commit is contained in:
GGJ
2024-09-13 18:35:02 +08:00
parent 5e847decc3
commit e4997e4b63
4 changed files with 79 additions and 41 deletions

View File

@@ -54,12 +54,12 @@ const initChart = () => {
fontSize: 16
}
},
// textStyle: {
textStyle: {
color: '#fff',
fontStyle: '14px',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14,
// },
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0,
...(props.options?.tooltip || null)

View File

@@ -95,8 +95,8 @@ const loading = ref(true)
onMounted(() => {
if (props.dataLevel == 'Secondary') {
form.dataLevel = 'Primary'
}else{
form.dataLevel=props.dataLevel
} else {
form.dataLevel = props.dataLevel
}
init()
})
@@ -115,6 +115,13 @@ const init = () => {
dataLevel: form.dataLevel,
statMethod: form.statMethod
}).then(res => {
console.log(
123,
res.data.map((item: any[]) => {
return item[0].anotherName
})
)
if (res.data.length && res.data[0].length) {
let arr: any[] = []
res.data.forEach((item: any[]) => {
@@ -131,9 +138,14 @@ const init = () => {
},
series: res.data.map((item: any) => {
return {
data: item.map((item: any) => {
return item.statisticalData
data: item.map((item: any, i: any) => {
return [res.data[0][i].time, item.statisticalData]
}),
// data: [
// [1584086222000, '573'],
// [1584086342000, '57'],
// [1584086462000, '56']
// ],
markPoint: {
symbol: 'circle',
symbolSize: 8,
@@ -152,6 +164,23 @@ const init = () => {
}
})
},
tooltip: {
axisPointer: {
type: 'cross',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
opacity: 0.35,
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0
},
legend: {
data: res.data.map((item: any[]) => {
return item[0].anotherName
@@ -164,28 +193,37 @@ const init = () => {
show: true
},
minInterval: 0.1,
min: 0,
max: parseInt(
(
min: parseFloat(
arr
.map(item => item.statisticalData)
.sort((a, b) => {
return a - b
})[0] / 1.5
).toFixed(0),
max: parseFloat(
arr
.map(item => item.statisticalData)
.sort((a, b) => {
return b - a
})[0] * 1.5
).toFixed(0)
)
})[0] * 1.2
).toFixed(1)
},
xAxis: {
type: 'category',
data: res.data[0].map((item: any) => {
return item.time
}),
axisLabel: {
formatter: function (value: string) {
return value.split(' ').join('\n')
}
type: 'time'
// data: res.data[0].map((item: any) => {
// return item.time
// }),
// axisLabel: {
// formatter: function (value: string) {
// return value.split(' ').join('\n')
// }
// }
}
}
if ((echartsData.value.legend = ['A相', 'B相', 'C相'])) {
echartsData.value.color = ['#FFCC00', '#009900', '#CC0000']
}
} else {
echartsData.value = null

View File

@@ -255,7 +255,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0],
color: '#00CC99'
color: '#FFCC00'
// }e
},
data: yDataList1,
@@ -270,7 +270,7 @@ const init = () => {
// normal: {
barBorderRadius: [3, 3, 0, 0],
color: '#FF9900'
color: '#009900'
// }
},
data: yDataList2,
@@ -284,7 +284,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0]
// color: '#FF9900'
// color: '#CC0000'
// }
},
data: yDataList3,
@@ -380,7 +380,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0],
color: '#00CC99'
color: '#FFCC00'
// }e
},
data: yDataList1
@@ -392,7 +392,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0],
color: '#FF9900'
color: '#009900'
// }
},
data: yDataList2
@@ -404,7 +404,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0]
// color: '#FF9900'
// color: '#CC0000'
// }
},
data: yDataList3
@@ -498,7 +498,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0],
color: '#00CC99'
color: '#FFCC00'
// }e
},
data: yDataList1
@@ -511,7 +511,7 @@ const init = () => {
// normal: {
barBorderRadius: [3, 3, 0, 0],
color: '#FF9900'
color: '#009900'
// }
},
data: yDataList2
@@ -523,7 +523,7 @@ const init = () => {
itemStyle: {
// normal: {
barBorderRadius: [3, 3, 0, 0]
// color: '#FF9900'
// color: '#CC0000'
// }
},
data: yDataList3

View File

@@ -215,21 +215,21 @@ const initRadioCharts = () => {
value: 180,
name: 'A相',
itemStyle: {
color: '#A5292A'
color: '#FFCC00'
}
},
{
value: 90,
name: 'B相',
itemStyle: {
color: '#DAA521'
color: '#009900'
}
},
{
value: 30,
name: 'C相',
itemStyle: {
color: '#2F8A57'
color: '#CC0000'
}
}
]