From b509a3a69e8037cd215c206a38f08630378ef5c4 Mon Sep 17 00:00:00 2001 From: xiaowen <372193233@qq.com> Date: Tue, 26 Jul 2022 18:24:28 +0800 Subject: [PATCH] cxw-010203 --- components/indexCom/dataChild/index.js | 34 ++++++++++++++++--------- components/option/columnarOption.js | 15 ++++++----- components/option/pictographicOption.js | 12 ++++++++- components/option/pieOption.js | 10 +++++++- components/option/sColumnarOption.js | 14 ++++++---- components/option/stackingLineOption.js | 14 ++++++---- pages/detail/index.js | 1 - 7 files changed, 69 insertions(+), 31 deletions(-) diff --git a/components/indexCom/dataChild/index.js b/components/indexCom/dataChild/index.js index e85d678..589e5a3 100644 --- a/components/indexCom/dataChild/index.js +++ b/components/indexCom/dataChild/index.js @@ -1,6 +1,5 @@ const app = getApp(); import brokenLine from "../../option/stackingLineOption" -const dName = ['微博', '其他', '短视频', '微信', 'APP', '论坛', '新闻'] const dColor = ['#FF4852', '#FF6E25', '#FFBF00', '#20CC62', '#00D6D6', '#00AAFF', '#7257FF'] Component({ data: { @@ -30,8 +29,6 @@ Component({ let sTimeType = e.detail.sTimeType; let sStartTime = e.detail.sStartTime; let sEndTime = e.detail.sEndTime; - // this.getAmount(sTimeType, sStartTime, sEndTime); - // this.getTrend(sTimeType, sStartTime, sEndTime); this.getData(sTimeType, sStartTime, sEndTime) }, @@ -61,17 +58,30 @@ Component({ sEndTime: sEndTime } app.globalData.request(obj).then(res => { - let arr = [] - let bar = [[],[],[],[],[],[] - ] - res.forEach(ele => { - for (let i = 0; i < ele.Data.length; i++) { - bar[i].push(ele.Data[i].value) + let data = res || []; + let times = [] + let dNameObj = {} + for(let i = 0; i < data.length; i++) { + times.push(data[i].Time); + let a1 = data[i].Data || []; + for(let j = 0; j < a1.length; j++) { + let row = a1[j]; + if(dNameObj[row.key]) { + let val = dNameObj[row.key]; + val.push(row.value); + } else { + dNameObj[row.key] = [row.value]; + } } - arr.push(ele.Time) - }) + } + const bar = []; + const dName = []; + for(let key in dNameObj) { + dName.push(key); + bar.push(dNameObj[key]) + } this.setData({ - dataOption: brokenLine(dName, bar, dColor, arr), + dataOption: brokenLine(dName, bar, dColor, times) }) resolve(true) }).catch(() => { diff --git a/components/option/columnarOption.js b/components/option/columnarOption.js index acb4cb9..ffd3fe3 100644 --- a/components/option/columnarOption.js +++ b/components/option/columnarOption.js @@ -4,13 +4,16 @@ export default function histogram(dx = [], ds = [], color1 = '', direction = tru // direction true为垂直 false为水平 return { tooltip: { - trigger: 'axis', - axisPointer: { // 坐标轴指示器,坐标轴触发有效 - type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' - }, - confine: true + trigger: "axis", + backgroundColor: "#08182F", + color: "#fff", + borderColor: "#3373CC", + textStyle: { + color: "#fff", //设置文字颜色 + }, + extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;", + confine: true }, - dataZoom: direction?[{ //添加X轴滚动条 type: 'inside', show: false, diff --git a/components/option/pictographicOption.js b/components/option/pictographicOption.js index a27e6cc..c44caa3 100644 --- a/components/option/pictographicOption.js +++ b/components/option/pictographicOption.js @@ -1,7 +1,17 @@ // 象形 export default function pictographicOption(dRegion = [], dValue = [], dSum = 0) { return { - tooltip: {}, + tooltip: { + trigger: "item", + backgroundColor: "#08182F", + color: "#fff", + borderColor: "#3373CC", + textStyle: { + color: "#fff", //设置文字颜色 + }, + extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;", + confine: true + }, xAxis: { show: false, type: 'value' diff --git a/components/option/pieOption.js b/components/option/pieOption.js index eb7fd57..ed10cf3 100644 --- a/components/option/pieOption.js +++ b/components/option/pieOption.js @@ -2,7 +2,15 @@ export default function pieOption(color = [], data = [], ) { return { tooltip: { - trigger: 'item' + trigger: 'item', + backgroundColor: "#08182F", + color: "#fff", + borderColor: "#3373CC", + textStyle: { + color: "#fff", //设置文字颜色 + }, + extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;", + confine: true }, // 注释字体样式 legend: { diff --git a/components/option/sColumnarOption.js b/components/option/sColumnarOption.js index f68168a..f61adeb 100644 --- a/components/option/sColumnarOption.js +++ b/components/option/sColumnarOption.js @@ -3,11 +3,15 @@ export default function sHistogram(dx = [], ds = [], data = [], color2 = []) { // MS判断多条数据还是单条数据 true为单条false为多条 return { tooltip: { - trigger: 'axis', - axisPointer: { // 坐标轴指示器,坐标轴触发有效 - type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' - }, - confine: true + trigger: "axis", + backgroundColor: "#08182F", + color: "#fff", + borderColor: "#3373CC", + textStyle: { + color: "#fff", //设置文字颜色 + }, + extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;", + confine: true }, legend: { icon: 'rectangle', //data图标样式 diff --git a/components/option/stackingLineOption.js b/components/option/stackingLineOption.js index d1dc25c..860ca1b 100644 --- a/components/option/stackingLineOption.js +++ b/components/option/stackingLineOption.js @@ -2,11 +2,15 @@ export default function brokenLines(dName = [], dValue = [], dColor = [], dx = []) { return { tooltip: { - trigger: 'axis', - axisPointer: { // 坐标轴指示器,坐标轴触发有效 - type: 'line' // 默认为直线,可选为:'line' | 'shadow' - }, - confine: true + trigger: "axis", + backgroundColor: "#08182F", + color: "#fff", + borderColor: "#3373CC", + textStyle: { + color: "#fff", //设置文字颜色 + }, + extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;", + confine: true }, legend: { icon: 'rectangle', //data图标样式 diff --git a/pages/detail/index.js b/pages/detail/index.js index 876003f..af4b158 100644 --- a/pages/detail/index.js +++ b/pages/detail/index.js @@ -120,7 +120,6 @@ Page({ }) } app.globalData.request(obj, (database) => { - console.log('54321',database) this.setData({ totalNum: database.totalNum })