eChart 中折线图保持series和lengen中lineStyle和itemStyle的颜色一致性

摘要：我在使用eChart时碰到了一个奇怪的问题，我的legend的颜色和对应的line的颜色不一致，通过阅读文档我找到了解决问题的方案，记录在此。

1. series 文档描述

lineStyle 颜色对应序列中的线条的颜色； itemStyle 颜色对应序列中的折线图中关节点的颜色；

2. 设置序列的 line 相关颜色

series: [{
    type: "line",
    seriesLayoutBy: "row",
    lineStyle: {
      color: '#003366'
    },
    itemStylez: {
      color: '#003366'
    },
}, {
    type: "line",
    seriesLayoutBy: "row",
    lineStyle: {
      color: '#006699'
    },
    itemStyle: {
      color: '#006699'
    },
}, {
    type: "line",
    seriesLayoutBy: "row",
    lineStyle: {
      color: '#4cabce'
    },
    itemStyle: {
      color: '#4cabce'
    },
}, {
    type: "line",
    seriesLayoutBy: "row",
    lineStyle: {
      color: '#e5323e'
    },
    itemStyle: {
      color: '#e5323e'
    },
}]

3. legend 文档描述

lineStyle 颜色对应图例中的线条的颜色； itemStyle 颜色对应图例中的折线图中关节点的颜色；

4. lengend中相应颜色属性设置为 inherit 来集成 series中相应的颜色

  legend: {
    lineStyle: { color: 'inherit', cap: 'square', join: 'round' },
    itemStyle: { color: 'inherit' }
  },

5. 需要注意

当给 lengend 中相应属性设置为 inherit 时，如果看到设置没有生效，需要关注下，是否是 series 中相应的属性没有设置值，无法继承或继承的是 eChart 自动生成的数据。