Echarts在线免费图表

 
            var dateList = [
  ['2017-3-1', 66],
  ['2017-3-2', 22],
  ['2017-3-3', 79],
  ['2017-3-4', '初七'],
  ['2017-3-5', '初八'],
  ['2017-3-6', '初九'],
  ['2017-3-7', '初十'],
  ['2017-3-8', '十一'],
  ['2017-3-9', 79],
  ['2017-3-10', '十三'],
  ['2017-3-11', '十四'],
  ['2017-3-12', '十五'],
  ['2017-3-13', '十六'],
  ['2017-3-14', '十七'],
  ['2017-3-15', '十八'],
  ['2017-3-16', '十九'],
  ['2017-3-17', '二十'],
  ['2017-3-18', '廿一'],
  ['2017-3-19', '廿二'],
  ['2017-3-20', '廿三'],
  ['2017-3-21', '廿四'],
  ['2017-3-22', 100],
  ['2017-3-23', '廿六'],
  ['2017-3-24', '廿七'],
  ['2017-3-25', '廿八'],
  ['2017-3-26', '廿九'],
  ['2017-3-27', '三十'],
  ['2017-3-28', '三月'],
  ['2017-3-29', '初二'],
  ['2017-3-30', '初三'],
  ['2017-3-31', '初四'],
];

var heatmapData = [];
var lunarData = [];
for (var i = 0; i < dateList.length; i++) {
  heatmapData.push([
      dateList[i][0],
      dateList[i][1],
  ]);
  lunarData.push([
      dateList[i][0],
      
      dateList[i][1],
      dateList[i][2]
  ]);
}

option = {
  tooltip: {
      formatter: function (params) {
          return 'SR Value: ' + params.value[1];
      }
  },
  visualMap: {
      show: false,
      min: 0,
      max: 100,
      calculable: true,
      seriesIndex: [1],
      orient: 'horizontal',
      left: 'center',
      bottom: 20,
      inRange: {
          color: ['#e0ffff', '#006edd'],
          opacity: 0.3
      },
      controller: {
          inRange: {
              opacity: 0.5
          }
      }
  },

  calendar: [{
      left: 'center',
      top: 'middle',
      cellSize: [100, 70],
      yearLabel: {show: false},
      orient: 'vertical',
      dayLabel: {
          firstDay: 1,
          nameMap: 'cn'
      },
      monthLabel: {
          show: true
      },
      range: '2017-03'
  }],

  series: [{
      type: 'scatter',
      coordinateSystem: 'calendar',
      symbol: 'diamond',
      symbolSize: 0.0001,
      label: {
          normal: {
              show: true,
              formatter: function (params) {
                  var d = echarts.number.parseDate(params.value[0]);
                  return d.getDate() + '\n\n' ;
              },
              textStyle: {
                  color: '#000'
              }
          }
      },
      data: lunarData
  },  {
      name: '降雨量',
      type: 'heatmap',
      coordinateSystem: 'calendar',
      data: heatmapData
  }]
};

myChart.on('click', function (params) {
  window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.value[1]));
});