使用渐变色new echarts.graphic.LinearGradient报错

[swey01]

使用渐变色new echarts.graphic.LinearGradient报错

[hustcc]

报错请告知错误问题，截图。，运行环境。版本。

[swey01]

运行环境： win10 ， 版本：2.0.8， 错误：[

](url)

[hustcc]

把你的代码贴出来，不要用截图，我本地复现这个错误看看！

[swey01]

getOptionAir = () => {
        let datas = { counts: [32, 75, 52], date: ['2-5', '2-6', '2-7'] }
        return {
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    label: {
                        backgroundColor: '#6a7985'
                    }
                },
                formatter: '{c}(°C)'
            },
            title: {
                text: '温度(°C)',
                textStyle: {
                    fontWeight: 'normal',
                    fontSize: 12,
                    color: '#F1F1F3'
                },
                left: '2%',
                top: '-5px'
            },
            grid: {
                top: '18%',
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                    // boundaryGap: false,
                    axisLine: {
                        lineStyle: {
                            color: '#272847'
                        }
                    },
                    axisTick: {
                        show: false
                    },
                    splitLine: {
                        show: false
                    },
                    axisLabel: {
                        color: '#ccc'
                    },
                    data: datas ? datas.date : 0
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    axisLine: {
                        show: false
                    },
                    axisTick: {
                        show: false
                    },
                    axisLabel: {
                        color: '#ccc'
                    },
                    splitLine: {
                        show: false,
                        lineStyle: {
                            color: ['#eee']
                        }
                    },
                    splitNumber: 4,
                    minInterval: 2
                    // interval: 1
                }
            ],
            series: [
                {
                    name: '用户统计',
                    type: 'line',
                    smooth: true,
                    symbol: 'circle',
                    symbolSize: 5,
                    showSymbol: false,
                    lineStyle: {
                        normal: {
                            width: 1
                        }
                    },
                    areaStyle: {
                        normal: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ //填充的颜色。
                    offset: 0, // 0% 处的颜色
                    color: 'rgba(137, 189, 27, 0.3)'
                }, {
                    offset: 0.8, // 80% 处的颜色
                    color: 'rgba(137, 189, 27, 0)'
                }], false),
                shadowColor: 'rgba(0, 0, 0, 0.1)', //阴影颜色。支持的格式同color
                shadowBlur: 10 //图形阴影的模糊大小。该属性配合 shadowColor,shadowOffsetX, shadowOffsetY 一起设置图形的阴影效果
            }
                    },
                    itemStyle: {
                        normal: {
                            color: '#2fe2d4',
                            borderColor: 'rgba(133,182,255,0.27)',
                            borderWidth: 12

                        }
                    },
                    data: datas ? datas.counts : [0]
                }
            ]
        }
    }

[hustcc]

这个应该是 option 写的不规范，请参考 echarts 官方文档。

[xuexiaoao]

new echarts.graphic.LinearGradient

这个echarts从哪里引入的呢

import echarts from 'echarts'

还是

import ReactEcharts from 'echarts-for-react';

[hustcc]

import echarts from 'echarts'

[CN-3211]

今天我师父刚遇到这个问题，仅供参考： import echarts from 'echarts/lib/echarts'; import "echarts/lib/component/graphic"; new echarts.graphic.LinearGradient 之前我引用的vue-echart，然后再按需引入对应的组件。如果要用echarts的渐变色，就得直接引入echarts和这个graphic而不是通过vue-echarts引入。

[refanbanzhang]

这个应该是 option 写的不规范，请参考 echarts 官方文档。

不是写法问题，是默认的导出方式没有暴露echarts.graphic.LinearGradient相关功能 需要这样引入

import * as echarts from 'echarts';

[hekuan0916]

牛哇 解决了我的问题 @CN-3211

[dorislnhe]

这个应该是 option 写的不规范，请参考 echarts 官方文档。

不是写法问题，是默认的导出方式没有暴露echarts.graphic.LinearGradient相关功能 需要这样引入

import * as echarts from 'echarts';

66666666666666666666666