Browse Source

柱状图修改

maxiaoxiao 3 months ago
parent
commit
f26117bc6b
1 changed files with 7 additions and 5 deletions
  1. 7 5
      src/components/echarts/bar.vue

+ 7 - 5
src/components/echarts/bar.vue

@@ -23,8 +23,8 @@ let option = {
   },
   legend: {
     data: [], //"收储面积", "收储个数"
-    left: "7%",
-    top: "5%",
+    // left: "7%",
+    // top: "5%",
     textStyle: {
       color: "#666666",
     },
@@ -34,6 +34,7 @@ let option = {
     show: false,
   },
   xAxis: {
+    type: "category",
     axisTick: { show: false },
     axisLine: { lineStyle: { color: "#BCD3E5" } },
     axisLabel: {
@@ -162,15 +163,16 @@ export default {
         this.myChart = this.$echarts.init(this.$refs.echart);
       }
       option.legend.data = v.legend;
+      option.legend.show = v.legend.length;
       option.xAxis.data = v.xData;
       option.yAxis[0].name = v.yName || "变化面积/km²";
       option.series = [];
       v.yData.forEach((item, k) => {
         let o = cloneDeep(seriesItem); // JSON.parse(JSON.stringify(seriesItem));
-        o.name = v.xData[k];
+        o.name = v.legend[k];
         o.data = item;
-        o.stack = v.stack||undefined
-        o. barWidth=v.barWidth|| "12px"
+        o.stack = v.stack || undefined;
+        o.barWidth = v.barWidth || "12px";
         // alldata = [...alldata, ...o.data];
         // if (v.interval) {
         //   option.xAxis.axisLabel.interval = 0;