zx-品牌对比-改动

src/views/BrandComparison/brandEventComparison/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/brandEventComparison/index.vue
 -->
 <template>
-  <div class="bec-outter">
+  <div class="bec-outter" v-loading="load">
     <v-label-div title="品牌事件对比"> </v-label-div>
     <div class="bec-inner">
       <v-echarts :opt="opt1"></v-echarts>
@@ -45,6 +45,7 @@ export default {
         token: "",
         sBrand: "",
       },
+      load: false,
       colors: [
         "#3373CC",
         "#63AECC",
@@ -123,6 +124,7 @@ export default {
     getData() {
       return new Promise((resolve, reject) => {
         let obj = Object.assign({}, this.getCtime2, this.form);
+        this.load = true;
         getSourcetypeC(obj)
           .then((res) => {
             let data = res.data || [];
@@ -138,6 +140,7 @@ export default {
               brandList.push(e.Name);
             });
             this.opt1 = createOpt(data,dx, brandList);
+            this.load = false;
             resolve(data);
           })
           .catch(() => {

src/views/BrandComparison/brandEventComparison/opt.js

@@ -7,17 +7,63 @@
  * @FilePath: /data-show/src/views/BrandComparison/channelDistribution/opt.js
  */
 
-/*series: [
+import * as echarts from "echarts";
+let colors = [new echarts.graphic.LinearGradient(0, 0, 0, 1, [
     {
-        name: '奥迪',
+        offset: 0,
-        type: 'bar',
+        color: '#3373CC'
-        barGap: 0,
+    },
-        barWidth: 20,
+    {
-        emphasis: {
+        offset: 1,
-            focus: 'series'
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#63AECC'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#54BF93'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC9D12'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC7733'
     },
-        data: [320, 332, 301, 334, 390, 400]
+    {
-    },*/
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC5B41'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false)]
+
 function createData(dataList = [],dx = []) {
     let arr = [];
     dataList.forEach(ele => {
@@ -45,19 +91,23 @@ export default function createOpt(dataList = [],dx = [], brandList = []) {
     let info = createData(dataList,dx);
     return {
         grid: {
-            top: "56px",
+            left: 10,
-            left: "16px",
+            right: '5%',
-            right: "28px",
+            bottom: 10,
-            bottom: "16px",
+            top: 52,
             containLabel: true,
         },
+        color: colors,
         legend: {
             data: brandList,
             textStyle: { //图例文字的样式
-                color: '#fff'
+                color: '#fff',
+                fontSize: 10
             },
             y: 12,
-            x: 16
+            x: 16,
+            itemWidth: 12,
+            itemHeight: 12
         },
         tooltip: {
             trigger: "axis",

src/views/BrandComparison/channelDistribution/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/channelDistribution/index.vue
 -->
 <template>
-  <div class="cd-outter">
+  <div class="cd-outter" v-loading="load">
     <v-label-div title="渠道分布"> </v-label-div>
     <div class="cd-inner">
       <v-echarts :opt="opt"></v-echarts>
@@ -22,6 +22,7 @@ export default {
   name: "channelDistribution",
   data() {
     return {
+      load: false,
       form: {
         token: "",
         sBrand: "",
@@ -46,6 +47,7 @@ export default {
     getData() {
       return new Promise((resolve, reject) => {
         let obj = Object.assign({}, this.getCtime2, this.form);
+        this.load = true;
         getSourcetypeC(obj)
           .then((res) => {
             let data = res.data || [];
@@ -61,6 +63,7 @@ export default {
               brandList.push(e.Name);
             });
             this.opt = createOpt(data, dx, brandList);
+            this.load = false;
             resolve(data);
           })
           .catch(() => {

src/views/BrandComparison/channelDistribution/opt.js

@@ -7,7 +7,64 @@
  * @FilePath: /data-show/src/views/BrandComparison/channelDistribution/opt.js
  */
 import { bigNumberTransform } from "@/utils/gol/dataTool"
-let colors = ['#3373CC', '#63AECC', '#54BF93', '#CC9D12', '#CC7733', "#CC5B41", '#452b74', '#71686f']
+
+import * as echarts from "echarts";
+let colors = [new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#3373CC'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#63AECC'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#54BF93'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC9D12'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC7733'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC5B41'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false)]
+
 function createData(dataList = [],dx = []) {
     let arr = [];
     dataList.forEach(e => {
@@ -34,20 +91,27 @@ export default function createOpt(dataList = [],dx = [], brandList = []) {
     let info = createData(dataList,dx);
     return {
         grid: {
-            top: "56px",
+            left: 10,
-            left: "16px",
+            right: '5%',
-            right: "28px",
+            bottom: 10,
-            bottom: "16px",
+            top: 52,
+            // top: "56px",
+            // left: "16px",
+            // right: "28px",
+            // bottom: "16px",
             containLabel: true,
         },
         color: colors,
         legend: {
             data: brandList,
             textStyle: { //图例文字的样式
-                color: '#fff'
+                color: '#fff',
+                fontSize: 10
             },
             y: 12,
-            x: 16
+            x: 16,
+            itemWidth: 12,
+            itemHeight: 12
         },
         tooltip: {
             trigger: "axis",

src/views/BrandComparison/informationTrend/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/informationTrend/index.vue
 -->
 <template>
-  <div class="it-outter">
+  <div class="it-outter" v-loading="load">
     <v-label-div title="信息量趋势"></v-label-div>
     <div class="it-inner">
       <v-echarts :opt="opt"></v-echarts>
@@ -22,6 +22,7 @@ export default {
   name: "informationTrend",
   data() {
     return {
+      load: false,
       form: {
         token: "",
         sBrand: "",
@@ -45,6 +46,7 @@ export default {
     },
     getData() {
       let obj = Object.assign({}, this.getCtime2, this.form);
+      this.load = true;
       getCountTime0528C(obj).then((res) => {
          let data = res.data || [];
          let dx = [];
@@ -56,6 +58,7 @@ export default {
              ds.push(value);
          });
          this.opt = createOpt(dx, ds);
+         this.load = false;
       });
     },
   },

src/views/BrandComparison/informationTrend/opt.js

@@ -39,9 +39,9 @@ export default function createOpt(dx = [], ds = []) {
     let data = createData(ds);
     return {
         grid: {
-            left: 16,
+            left: 10,
-            right: 26,
+            right: '5%',
-            bottom: 16,
+            bottom: 10,
             top: 52,
             containLabel: true
         },
@@ -58,10 +58,13 @@ export default function createOpt(dx = [], ds = []) {
         legend: {
             icon: 'roundRect',
             textStyle: { //图例文字的样式
-                color: '#fff'
+                color: '#fff',
+                fontSize: 10
             },
             y: 12,
-            x: 16
+            x: 16,
+            itemWidth: 12,
+            itemHeight: 12
         },
         xAxis: {
             type: 'category',

src/views/BrandComparison/informationVolumeByChannel/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/informationVolumeByChannel/index.vue
 -->
 <template>
-  <div class="ivb-outter">
+  <div class="ivb-outter" v-loading="load">
     <v-label-div
       title="分渠道信息量"
       :showLine="false"
@@ -27,6 +27,7 @@ export default {
   data() {
     return {
       opt: {},
+      load: false,
       form: {
         token: "",
         sBrand: "",
@@ -50,6 +51,7 @@ export default {
     getData() {
       return new Promise((resolve, reject) => {
         let obj = Object.assign({}, this.getCtime2, this.form);
+        this.load = true;
         getSourcetypeC(obj)
           .then((res) => {
             let data = res.data || [];
@@ -65,6 +67,7 @@ export default {
               brandList.push(e.Name);
             });
             this.opt = createOpt(data, dx, brandList);
+            this.load = false;
             resolve(data);
           })
           .catch(() => {

src/views/BrandComparison/informationVolumeByChannel/opt.js

@@ -7,6 +7,63 @@
  * @FilePath: /data-show/src/views/BrandComparison/channelDistribution/opt.js
  */
 import { bigNumberTransform } from "@/utils/gol/dataTool"
+import * as echarts from "echarts";
+let colors = [new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#3373CC'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#63AECC'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#54BF93'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC9D12'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC7733'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+    {
+        offset: 0,
+        color: '#CC5B41'
+    },
+    {
+        offset: 1,
+        color: '#071a32'
+    }
+], false)]
+
 function createData(dataList = [],dx = []) {
     let arr = [];
     dataList.forEach(e => {
@@ -40,6 +97,7 @@ export default function createOpt(dataList = [],dx = [], brandList = []) {
             bottom: "16px",
             containLabel: true,
         },
+        color: colors,
         legend: {
             data: brandList,
             textStyle: { //图例文字的样式

src/views/BrandComparison/keyMediaCommunicationComparison/index.vue

@@ -46,11 +46,23 @@ export default {
     },
     getData() {
       let obj = Object.assign({}, this.getCtime2, this.form);
+      this.load = true;
       getSourceCount0528C(obj).then((res) => {
         let data = res.data;
-         this.opt = createOpt(data);
+        let dx = [];
-      })
+        data.forEach((ele) => {
+          let ab = ele.value || [];
+          // 匹配所有出现过的媒体，放入dx中
+          ab.forEach((e) => {
+            if (!dx.includes(e.key)) {
+              dx.push(e.key);
             }
+          });
+        });
+        this.opt = createOpt(dx, data);
+        this.load = false;
+      });
+    },
   },
 };
 </script>

src/views/BrandComparison/keyMediaCommunicationComparison/opt.js

@@ -6,32 +6,77 @@
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Index/spreadTheSound/opt.js
  */
-import { bigNumberTransform } from "@/utils/gol/dataTool"
+import { bigNumberTransform } from "@/utils/gol/dataTool";
-function createData(dataList = []) {
+import * as echarts from "echarts";
+
+let colors = [new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+      offset: 0,
+      color: '#3373CC'
+  },
+  {
+      offset: 1,
+      color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+      offset: 0,
+      color: '#63AECC'
+  },
+  {
+      offset: 1,
+      color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+      offset: 0,
+      color: '#54BF93'
+  },
+  {
+      offset: 1,
+      color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+      offset: 0,
+      color: '#CC9D12'
+  },
+  {
+      offset: 1,
+      color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+      offset: 0,
+      color: '#CC7733'
+  },
+  {
+      offset: 1,
+      color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+      offset: 0,
+      color: '#CC5B41'
+  },
+  {
+      offset: 1,
+      color: '#071a32'
+  }
+], false)]
+
+function createData(dataList = [],dx) {
   let arr = [];
   dataList.forEach(ele => {
-    let valueArr = [0,0,0,0,0];
+    let a = [];
-    ele.value.forEach(e => {
+    let Data = ele.value || [];
-      switch (e.key) {
+    dx.forEach(e => {
-        case "微信":
+      Data.forEach(ex => {
-          valueArr[0] = e.value;
+        if (ex.key === e) {
-          break;
+          a.push(ex.value)
-        case "懂车帝":
-          valueArr[1] = e.value;
-          break;
-        case "今日头条":
-          valueArr[2] = e.value;
-          break;
-        case "抖音":
-          valueArr[3] = e.value;
-          break;
-        case "易车":
-          valueArr[4] = e.value;
-          break;
-        default:
-          break;
         }
       })
+    })
     let o = {
       name: ele.key,
       type: 'bar',
@@ -40,21 +85,21 @@ function createData(dataList = []) {
       emphasis: {
         focus: 'series'
       },
-      data: valueArr
+      data: a
     };
     arr.push(o);
   })
   return arr;
 }
 
-export default function createOpt(dataList = []) {
+export default function createOpt(dx = [], dataList = []) {
-    let info = createData(dataList);
+  let info = createData(dataList, dx);
   return {
     grid: {
       left: 10,
       right: '5%',
       bottom: 10,
-            top: 56,
+      top: 52,
       containLabel: true
     },
     tooltip: {
@@ -67,25 +112,32 @@ export default function createOpt(dataList = []) {
       },
       extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;"
     },
+    color: colors,
     legend: {
       textStyle: { //图例文字的样式
-                color: '#fff'
+        color: '#fff',
+        fontSize: 10
       },
-            y: 10,
+      y: 12,
-            x: 16
+      x: 16,
+      itemWidth: 12,
+      itemHeight: 12
     },
     xAxis: {
       type: 'category',
       axisTick: {
         show: false,
       },
+      axisLabel: {
+        interval: 0
+      },
       axisLine: {
         show: false,
         lineStyle: {
           color: "#fff",
         },
       },
-            data: ['微信', '懂车帝', '今日头条', '抖音', '易车']
+      data: dx
     },
     yAxis: {
       type: 'value',

src/views/BrandComparison/overallInformation/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/overallInformation/index.vue
 -->
 <template>
-    <div class="oi-outter">
+  <div class="oi-outter" v-loading="load">
     <v-label-div title="整体信息量"></v-label-div>
     <div class="oi-inner">
       <v-echarts :opt="opt"></v-echarts>
@@ -16,18 +16,19 @@
 </template>
 
 <script>
-import {getContrastCount0528C} from "@/api/BrandComparison"
+import { getContrastCount0528C } from "@/api/BrandComparison";
-import {createSingleColumnar} from "@/utils/gol/singleColumnar"
+import { createSingleColumnar } from "@/utils/gol/singleColumnar";
 export default {
   name: "overallInformation",
   data() {
     return {
+      load: false,
       form: {
         token: "",
-                sBrand: ""
+        sBrand: "",
       },
-            opt: {}
+      opt: {},
-        }
+    };
   },
   created() {
     this.initData();
@@ -37,31 +38,28 @@ export default {
       this.form.token = this.getToken;
       let arr = this.getBComparison;
       let brands = [];
-            arr.forEach(ele => {
+      arr.forEach((ele) => {
-                brands.push(ele.name)
+        brands.push(ele.name);
       });
       this.form.sBrand = brands.toString();
       this.getData();
     },
     getData() {
-            return new Promise((resolve, reject) => {
       let obj = Object.assign({}, this.getCtime2, this.form);
+      this.load = true;
       getContrastCount0528C(obj).then((res) => {
         let data = res.data || [];
         let brandsList = [];
         let infoList = [];
-            data.forEach(e => {
+        data.forEach((e) => {
           brandsList.push(e.key);
           infoList.push(e.value);
-            })
-            this.opt = createSingleColumnar(brandsList, infoList);
-            resolve(data)
-            }).catch(() => {
-                reject(false)
         });
+        this.opt = createSingleColumnar(brandsList, infoList);
+        this.load = false;
       });
-        }
+    },
-    }
+  },
 };
 </script>
 

src/views/BrandComparison/overallNumberOfInteractions/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/overallNumberOfInteractions/index.vue
 -->
 <template>
-    <div class="onoi-outter">
+  <div class="onoi-outter" v-loading="load">
     <v-label-div title="整体互动人数"></v-label-div>
     <div class="onoi-inner">
       <v-echarts :opt="opt"></v-echarts>
@@ -16,18 +16,19 @@
 </template>
 
 <script>
-import {getInteractCount0528C} from "@/api/BrandComparison"
+import { getInteractCount0528C } from "@/api/BrandComparison";
-import {createSingleColumnar} from "@/utils/gol/singleColumnar"
+import { createSingleColumnar } from "@/utils/gol/singleColumnar";
 export default {
   name: "overallInformation",
   data() {
     return {
+      load: false,
       form: {
         token: "",
-                sBrand: ""
+        sBrand: "",
       },
-            opt: {}
+      opt: {},
-        }
+    };
   },
   created() {
     this.initData();
@@ -37,31 +38,28 @@ export default {
       this.form.token = this.getToken;
       let arr = this.getBComparison;
       let brands = [];
-            arr.forEach(ele => {
+      arr.forEach((ele) => {
-                brands.push(ele.name)
+        brands.push(ele.name);
       });
       this.form.sBrand = brands.toString();
       this.getData();
     },
     getData() {
-            return new Promise((resolve, reject) => {
+      this.load = true;
       let obj = Object.assign({}, this.getCtime2, this.form);
       getInteractCount0528C(obj).then((res) => {
         let data = res.data || [];
         let brandsList = [];
         let infoList = [];
-            data.forEach(e => {
+        data.forEach((e) => {
           brandsList.push(e.key);
           infoList.push(e.value);
-            })
-            this.opt = createSingleColumnar(brandsList, infoList);
-            resolve(data)
-            }).catch(() => {
-                reject(false)
         });
+        this.opt = createSingleColumnar(brandsList, infoList);
+        this.load = false;
       });
-        }
+    },
-    }
+  },
 };
 </script>
 

src/views/BrandComparison/weiboBigVComparison/index.vue

@@ -7,7 +7,7 @@
  * @FilePath: /data-show/src/views/BrandComparison/weiboBigVComparison/index.vue
 -->
 <template>
-  <div class="wbc-outter">
+  <div class="wbc-outter" v-loading="load">
     <v-label-div
       title="微博大V对比"
       :showLine="false"
@@ -26,6 +26,7 @@ export default {
   name: "weiboBigVComparison",
   data() {
     return {
+      load: false,
       form: {
         token: "",
         sBrand: "",
@@ -50,10 +51,22 @@ export default {
     getData() {
       return new Promise((resolve, reject) => {
         let obj = Object.assign({}, this.getCtime2, this.form);
+        this.load = true;
         getBoauthen0528C(obj)
           .then((res) => {
             let data = res.data || [];
-            this.opt = createOpt(data);
+            let dx = [];
+            data.forEach((ele) => {
+            let ab = ele.value || [];
+            // 匹配所有出现过的媒体，放入dx中
+            ab.forEach((e) => {
+                if (!dx.includes(e.key) && e.value != 0) {
+                dx.push(e.key);
+                }
+            });
+            });
+            this.opt = createOpt(dx,data);
+            this.load = false;
             resolve(data);
           })
           .catch(() => {

src/views/BrandComparison/weiboBigVComparison/opt.js

@@ -6,22 +6,77 @@
  * @Description: In User Settings Edit
  * @FilePath: /data-show/src/views/Index/spreadTheSound/opt.js
  */
-/*
+
-series: [
+import * as echarts from "echarts";
+
+let colors = [new echarts.graphic.LinearGradient(0, 0, 0, 1, [
   {
-              name: '奥迪',
+    offset: 0,
-              type: 'bar',
+    color: '#3373CC'
-              stack: 'total',
+  },
-              barWidth: 24,
+  {
-              emphasis: {
+    offset: 1,
-                focus: 'series'
+    color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+    offset: 0,
+    color: '#63AECC'
   },
-              data: [320, 302, 301, 334, 390]
+  {
+    offset: 1,
+    color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+    offset: 0,
+    color: '#54BF93'
   },
-*/
+  {
-function createData(dataList = []) {
+    offset: 1,
+    color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+    offset: 0,
+    color: '#CC9D12'
+  },
+  {
+    offset: 1,
+    color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+    offset: 0,
+    color: '#CC7733'
+  },
+  {
+    offset: 1,
+    color: '#071a32'
+  }
+], false), new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+  {
+    offset: 0,
+    color: '#CC5B41'
+  },
+  {
+    offset: 1,
+    color: '#071a32'
+  }
+], false)]
+
+function createData(dataList = [], dx = []) {
   let arr = [];
   dataList.forEach(ele => {
+    let a = [];
+    let Data = ele.value || [];
+    dx.forEach(e => {
+      Data.forEach(ex => {
+        if (ex.key === e) {
+          a.push(ex.value)
+        }
+      })
+    })
     let o = {
       name: ele.key,
       type: 'bar',
@@ -30,22 +85,21 @@ function createData(dataList = []) {
       emphasis: {
         focus: 'series'
       },
-      //索引各类型大v的值，0表示名人，1表示政府，2表示企业，3表示媒体，4表示个人大V
+      data: a
-      data: [ele.value[0].value, ele.value[3].value, ele.value[2].value, ele.value[1].value, ele.value[4].value]
     };
     arr.push(o);
   })
   return arr;
 }
 
-export default function createOpt(dataList = []) {
+export default function createOpt(dx = [], dataList = []) {
-  let info = createData(dataList);
+  let info = createData(dataList, dx);
   return {
     grid: {
-      left: 16,
+      left: 10,
-      right: 16,
+      right: '5%',
-      bottom: 16,
+      bottom: 10,
-      top: 56,
+      top: 52,
       containLabel: true
     },
     tooltip: {
@@ -58,25 +112,32 @@ export default function createOpt(dataList = []) {
       },
       extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;"
     },
+    color: colors,
     legend: {
       textStyle: { //图例文字的样式
-        color: '#fff'
+        color: '#fff',
+        fontSize: 10
       },
       y: 10,
-      x: 16
+      x: 16,
+      itemWidth: 12,
+      itemHeight: 12
     },
     xAxis: {
       type: 'category',
       axisTick: {
         show: false,
       },
+      axisLabel: {
+        interval: 0
+      },
       axisLine: {
         show: false,
         lineStyle: {
           color: "#fff",
         },
       },
-      data: ['名人', '媒体', '企业', '政府', '个人大v']
+      data: dx
     },
     yAxis: {
       type: 'value',

src/views/ModelComparison/keyMediaCommunicationComparison/opt.js

@@ -103,7 +103,6 @@ function createData(dataList = [], dx=[]) {
 }
 export default function createOpt(dx = [], ds = []) {
   const data = createData(ds,dx);
-  console.log(data)
   return {
     grid: {
       left: 10,