update 任务执行对比曲线样式优化

This commit is contained in:
2026-01-29 15:18:52 +08:00
parent 113b96ce92
commit 1e8a885310
3 changed files with 113 additions and 9 deletions

View File

@@ -835,9 +835,7 @@ const setChartFun = () => {
const data = res.data.xData[index].map((item_1: any, index_1: number) => {
return [item_1, res.data.yData[index][index_1]];
});
XData = res.data.xData[index].map((item: any) => {
return item;
});
XData = res.data.xData[index];
const title = compareData.value[key][index].originalName;
titleList.push(title);
seriesData.push({

View File

@@ -837,7 +837,13 @@ const checkBoxChangeFun = () => {
const compareData = ref<any>({});
const projectStorageSpaceStatisticsRef = ref<any>({});
// 初始化图表chart-1
const initProjectTaskAchievementStatistics = async ({ dom, seriesData, titleList, key }: any) => {
const initProjectTaskAchievementStatistics = async ({
dom,
seriesData,
XData,
titleList,
key,
}: any) => {
dom.commonChartRef.disposeEchartsByKey('chart-' + key);
dom.commonChartRef.option = {
title: {
@@ -858,10 +864,42 @@ const initProjectTaskAchievementStatistics = async ({ dom, seriesData, titleList
right: '5%',
},
xAxis: {
type: 'category',
type: 'value',
data: XData,
axisLabel: {
show: true,
// interval: 9,
interval: XData.length > 10 ? Math.floor(XData.length / 10) : 1,
},
splitLine: {
show: true,
},
axisLine: {
show: true,
},
axisTick: {
show: true,
},
},
yAxis: {
type: 'value',
axisLine: {
show: true,
},
axisTick: {
show: true,
},
minorTick: {
show: true,
splitNumber: 5, // 大刻度之间分割成5份
length: 3, // 小刻度长度
},
minorSplitLine: {
show: true,
lineStyle: {
type: 'dotted',
},
},
},
series: seriesData,
};
@@ -879,18 +917,32 @@ const setChartFun = () => {
}).then((res: any) => {
const seriesData: any = [];
const titleList: any = [];
let XData: any = [];
if (res.code === 200) {
res.data.xData.forEach((item: any, index: number) => {
const data = res.data.xData[index].map((item_1: any, index_1: number) => {
return [item_1, res.data.yData[index][index_1]];
});
XData = res.data.xData[index];
const title = compareData.value[key][index].name;
titleList.push(title);
seriesData.push({
name: title,
type: 'line',
stack: 'Total',
data,
showSymbol: false, // 默认不显示数据点
symbolSize: 6, // 悬停时数据点的大小
itemStyle: {
opacity: 0, // 默认数据点透明度
borderWidth: 2,
},
emphasis: {
scale: true, // 悬停时放大
focus: 'series', // 悬停时高亮整个系列
itemStyle: {
opacity: 1, // 悬停时显示数据点
},
},
});
});
}
@@ -899,6 +951,7 @@ const setChartFun = () => {
dom: projectStorageSpaceStatisticsRef.value[`chart-${key}`],
seriesData,
titleList,
XData,
key,
});
});

View File

@@ -897,7 +897,14 @@ const checkBoxChangeFun = () => {
const compareData = ref<any>({});
const projectStorageSpaceStatisticsRef = ref<any>({});
// 初始化图表chart-1
const initProjectTaskAchievementStatistics = async ({ dom, seriesData, titleList, key }: any) => {
const initProjectTaskAchievementStatistics = async ({
dom,
seriesData,
XData,
titleList,
key,
}: any) => {
console.log('XData', XData);
dom.commonChartRef.disposeEchartsByKey('chart-' + key);
dom.commonChartRef.option = {
title: {
@@ -918,10 +925,41 @@ const initProjectTaskAchievementStatistics = async ({ dom, seriesData, titleList
right: '5%',
},
xAxis: {
type: 'category',
type: 'value',
data: XData,
axisLabel: {
show: true,
interval: XData.length > 10 ? Math.floor(XData.length / 10) : 1,
},
splitLine: {
show: true,
},
axisLine: {
show: true,
},
axisTick: {
show: true,
},
},
yAxis: {
type: 'value',
axisLine: {
show: true,
},
axisTick: {
show: true,
},
minorTick: {
show: true,
splitNumber: 5, // 大刻度之间分割成5份
length: 3, // 小刻度长度
},
minorSplitLine: {
show: true,
lineStyle: {
type: 'dotted',
},
},
},
series: seriesData,
};
@@ -944,18 +982,32 @@ const setChartFun = () => {
}).then((res: any) => {
const seriesData: any = [];
const titleList: any = [];
let XData: any = [];
if (res.code === 200) {
res.data.xData.forEach((item: any, index: number) => {
const data = res.data.xData[index].map((item_1: any, index_1: number) => {
return [item_1, res.data.yData[index][index_1]];
});
XData = res.data.xData[index];
const title = compareData.value[key][index].name;
titleList.push(title);
seriesData.push({
name: title,
type: 'line',
stack: 'Total',
data,
showSymbol: false, // 默认不显示数据点
symbolSize: 6, // 悬停时数据点的大小
itemStyle: {
opacity: 0, // 默认数据点透明度
borderWidth: 2,
},
emphasis: {
scale: true, // 悬停时放大
focus: 'series', // 悬停时高亮整个系列
itemStyle: {
opacity: 1, // 悬停时显示数据点
},
},
});
});
}
@@ -963,6 +1015,7 @@ const setChartFun = () => {
initProjectTaskAchievementStatistics({
dom: projectStorageSpaceStatisticsRef.value[`chart-${key}`],
seriesData,
XData,
titleList,
key,
});