diff --git a/src/view/analyze.vue b/src/view/analyze.vue index 98d2609..23b0f17 100644 --- a/src/view/analyze.vue +++ b/src/view/analyze.vue @@ -60,7 +60,7 @@
{{ item }} @@ -573,8 +573,10 @@ onBeforeUnmount(() => { display: flex; flex-wrap: wrap; color: #ffffff; + margin-top: 14px; .ViewDataTop { width: 114px; + height: 132px; display: flex; align-items: center; flex-direction: column; @@ -585,9 +587,10 @@ onBeforeUnmount(() => { background-size: 100% 100%; width: 80px; height: 80px; - margin-bottom: -24px; + margin-bottom: -28px; text-align: center; line-height: 100px; + animation: moveUpDown 2s infinite; } .ViewDataTopimg_1 { background-image: url(@/assets/images/sjfx/sjfx1.png); @@ -598,18 +601,31 @@ onBeforeUnmount(() => { } .ViewDataBottomimg { background-image: url(@/assets/images/sjfx/sjfx2.png); - background-repeat: no-repeat; - background-size: 100% 100%; - width: 80px; - height: 80px; - margin-bottom: -24px; + animation: scaleUpDown 2s infinite; + // transform: scale(1.3); } .ViewDataBottomimg_1 { background-image: url(@/assets/images/sjfx/sjfx3.png); - background-repeat: no-repeat; - background-size: 100% 100%; - width: 105px; - height: 57px; + margin-top: 4px; + } + + @keyframes moveUpDown { + 0%, + 100% { + transform: translateY(0); + } + 50% { + transform: translateY(-10px); + } + } + @keyframes scaleUpDown { + 0%, + 100% { + transform: scale(1); + } + 50% { + transform: scale(1.1); + } } } } diff --git a/src/view/echart_analyze/eP2.vue b/src/view/echart_analyze/eP2.vue index 59926d2..59c9fa9 100644 --- a/src/view/echart_analyze/eP2.vue +++ b/src/view/echart_analyze/eP2.vue @@ -39,7 +39,18 @@ const data = reactive({ color: "#ffffff", }, }, - bgColor: ["#2468FF", "#E8FF00", "#FF5733", "#33FF57", "#3357FF", "#FF33A1", "#57FF33", "#33FFA1", "#A133FF", "#FF5733"], + bgColor: [ + "#2468FF", + "#E8FF00", + "#FF5733", + "#33FF57", + "#3357FF", + "#FF33A1", + "#57FF33", + "#33FFA1", + "#A133FF", + "#FF5733", + ], }); const updateSeries = () => { @@ -106,10 +117,8 @@ const getOption = () => { type: "category", data: data.year, axisLabel: { - textStyle: { - color: "#ffffff", - fontSize: 16, - }, + color: "#ffffff", + fontSize: 16, }, }, yAxis: [ diff --git a/src/view/echart_analyze/right1.vue b/src/view/echart_analyze/right1.vue index 4eb4978..1968636 100644 --- a/src/view/echart_analyze/right1.vue +++ b/src/view/echart_analyze/right1.vue @@ -115,7 +115,7 @@ let option = { // formatter: '{c}%' // 这里是数据展示的时候显示的数据 }, // 柱子上方的数值 itemStyle: { - normal: { + // normal: { borderWidth: 1, // borderColor: "rgba(0, 183, 255, 1)", borderRadius: [0, 0, 50, 0], //圆角边框 @@ -123,7 +123,7 @@ let option = { { offset: 0, color: "rgba(0, 183, 255, 0)" }, { offset: 1, color: "rgba(0, 183, 255, 1)" }, ]), - }, + // }, }, barWidth: 10, data: data2, diff --git a/src/view/echart_analyze/ylXZZC.vue b/src/view/echart_analyze/ylXZZC.vue index a3ff8d6..aee5d66 100644 --- a/src/view/echart_analyze/ylXZZC.vue +++ b/src/view/echart_analyze/ylXZZC.vue @@ -179,7 +179,7 @@ const getOption = () => { barMaxWidth: 20, // 每一个都要设置 barMinWidth: 5, // 每一个都要设置 itemStyle: { - normal: { + // normal: { borderWidth: 1, borderColor: "rgba(0, 183, 255, 1)", borderRadius: [0, 0, 50, 0], //圆角边框 @@ -187,7 +187,7 @@ const getOption = () => { { offset: 0, color: "rgba(26, 255, 217, 0)" }, { offset: 1, color: "rgba(0, 183, 255, 1)" }, ]), - }, + // }, }, label: { show: true,