92 lines
2.4 KiB
JavaScript
92 lines
2.4 KiB
JavaScript
export default function userLineOption(data) {
|
|
const appList = data.appList.map(item => ({
|
|
...item, appCount: item?.count
|
|
}))
|
|
const webList = data.webList.map(item => ({
|
|
...item, webCount: item?.count
|
|
}))
|
|
const arr = [...appList,...webList]
|
|
const compareLength = appList.length - webList.length;
|
|
// 找出长度大的数组
|
|
const mapArr1 = compareLength >= 0 ? appList : webList;
|
|
// 找出长度小的数组
|
|
const mapArr2 = compareLength < 0 ? appList : webList;
|
|
|
|
const maxY = Math.ceil(Math.max(...arr.map(item => item.count)))
|
|
const minY = Math.floor(Math.min(...arr.map(item => item.count)))
|
|
const result = mapArr1.map(item => {
|
|
let filterData = mapArr2.find(o => item.createDate == o.createDate)
|
|
return {
|
|
...item,
|
|
...filterData,
|
|
}
|
|
})
|
|
return {
|
|
grid: {
|
|
top: "15%",
|
|
bottom:"20%"
|
|
},
|
|
tooltip: {
|
|
trigger: "axis",
|
|
},
|
|
legend: {
|
|
show: true,
|
|
top:"0%"
|
|
},
|
|
|
|
calculable: true,
|
|
xAxis: [
|
|
{
|
|
type: "category",
|
|
data: result.map(item => item.createDate),
|
|
},
|
|
],
|
|
yAxis: [
|
|
{
|
|
type: "value",
|
|
min:minY - 1,
|
|
max:maxY + 1,
|
|
axisLine: {
|
|
show: false
|
|
},
|
|
axisTick: {
|
|
show: false
|
|
},
|
|
},
|
|
],
|
|
series: [
|
|
{
|
|
name: "WEB端",
|
|
type: "line",
|
|
smooth:true,
|
|
itemStyle: {
|
|
color:"#357efe"
|
|
},
|
|
label: {
|
|
normal: {
|
|
show: true,
|
|
position: "top",
|
|
},
|
|
},
|
|
|
|
data: result.map(item => item?.webCount || 0),
|
|
},
|
|
{
|
|
name: "移动端",
|
|
type: "line",
|
|
smooth:true,
|
|
itemStyle: {
|
|
color:"#62dffe"
|
|
},
|
|
label: {
|
|
normal: {
|
|
show: true,
|
|
position: "top",
|
|
},
|
|
},
|
|
|
|
data: result.map(item => item?.appCount || 0),
|
|
},
|
|
],
|
|
}
|
|
} |