vchart的使用记录

由于之前使用echarts比较多，项目里面使用vchart也比较方便，尝试一下，发现vchart没有echart的配置仔细，这也浪费比较多时间，下面是使用的一些场景，记录一下，方便自己后续使用。

y轴跟图表的距离

具体代码

 yAxis: {
          axisLine: {
            lineStyle: {
              color: '#999999'
            }
          },
           offset: 20
        },
        grid: {
          top: 100,
          backgroundColor: '#F8F8F8',
          containLabel: true, 
          left: 20
        },

去掉标线上的小圆点

legend: {
          left: 0,
          top: 50,
          itemHeight: 0, //圆点大小
          itemWidth: 20, // 线的长度
        }

设置区域图的渐变

this.colors = [
      new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        offset: 0, color: 'rgba(46, 189, 133, 0.5)'
      }, {
        offset: 1, color: 'rgba(46, 189, 133, 0)'
      }]),
      new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        offset: 0, color: 'rgba(253, 168, 6, 0.6)'
      }, {
        offset: 1, color: 'rgba(253, 168, 6, 0)'
      }]),
      new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{
        offset: 0, color: '#9259D1'
      }, {
        offset: 1, color: '#9259D1'
      }]),
    ];

总结：vchart是echart的vue版本，使用的文档很少，可以去echart的官方文档调试好，再根据vcharts的使用去修改即可，多看看配置项使用手册，减少踩坑，少花费时间。