left2.js 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. // 初始化echart实例对象
  2. //
  3. var left2Chart = echarts.init(document.getElementById('left2'), 'dark');
  4. // 指定图表的配置项和数据
  5. // ----------左2的配置项-------------------
  6. var option = {
  7. title: {
  8. text: '全国新增趋势',
  9. textStyle: {
  10. color: 'white',
  11. },
  12. left: 'left',
  13. },
  14. tooltip: {
  15. trigger: 'axis',
  16. //指示器
  17. axisPointer: {
  18. type: 'line',
  19. lineStyle: {
  20. color: '#7171C6'
  21. }
  22. },
  23. },
  24. //图例
  25. legend: {
  26. data: ['新增确诊', '新增疑似'],
  27. left: 'right'
  28. },
  29. //图形位置
  30. grid: {
  31. left: '4%',
  32. right: '6%',
  33. bottom: '4%',
  34. top: 50,
  35. containLabel: true
  36. },
  37. xAxis: [{
  38. type: 'category',
  39. data: [] // ['03.20', '03.21', '03.22']
  40. }],
  41. yAxis: [{
  42. type: 'value',
  43. //y轴字体设置
  44. axisLabel: {
  45. show: true,
  46. color: 'white',
  47. fontSize: 12,
  48. formatter: function(value) {
  49. if (value >= 1000) {
  50. value = value / 1000 + 'k';
  51. }
  52. return value;
  53. }
  54. },
  55. //y轴线设置显示
  56. axisLine: {
  57. show: true
  58. },
  59. //与x轴平行的线样式
  60. splitLine: {
  61. show: true,
  62. lineStyle: {
  63. color: '#17273B',
  64. width: 1,
  65. type: 'solid',
  66. }
  67. }
  68. }],
  69. series: [{
  70. name: '新增确诊',
  71. type: 'line',
  72. smooth: true,
  73. data: [] // [20, 406, 529]
  74. }, {
  75. name: '新增疑似',
  76. type: 'line',
  77. smooth: true,
  78. data: [] // [25, 75, 122]
  79. }]
  80. };
  81. var chinaDayAddList = data.chinaDayAddList
  82. for (var day of chinaDayAddList) {
  83. // 将每个省的累计确诊病例数添加到配置项的data中
  84. option.xAxis[0].data.push(day.date)
  85. option.series[0].data.push(day.confirm)
  86. option.series[1].data.push(day.suspect)
  87. }
  88. // 使用刚指定的配置项和数据显示图表。
  89. left2Chart.setOption(option);