echarts折线图在鼠标移入时折线消失问题

本文已参与「新人创作礼」活动， 一起开启掘金创作之路。

这两天在用echarts画折线图，本来挺简单的功能，以前也没什么问题，结果今天遇到一个难缠的问题，就是折线图画好之后没问题，但是在鼠标移入chart时折线消失消失了，但是上面的小圆点还在，也没影响tooltip的显示。 具体情况就是这样：

但是呢，鼠标移入之后百度这条线消失了：

不要折线下背景色看的更清楚：

这里是我的option代码：

          title: {
            show: false,
          },
          tooltip: {
            show: true,
            trigger: 'axis',
          },
          legend: {
            data: ['百度', '谷歌'],
            show: true,
            selectedMode: true,
            top: 'top',
            right: 0,
            orient: 'vertical',
          },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
          },
          yAxis: {
            type: 'value',
          },
          series: [
            {
              name: '百度',
              data: [65, 78, 130, 65, 56, 73, 89],
              type: 'line',
              smooth: true,
              itemStyle: {
                // 折线的颜色
                color: 'rgb(249,120,69,1)',
              },
              areaStyle: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: 'rgba(249,120,69,0.8)',
                  },
                  {
                    offset: 1,
                    color: 'rgba(249,120,69,0.3)',
                  },
                ]),
              },
            },
            {
              name: '谷歌',
              data: [65, 56, 123, 36, 32, 69, 78],
              type: 'line',
              smooth: true,
              itemStyle: {
                // 折线的颜色
                color: 'rgba(58,77,233,1)',
              },
              areaStyle: {
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: 'rgba(58,77,233,0.8)',
                  },
                  {
                    offset: 1,
                    color: 'rgba(58,77,233,0.3)',
                  },
                ]),
              },
            },
          ],
        }

查API也没发现什么异常, 后来发现了问题所在，比较狗血：折线的颜色写的有点问题，本来是想把rgba改成rgb的，结果后来ctrl+z撤销的时候多撤销了一步，把 rgba(249,120,69,1) 删除的后面的1又给返回了...

// 这么写没问题
 itemStyle: {
    // 折线的颜色
    color: 'rgb(249,120,69)',
},

// 这么写也没问题
itemStyle: {
    // 折线的颜色
    color: '#f97846',
},

// 可我偏偏是这么写的
 itemStyle: {
    // 折线的颜色
    color: 'rgb(249,120,69,1)',
  },

发现问题所在了吗：

弄了半天这是个狗血的乌龙，我也是醉了。

关键是写的这个颜色有问题，看起来显示啥的也正常，但是鼠标放上去就不正常了，所以不好排查。

好吧这个狗血的问题是一个关于细心的问题。