diff --git a/src/views/shanghaiStreetMapDasai.vue b/src/views/shanghaiStreetMapDasai.vue
index f9c8909..5efe279 100644
--- a/src/views/shanghaiStreetMapDasai.vue
+++ b/src/views/shanghaiStreetMapDasai.vue
@@ -339,14 +339,11 @@
+ }" v-show="relationShow || isAnimating" style="transform-origin: bottom right;">
@@ -505,10 +502,10 @@ const choujianShow = ref(false);
const tousuShow = ref(false);
const zhifaShow = ref(false);
//
-const littlemonth = ref(-1);
+const littlemonth = ref(0);
// 下拉框"年份"值
-const yearValue = ref("2023");
+const yearValue = ref("2024");
// 下拉框"年份"option
const yearOptions = [
{
@@ -523,6 +520,10 @@ const yearOptions = [
value: "2023",
label: "2023",
},
+ {
+ value: "2024",
+ label: "2024",
+ },
// 可以根据需要添加更多年份
];
@@ -3987,7 +3988,7 @@ const choujianEchartsPinfa = () => {
showSymbol: true,
emphasis: { focus: "series" },
z: 1,
- tooltip: { show: false }, // 关键:隐藏虚线的tooltip
+ // tooltip: { show: false }, // 关键:隐藏虚线的tooltip
},
])
.flat();
@@ -4000,10 +4001,51 @@ const choujianEchartsPinfa = () => {
textStyle: { color: "#00ffff", fontSize: 20, fontWeight: "bold" },
top: 5,
},
+ // tooltip: {
+ // trigger: "axis",
+ // // valueFormatter: (v) => (v == null ? "无" : v + "%"),
+ // valueFormatter: (v) => (v == null ? choujianPinfaData.value[0].prediction + "%" : v + "%"),
+ // },
tooltip: {
- trigger: "axis",
- // valueFormatter: (v) => (v == null ? "无" : v + "%"),
- valueFormatter: (v) => (v == null ? choujianPinfaData.value[0].prediction + "%" : v + "%"),
+ trigger: 'axis',
+ formatter: function (params) {
+ let ymonth = "";
+ let result = '';
+ const dataMap = {};
+
+ // 合并实线和虚线数据
+ params.forEach(item => {
+ // console.log(item);
+ const isPrediction = item.seriesName.includes('预测');
+ const baseName = isPrediction ? item.seriesName.replace('预测', '') : item.seriesName;
+
+ if (!dataMap[baseName]) {
+ dataMap[baseName] = { value: null, prediction: null };
+ }
+
+ if (isPrediction) {
+ dataMap[baseName].prediction = item.value;
+ } else {
+ dataMap[baseName].value = item.value;
+ }
+
+ ymonth = item.name;
+ // console.log(ymonth);
+ });
+
+ // 构建tooltip内容
+ Object.keys(dataMap).forEach(name => {
+ const item = dataMap[name];
+ if (item.prediction && ymonth == "5月") {
+ result += `${name}: (预测: ${item.prediction}%)`;
+ } else {
+ result += `${name}: ${item.value || '0'}%`;
+ }
+ result += '
';
+ });
+
+ return result;
+ },
},
legend: {
data: legendData,
@@ -4079,7 +4121,7 @@ const zhifaEchartsPinfa = () => {
showSymbol: true,
emphasis: { focus: "series" },
z: 1,
- tooltip: { show: false }, // 关键:隐藏虚线的tooltip
+ // tooltip: { show: false }, // 关键:隐藏虚线的tooltip
},
])
.flat();
@@ -4092,11 +4134,52 @@ const zhifaEchartsPinfa = () => {
textStyle: { color: "#00ffff", fontSize: 20, fontWeight: "bold" },
top: 5,
},
- tooltip: {
- trigger: "axis",
- valueFormatter: (v) => (v == null ? zhifaPinfaData.value[0].prediction + "%" : v + "%"),
- // formatter: '{b0}: {c0}
{b1}: {c1}'
+ // tooltip: {
+ // trigger: "axis",
+ // valueFormatter: (v) => (v == null ? zhifaPinfaData.value[0].prediction + "%" : v + "%"),
+ // // formatter: '{b0}: {c0}
{b1}: {c1}'
+ // },
+ tooltip: {
+ trigger: 'axis',
+ formatter: function (params) {
+ let ymonth = "";
+ let result = '';
+ const dataMap = {};
+
+ // 合并实线和虚线数据
+ params.forEach(item => {
+ // console.log(item);
+ const isPrediction = item.seriesName.includes('预测');
+ const baseName = isPrediction ? item.seriesName.replace('预测', '') : item.seriesName;
+
+ if (!dataMap[baseName]) {
+ dataMap[baseName] = { value: null, prediction: null };
+ }
+
+ if (isPrediction) {
+ dataMap[baseName].prediction = item.value;
+ } else {
+ dataMap[baseName].value = item.value;
+ }
+
+ ymonth = item.name;
+ // console.log(ymonth);
+ });
+
+ // 构建tooltip内容
+ Object.keys(dataMap).forEach(name => {
+ const item = dataMap[name];
+ if (ymonth == "5月") {
+ result += `${name}: (预测: ${item.prediction}%)`;
+ } else {
+ result += `${name}: ${item.value || '0'}%`;
+ }
+ result += '
';
+ });
+
+ return result;
+ },
},
legend: {
data: legendData,
@@ -4149,7 +4232,7 @@ const jubaoGaofaData = ref([
tousulv: "2.04%",
dengji: "yellow",
}, {
- huanjie: "销售环节",
+ huanjie: "餐饮环节",
zhonglei: "虚假宣传",
tousulv: "1.97%",
dengji: "yellow",
@@ -4402,10 +4485,12 @@ const handleFancyClick = (e: MouseEvent) => {
opacity: 0;
transform: scale(0) translate(0, 0);
}
+
50% {
opacity: 0.8;
transform: scale(0.8) translate(0, -20px);
}
+
100% {
opacity: 1;
transform: scale(1) translate(0, 0);
@@ -4418,10 +4503,12 @@ const handleFancyClick = (e: MouseEvent) => {
opacity: 1;
transform: scale(1) translate(0, 0);
}
+
50% {
opacity: 0.8;
transform: scale(0.8) translate(0, -20px);
}
+
100% {
opacity: 0;
transform: scale(0) translate(0, 0);