vue中使用echarts

npm install echarts
import echarts from 'echarts';
Vue.prototype.$echarts = echarts;

//使用
 this.echarts = this.$echarts.init(document.querySelector('#echarts'));

设置柱条颜色为渐变色

{
            name: '饮水量',
            type: 'bar',
            data: [200, 620, 100, 1400, 1440],
            barWidth: 20,//柱宽
            itemStyle: {
              normal: {
                //颜色渐变
                color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                  offset: 0,
                  color: '#5A91E1'
                }, {
                  offset: 1,
                  color: '#5DB6F3'
                }])
              }
            }
          }
Logo

前往低代码交流专区

更多推荐