box5.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. /*大屏*/
  2. var dom = document.getElementById("box5");
  3. var myChart = echarts.init(dom);
  4. var app = {};
  5. option = null;
  6. var dataCount = 5e5;
  7. var data = generateData(dataCount);
  8. var option = {
  9. title: {
  10. textStyle:{//图例文字的样式
  11. color:'#fff',
  12. fontSize:12
  13. },
  14. text: echarts.format.addCommas(dataCount) + ' Data',
  15. left: 10
  16. },
  17. toolbox: {
  18. feature: {
  19. dataZoom: {
  20. yAxisIndex: false
  21. },
  22. saveAsImage: {
  23. pixelRatio: 2
  24. }
  25. }
  26. },
  27. tooltip: {
  28. trigger: 'axis',
  29. axisPointer: {
  30. type: 'shadow'
  31. }
  32. },
  33. grid: {
  34. bottom: 90
  35. },
  36. dataZoom: [{
  37. type: 'inside'
  38. }, {
  39. type: 'slider'
  40. }],
  41. textStyle:{//图例文字的样式
  42. color:'#fff',
  43. fontSize:12
  44. },
  45. xAxis: {
  46. data: data.categoryData,
  47. silent: false,
  48. splitLine: {
  49. show: false
  50. },
  51. splitArea: {
  52. show: false
  53. }
  54. },
  55. yAxis: {
  56. splitArea: {
  57. show: false
  58. }
  59. },
  60. series: [{
  61. type: 'bar',
  62. data: data.valueData,
  63. // Set `large` for large data amount
  64. large: true
  65. }]
  66. };
  67. function generateData(count) {
  68. var baseValue = Math.random() * 1000;
  69. var time = +new Date(2011, 0, 1);
  70. var smallBaseValue;
  71. function next(idx) {
  72. smallBaseValue = idx % 30 === 0
  73. ? Math.random() * 700
  74. : (smallBaseValue + Math.random() * 500 - 250);
  75. baseValue += Math.random() * 20 - 10;
  76. return Math.max(
  77. 0,
  78. Math.round(baseValue + smallBaseValue) + 3000
  79. );
  80. }
  81. var categoryData = [];
  82. var valueData = [];
  83. for (var i = 0; i < count; i++) {
  84. categoryData.push(echarts.format.formatTime('yyyy-MM-dd\nhh:mm:ss', time));
  85. valueData.push(next(i).toFixed(2));
  86. time += 1000;
  87. }
  88. return {
  89. categoryData: categoryData,
  90. valueData: valueData
  91. };
  92. }
  93. ;
  94. if (option && typeof option === "object") {
  95. myChart.setOption(option, true);
  96. }