drawGrid.html 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. </head>
  5. <body>
  6. <div style="width: 500px">
  7. <svg id="chart-1" viewBox="0 0 80 40">
  8. </svg>
  9. </div>
  10. <link rel="stylesheet" href="css/drawGridStyle.css" media="screen" type="text/css" />
  11. <script src='js/jquery.js'></script>
  12. <script src='js/snap.svg-min.js'></script>
  13. <script src="js/drawGrid.js"></script>
  14. <script>
  15. var chart_1_list = [
  16. 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0,0,0,0,0,0,0,0,0,0,0,
  17. ];
  18. drawGrid('#chart-1');
  19. drawLineGraph('#chart-1', chart_1_list, 1,100,0);
  20. setInterval(function(){
  21. //要执行的代码
  22. // drawGrid('#chart-1');
  23. // chart_1_list.shift();
  24. // chart_1_list.push(Math.ceil( Math.random()*10))
  25. // drawLineGraph('#chart-1', chart_1_list, 1);
  26. // chart_1_list.shift();
  27. chart_1_list.push(chart_1_list.shift() + Math.ceil( Math.random()*10));
  28. if(Math.abs(Math.max.apply(Math,chart_1_list) - Math.min.apply(Math,chart_1_list)) > 0 ){
  29. drawGrid('#chart-1');
  30. drawLineGraph('#chart-1', chart_1_list, 1,100,0);
  31. }
  32. },200);
  33. </script>
  34. </body>
  35. </html>