不用vue框架的時候, 顏色是可以正常修改, 這是之前修改這里可以改變背景顏色, 用了vue之后就不行了

代碼

/* 統(tǒng)計柱狀圖 */
// 基于準(zhǔn)備好的dom，初始化echarts實例
var myChart = echarts.init(document.getElementById("main"));

// 指定圖表的配置項和數(shù)據(jù)
var statistics = {
  title: {
    text: "面積",
    textStyle: {
      fontWeight: "normal",
      color: "#fff", // 標(biāo)題顏色
      fontSize: 14
    },
    left: "center"
  },
  tooltip: {
    // 鼠標(biāo)移動柱狀圖是提示文字
    show: true
  },
  legend: {
    // data: ['面積'],
    textStyle: {
      fontSize: 12
    }
  },
  // 橫坐標(biāo)
  xAxis: {
    data: ["灌木", "森林", "森林", "樹木", "小樹", "大樹", "紅樹"],
    axisLabel: {
      show: true,
      textStyle: {
        color: "#fff"
      }
    },
    axisLine: {
      lineStyle: {
        color: "#094060"
      }
    }
  },
  // 縱坐標(biāo)
  yAxis: {
    // 設(shè)置坐標(biāo)軸字體顏色
    axisLine: {
      lineStyle: {
        color: "#094060"
      }
    },
    axisLabel: {
      show: true,
      textStyle: {
        color: "#fff"
      }
    },
    splitLine: {
      lineStyle: {
        color: ["#07405c"]
      }
    }
  },
  //配置樣式
  itemStyle: {
    //通常情況下：
    normal: {
      //每個柱子的顏色即為colorList數(shù)組里的每一項，如果柱子數(shù)目多于colorList的長度，則柱子顏色循環(huán)使用該數(shù)組
      color: function(params) {
        var colorList = ["#069f71"];
        return colorList[params.dataIndex % colorList.length];
      }
    },
    //鼠標(biāo)懸停時：
    emphasis: {
      shadowBlur: 10,
      shadowOffsetX: 0,
      shadowColor: "rgba(0, 0, 0, 0.5)"
    }
  },
  series: [
    {
      type: "bar",
      barWidth: 50, // 設(shè)置柱的寬度
      data: [38, 23, 35, 12, 26, 8, 36]
    }
  ]
};

// 使用剛指定的配置項和數(shù)據(jù)顯示圖表。
myChart.setOption(statistics);