index.html 3.8 KB

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