Echarts在线免费图表

 
            var N_POINT = 90; // 角度
var YMAX = 10; // Y轴放大倍数

//正弦
var genSinItem = function (k) {
  return Math.sin((Math.PI / N_POINT) * 6 * k) * YMAX;
};
//方波
var genSquItem = function (k) {
  if (k % 2 === 0) {
    return 30;
  } else {
    return 20;
  }
};
//三角波
var genTriItem = function (k) {
  if (k % 2 === 0) {
    return 50;
  } else {
    return 40;
  }
};
var option = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      animation: false
    }
  },
  dataZoom: [
    {
      type: 'inside',
      realtime: true
    }
  ],
  xAxis: { type: 'category', min: 0, max: N_POINT },
  yAxis: {
    max: 50,
    min: -50
  },
  series: [
    {
      name: '正弦',
      type: 'line',
      data: Array.apply(null, Array(N_POINT)).map((item, i) => [
        i,
        genSinItem(i)
      ]),
      showSymbol: false
    },
    {
      name: '方波',
      type: 'line',
      step: 'start',
      data: Array.apply(null, Array(N_POINT)).map((item, i) => genSquItem(i)),
      showSymbol: false
    },
    {
      name: '三角波',
      type: 'line',
      data: Array.apply(null, Array(N_POINT)).map((item, i) => genTriItem(i)),
      showSymbol: false
    },
  ]
};
console.log('[option]', option);