echart实现渐变色-vue2

最新推荐文章于 2024-09-25 18:15:20 发布

墨·殇

最新推荐文章于 2024-09-25 18:15:20 发布

阅读量238

点赞数 2

文章标签： javascript 前端 angular.js

本文链接：https://blog.csdn.net/freedms/article/details/142481505

版权

let selectData5 = [
            {
              name: "有功电量",
              type: "bar",
              data: data.data.historyKwhList,
              unit: "MW",
              itemStyle: {
                // 使用渐变色
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [
                    {
                      offset: 0,
                      color: "#04C886",
                    },
                    {
                      offset: 1,
                      color: "#00595400",
                    },
                  ],
                  global: false,
                },
              },
            },
          ];
          this.barData5 = {
            legend: {
              left: "center",
            },
            xAxis: [
              {
                type: "category",
                axisTick: { show: false },
                data: data.data.dateList,
                axisLabel: {
                  formatter: function (params) {
                    return params && params.substr(0);
                  },
                },
              },
            ],
            yAxis: [
              {
                type: "value",
              },
            ],
            series: selectData5,
          };