ECharts: изменить цвет линии. У меня есть выбор 2 цвета. Оба двухцветных шоу, как нечетный и четный стиль - PullRequest
0 голосов
/ 30 апреля 2020

Я хочу, чтобы ro удалил этот пользовательский цвет и добавил этот цвет как l oop, как сначала красный цвет, затем зеленый. Od четный нечетный четный.

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'},
        }

         ]
    };

1 Ответ

1 голос
/ 02 мая 2020

Твой план идеален, что тебе мешает это сделать? В чем проблема блокирует следующие шаги?

Обновление: пожалуйста, не разделяйте вопрос на заголовок и текст, я с трудом понял, что вы имеете в виду. Заголовок должен содержать только краткое резюме вопроса.

Отвечая на ваш вопрос: самый простой вариант для контрольных цветов - это серия поколений с предварительно вычисленным цветом.

Примерно так:

  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>
...