vue中引用echarts设置渐变色new echarts不能用

需求需要设置透明渐变区域，在https://gallery.echartsjs.com 中找到如下图

其中渐变透明色代码中的color: new echarts 设置完报错

color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(0,150,239,0.3)'
                    },
                    {
                        offset: 1,
                        color: 'rgba(0,253,252,0)'
                    }
                ], false),

原因： main.js中引用了

import echarts from 'echarts'
Vue.prototype.$echarts = echarts

但是在当期页面中没引用 需要在页面中也要把echarts引用进来然后就可以了  import echarts from "echarts" 

<script>
import echarts from "echarts"   //引用这一句在当前位置
export default {
  name: 'home',
  data () {
    return {

    }
  },