ECharts: change line color. i have pick 2 color .Both two color show like odd and even style

Question

i want ro remove that custom color and add that color as loop like first color red then green .odd even odd even.

option = {
        xAxis: {
            type: 'category',
            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
        },
        yAxis: {
            type: 'value'
        },
        series: [{
            data: [820, 932, 901, 934, 1290, 1330, 1320],
            type: 'line',
            itemStyle: { color: 'green'},

        },
        {
            name: '邮件营销',
            type: 'line',
            stack: '总量',
            data: [120, 132, 101, 134, 90, 230, 210],
         itemStyle: { color: 'red'},
        }

         ]
    };

Sergey Fedorov · Accepted Answer · 2020-05-02T05:52:21.897

Your plan is perfect, what's stopping you do it? What the problem blocks the next steps?

Update: please don't separate question to title and body, I hardly understood what you mean. Title should contain only short summary of question.

Answering your question: the easiest option for control colors is generation series with precomputed color.

Something like this:

  var myChart = echarts.init(document.getElementById('main'));

  var data = [
    [120, 132, 101, 134, 90, 230, 210],
    [340, 280, 310, 360, 280, 310, 410],
    [520, 532, 490, 480, 520, 550, 570],
    [760, 732, 790, 780, 820, 750, 770],
   [820, 932, 901, 934, 1290, 1330, 1320],
  ];

  var series = data.map((sData, idx) => (
    {
      name:  'series' + idx,
      type:  'line',
      data:  sData,
      color: idx % 2 === 0 ? 'red' : 'green',
    }
  ))

  var option = {
    xAxis: {
      type: 'category',
      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
      type: 'value'
    },
    series: series,
  };

  myChart.setOption(option);

<script src="https://cdn.jsdelivr.net/npm/echarts@4.7.0/dist/echarts.js"></script>
<div id="main" style="width: 600px;height:400px;"></div>

Is there any way you can separate your comments out into comments on the Question? — Scratte, May 02 '20 at 11:44
I made this for prevent to break the context but you can try to start read from "Answering your question" and below. — Sergey Fedorov, May 02 '20 at 15:09

ECharts: change line color. i have pick 2 color .Both two color show like odd and even style

1 Answers1