SOURCE

const colors = ['#05cdfa', '#05faa5', '#fab55b'];
const tooltip = {
  trigger: "axis",
  backgroundColor: 'rgba(0, 80, 162, 0.5)',
  axisPointer: {
    type: 'line',
    lineStyle: {
      color: 'rgba(0, 80, 162, 0.5)' //'#0eadff'
    }
  },
 formatter: function (params) {
        if (params instanceof Array) {
            let items = params.map((x, i) => `<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:${colors[i]};"></span>${x.seriesName}:${Number(x.value[1]).toFixed(0)}`);
            return `${params[0].name}<br/>${items.join('<br/>')}`;
        }
    }
}
const legendItem =function(items) {
    return items.map(name => {
        return {
            name: name, icon: 'square',
            textStyle: {
                padding: [0, 15, 0, -10],
            }
        }
    });
};
const legend = {
    bottom: 0,
    data: legendItem(['风速', '流变器有功功率', '理论有功功率']) 
};
function randomData(i) {
  let time = new Date(moment('2000-01-01').add('minutes', i).valueOf());
  value = value + Math.random() * 21 - 10;
  return {
    name: moment(time.valueOf()).format('HH:mm'),
    value: [time, Math.round(value)],
  }
}

var s1 = [];
var s2 = [];
var s3 = [];
var value = Math.random() * 20;
for (var i = 0; i <= 24 * 60; i += 15) {
  s1.push(randomData(i));
}
value = Math.random() * 80;
for (var i = 0; i <= 24 * 60; i += 15) {
  s2.push(randomData(i));
}
value = Math.random() * 80;
for (var i = 0; i <= 24 * 60; i += 15) {
  s3.push(randomData(i));
}
console.log(s1.length);
option = {
  color: colors,
  tooltip: tooltip,
  legend:legend,
  grid: {
    top: 70,
    bottom: 50
  },
  xAxis: [{
    type: 'time',
    splitLine: {
      show: false
    },
    axisLine: {
      lineStyle: {
        color: '#316C8E'
      }
    },
    interval: 3600 * 4 * 1000,
    axisLabel: {
      formatter: function(value, index) {
        let time = moment(value);
        if (index > 0 && time.format('HH') === '00') {
          return '24:00'
        }
        return time.format('HH:mm')
      }
    }
  },
  ],
  yAxis: [{
    name: '风速(m/s)',
    type: 'value',
    max: 40,
    min: 0,
    interval: 8,
    axisLine: {
      show: false
    }
  },
  {
    name: '有功功率(MW)',
    type: 'value',
    max: 100,
    min: 0,
    interval: 20,
    axisLine: {
      show: false,
    }
  }],
  series: [{
    name: '风速',
    type: 'line',
    smooth: true,
    data: s1
  },
  {
    name: '流变器有功功率',
    type: 'line',
    smooth: true,
    yAxisIndex: 1,
    data: s2
  },
  {
    name: '理论有功功率',
    type: 'line',
    smooth: true,
    yAxisIndex: 1,
    data: s3
  }]
};

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

<div id="main" style="width:100%;height:400px;">
</div>