From 8117804a6d71e3166470363f7e94f2de5410118c Mon Sep 17 00:00:00 2001 From: yujialong <479214531@qq.com> Date: Tue, 9 Jan 2024 16:34:25 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=89=E5=86=9C=E5=A4=A7=E5=8F=AF=E8=A7=86?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/screen/index.vue | 1 + src/pages/screenShow/index.vue | 38 +++++++++++++++++------------- src/pages/screenShow/indexPro.vue | 33 +++++++++++++------------- src/styles/page/screenShow.scss | 2 +- src/styles/page/screenShowPro.scss | 2 +- 5 files changed, 41 insertions(+), 35 deletions(-) diff --git a/src/pages/screen/index.vue b/src/pages/screen/index.vue index eeb0554..f995223 100644 --- a/src/pages/screen/index.vue +++ b/src/pages/screen/index.vue @@ -772,6 +772,7 @@ export default { sort: 0, isShelves: 0, hotTag: 1, + purchaseStatus: this.token ? 1 : '' }) if (cousrseRes) { const courseList = cousrseRes.page.records diff --git a/src/pages/screenShow/index.vue b/src/pages/screenShow/index.vue index a2a7c65..acceed8 100644 --- a/src/pages/screenShow/index.vue +++ b/src/pages/screenShow/index.vue @@ -504,7 +504,7 @@ export default { trigger: 'axis', }, grid: { - left: '18%', + left: '10%', right: '5%', top: '15%', bottom: '13%' @@ -550,7 +550,6 @@ export default { fontSize: 12, color: '#fff' }, - formatter: '{value} 亿元' }, splitLine: { show: true, @@ -569,7 +568,7 @@ export default { } }], series: [{ - name: '产值', + name: '产值（亿元）', type: 'bar', barWidth: 8, itemStyle: { @@ -613,7 +612,7 @@ export default { trigger: 'axis', }, grid: { - left: '18%', + left: '10%', right: '5%', top: '15%', bottom: '13%' @@ -659,7 +658,6 @@ export default { fontSize: 12, color: '#fff' }, - formatter: '{value} 家' }, splitLine: { show: true, @@ -685,13 +683,7 @@ export default { itemStyle: { normal: { barBorderRadius: [10, 10, 0, 0], - color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{ - offset: 0, - color: "#e23fc1" - }, { - offset: 0.8, - color: "#11acef" - }], false), + color: '#5693ff', shadowColor: 'rgba(0, 0, 0, 0.1)', } }, @@ -1434,22 +1426,36 @@ export default { title: { text: '2021年绿色食品十大产业全产业链产值（亿元） ', top: 10, - left: 10, + left: 'center', textStyle: { color: '#fff' } }, - tooltip: {}, + // tooltip: { + // valueFormatter: function (value) { + // return value + ' %'; + // } + // }, + tooltip: { + trigger: 'item', // 触发类型, 数据项图形触发，主要在散点图，饼图等无类目轴的图表中使用 + // 提示框浮层内容格式器，支持字符串模板和回调函数两种形式 + // 使用函数模板 传入的数据值 -> value: number | Array + formatter: function (val) { + const { data } = val + return data ? (data.name + '（亿元）:' + data.value) : '' + } + }, series: [ { - name: '2021年绿色食品十大产业全产业链产值（亿元）', + name: '', type: 'map', top: 60, map: 'AH',// 这个是上面注册时的名字哦，registerMap（'这个名字保持一致'） roam: true, zoom: 1.1, + label: { normal: { show: true, @@ -1551,7 +1557,7 @@ export default { scrollTable () { const dom = this.$refs.geo setInterval(() => { - dom.scrollTop += 1 + dom.scrollTop += window.innerWidth > 1920 ? 2 : 1 if (dom.clientHeight + dom.scrollTop === dom.scrollHeight) dom.scrollTop = 0 }, 30) } diff --git a/src/pages/screenShow/indexPro.vue b/src/pages/screenShow/indexPro.vue index 07c6092..1cec44a 100644 --- a/src/pages/screenShow/indexPro.vue +++ b/src/pages/screenShow/indexPro.vue @@ -508,7 +508,7 @@ export default { trigger: 'axis', }, grid: { - left: '18%', + left: '10%', right: '5%', top: '15%', bottom: '13%' @@ -554,7 +554,6 @@ export default { fontSize: 12, color: '#fff' }, - formatter: '{value} 亿元' }, splitLine: { show: true, @@ -573,7 +572,7 @@ export default { } }], series: [{ - name: '产值', + name: '产值（亿元）', type: 'bar', barWidth: 8, itemStyle: { @@ -617,7 +616,7 @@ export default { trigger: 'axis', }, grid: { - left: '18%', + left: '10%', right: '5%', top: '15%', bottom: '13%' @@ -663,7 +662,6 @@ export default { fontSize: 12, color: '#fff' }, - formatter: '{value} 家' }, splitLine: { show: true, @@ -689,13 +687,7 @@ export default { itemStyle: { normal: { barBorderRadius: [10, 10, 0, 0], - color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{ - offset: 0, - color: "#e23fc1" - }, { - offset: 0.8, - color: "#11acef" - }], false), + color: '#2deaff', shadowColor: 'rgba(0, 0, 0, 0.1)', } }, @@ -1438,16 +1430,23 @@ export default { title: { text: '2021年绿色食品十大产业全产业链产值（亿元） ', top: 10, - left: 10, + left: 'center', textStyle: { color: '#fff' } }, - tooltip: {}, - + tooltip: { + trigger: 'item', // 触发类型, 数据项图形触发，主要在散点图，饼图等无类目轴的图表中使用 + // 提示框浮层内容格式器，支持字符串模板和回调函数两种形式 + // 使用函数模板 传入的数据值 -> value: number | Array + formatter: function (val) { + const { data } = val + return data ? (data.name + '（亿元）:' + data.value) : '' + } + }, series: [ { - name: '2021年绿色食品十大产业全产业链产值（亿元）', + name: '', type: 'map', top: 60, map: 'AH',// 这个是上面注册时的名字哦，registerMap（'这个名字保持一致'） @@ -1555,7 +1554,7 @@ export default { scrollTable () { const dom = this.$refs.geo setInterval(() => { - dom.scrollTop += 1 + dom.scrollTop += window.innerWidth > 1920 ? 2 : 1 if (dom.clientHeight + dom.scrollTop === dom.scrollHeight) dom.scrollTop = 0 }, 30) } diff --git a/src/styles/page/screenShow.scss b/src/styles/page/screenShow.scss index eefebca..7a77286 100644 --- a/src/styles/page/screenShow.scss +++ b/src/styles/page/screenShow.scss @@ -254,7 +254,7 @@ body { } td { color: #fff; - font-size: 10px; + font-size: 13px; text-align: center; } tbody tr:nth-child(odd) { diff --git a/src/styles/page/screenShowPro.scss b/src/styles/page/screenShowPro.scss index b28bf6e..52de034 100644 --- a/src/styles/page/screenShowPro.scss +++ b/src/styles/page/screenShowPro.scss @@ -261,7 +261,7 @@ body { } td { color: #fff; - font-size: 10px; + font-size: 13px; text-align: center; } tbody tr:nth-child(odd) {