工作犬专业方向统计修改

src/views/dataJq/dogMajor.vue

 <template>
   <div class="dogMajor">
     <div class="dogMajor_title">
-      <span>工作犬专业方向top5统计</span>
+      <span>工作犬专业方向统计</span>
     </div>
     <div class="dogMajor_co">
       <div
@@ -22,18 +22,33 @@ export default {
     },
   },
   data() {
-    return {};
+    return {
+      offsetZero: [
+        "rgba(78, 187, 255, 1)",
+        "rgba(241, 166, 54, 1)",
+        "rgba(255, 102, 78, 1)",
+        "rgba(46, 223, 209, 1)",
+        "rgba(255, 172, 39, 1)",
+      ],
+      offsetOne: [
+        "rgba(134, 223, 255, 0.05)",
+        "rgba(241, 166, 54, 0.05)",
+        "rgba(255, 102, 78, 0.05)",
+        "rgba(46, 223, 209, 0.05)",
+        "rgba(255, 172, 39, 0.05)",
+      ],
+    };
   },
   methods: {
     xyrzyRender(_name, _value) {
-      // console.log('_name, _value',_name)
+      // console.log("_name, _value", _name, _value);
       //案件性质发案分析
       // debugger;
       // 基于准备好的dom，初始化echarts实例
       let myChart = this.$echarts.init(document.getElementById("dogMajors"));
       // 绘制图表
       myChart.setOption({
-        color: ["#4db7f8", "#fa654f", "#ffc64e"],
+        // color: ["#4db7f8", "#fa654f", "#ffc64e"],
         xAxis: {
           type: "category",
           data: _name,
@@ -78,29 +93,6 @@ export default {
             type: "bar",
             itemStyle: {
               normal: {
-                //柱体的颜色
-                //右，下，左，上（1，0，0，0）表示从正右开始向左渐变
-                color: new echarts.graphic.LinearGradient(
-                  0,
-                  0,
-                  0,
-                  1,
-                  [
-                    {
-                      offset: 0,
-                      color: "#4EBBFF",
-                    },
-                    {
-                      offset: 0.5,
-                      color: "#3a749b",
-                    },
-                    {
-                      offset: 1,
-                      color: "#0c2b47",
-                    },
-                  ],
-                  false
-                ),
                 label: {
                   formatter: "{c}",
                   show: true,
@@ -129,9 +121,26 @@ export default {
     setTimeout(() => {
       let _name = [],
         _value = [];
+      let index = 0;
       for (let item in this.qzCount.major) {
         _name.push(item);
-        _value.push(this.qzCount.major[item]);
+        _value.push({
+          name: item,
+          value: this.qzCount.major[item],
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: this.offsetZero[index],
+              },
+              {
+                offset: 1,
+                color: this.offsetOne[index],
+              },
+            ]),
+          },
+        });
+        index++;
       }
       this.xyrzyRender(_name, _value);
     }, 1000);