index.html 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <script type="text/javascript" src="js/jquery.js"></script>
  6. <link rel="stylesheet" href="css/comon0.css">
  7. </head>
  8. <script>
  9. $(window).load(function(){
  10. $(".loading").fadeOut()
  11. })
  12. /****/
  13. $(document).ready(function(){
  14. var whei=$(window).width()
  15. $("html").css({fontSize:whei/20})
  16. $(window).resize(function(){
  17. var whei=$(window).width()
  18. $("html").css({fontSize:whei/20})
  19. });
  20. });
  21. </script>
  22. <script type="text/javascript" src="js/echarts.min.js"></script>
  23. <script language="JavaScript" src="js/js.js"></script>
  24. <body>
  25. <div class="canvas" style="opacity: .2">
  26. <iframe frameborder="0" src="js/index.html" style="width: 100%; height: 100%"></iframe>
  27. </div>
  28. <div class="loading">
  29. <div class="loadbox"> <img src="picture/loading.gif"> 页面加载中... </div>
  30. </div>
  31. <div class="head">
  32. <h1>大数据可视化展板通用模板</h1>
  33. <div class="weather"><!--<img src="picture/weather.png"><span>多云转小雨</span>--><span id="showTime"></span></div>
  34. <script>
  35. var t = null;
  36. t = setTimeout(time,1000);//開始运行
  37. function time()
  38. {
  39. clearTimeout(t);//清除定时器
  40. dt = new Date();
  41. var y=dt.getFullYear();
  42. var mt=dt.getMonth()+1;
  43. var day=dt.getDate();
  44. var h=dt.getHours();//获取时
  45. var m=dt.getMinutes();//获取分
  46. var s=dt.getSeconds();//获取秒
  47. document.getElementById("showTime").innerHTML = y+"年"+mt+"月"+day+"-"+h+"时"+m+"分"+s+"秒";
  48. t = setTimeout(time,1000); //设定定时器,循环运行
  49. }
  50. </script>
  51. </div>
  52. <div class="mainbox">
  53. <ul class="clearfix">
  54. <li>
  55. <div class="boxall" style="height: 3.2rem">
  56. <div class="alltitle">模块标题样式</div>
  57. <div class="allnav" id="echart1"></div>
  58. <div class="boxfoot"></div>
  59. </div>
  60. <div class="boxall" style="height: 3.2rem">
  61. <div class="alltitle">模块标题样式</div>
  62. <div class="allnav" id="echart2"></div>
  63. <div class="boxfoot"></div>
  64. </div>
  65. <div class="boxall" style="height: 3.2rem">
  66. <div style="height:100%; width: 100%;">
  67. <div class="sy" id="fb1"></div>
  68. <div class="sy" id="fb2"></div>
  69. <div class="sy" id="fb3"></div>
  70. </div>
  71. <div class="boxfoot">
  72. </div>
  73. </div>
  74. </li>
  75. <li>
  76. <div class="bar">
  77. <div class="barbox">
  78. <ul class="clearfix">
  79. <li class="pulll_left counter">12581189</li>
  80. <li class="pulll_left counter">3912410</li>
  81. </ul>
  82. </div>
  83. <div class="barbox2">
  84. <ul class="clearfix">
  85. <li class="pulll_left">2018年总收入情况 </li>
  86. <li class="pulll_left">2018年总支出情况</li>
  87. </ul>
  88. </div>
  89. </div>
  90. <div class="map">
  91. <div class="map1"><img src="picture/lbx.png"></div>
  92. <div class="map2"><img src="picture/jt.png"></div>
  93. <div class="map3"><img src="picture/map.png"></div>
  94. <div class="map4" id="map_1"></div>
  95. </div>
  96. </li>
  97. <li>
  98. <div class="boxall" style="height:3.4rem">
  99. <div class="alltitle">模块标题样式</div>
  100. <div class="allnav" id="echart4"></div>
  101. <div class="boxfoot"></div>
  102. </div>
  103. <div class="boxall" style="height: 3.2rem">
  104. <div class="alltitle">模块标题样式</div>
  105. <div class="allnav" id="echart5"></div>
  106. <div class="boxfoot"></div>
  107. </div>
  108. <div class="boxall" style="height: 3rem">
  109. <div class="alltitle">模块标题样式</div>
  110. <div class="allnav" id="echart6"></div>
  111. <div class="boxfoot"></div>
  112. </div>
  113. </li>
  114. </ul>
  115. </div>
  116. <div class="back"></div>
  117. <script type="text/javascript" src="js/china.js"></script>
  118. <script type="text/javascript" src="js/area_echarts.js"></script>
  119. </body>
  120. </html>