index.html 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <title>物流大数据平台</title>
  8. <link rel="stylesheet" href="../css/bootstrap.css">
  9. <link rel="stylesheet" href="../css/base.css">
  10. <link rel="stylesheet" href="../css/style.css">
  11. <style>
  12. .t_btn {
  13. margin-top: 20px;
  14. }
  15. .t_btn li {
  16. display: inline-block;
  17. margin: 0 0px 20px 20px;
  18. }
  19. .t_btn button,
  20. .t_a {
  21. display: inline-block;
  22. padding: 10px 5px;
  23. width: 80px;
  24. border-style: solid;
  25. border-width: 0;
  26. cursor: pointer;
  27. font-family: inherit;
  28. font-weight: bold;
  29. line-height: normal;
  30. margin: 0 0 0.5em 0;
  31. position: relative;
  32. text-decoration: none;
  33. text-align: center;
  34. display: inline-block;
  35. font-size: 1em;
  36. background-color: #2C58A6;
  37. border-color: #0263ff;
  38. color: white;
  39. box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.2) inset !important;
  40. margin-right: 0.5em;
  41. border-radius: 4px;
  42. }
  43. .t_height {
  44. line-height: 80px;
  45. position: absolute;
  46. right: 28px;
  47. top: 0;
  48. }
  49. </style>
  50. </head>
  51. <body>
  52. <!--header-->
  53. <div class="header">
  54. <div class="bg_header">
  55. <div class="header_nav fl t_title">
  56. 物流大数据服务平台
  57. </div>
  58. </div>
  59. <div class="header_nav fl">
  60. </div>
  61. <div class="header_myself fr t_height">
  62. <a class="t_a" href="../index.html">返回 &nbsp;</a>
  63. </div>
  64. </div>
  65. <!--main-->
  66. <div class="data_content">
  67. <div class="data_main">
  68. <div class="main_left fl">
  69. <div class="left_1">
  70. <ul class="t_btn">
  71. <li>
  72. <button class="t_btn0">中国地图</button>
  73. </li>
  74. <li>
  75. <button class="t_btn3">中国铁路</button>
  76. </li>
  77. <li>
  78. <button class="t_btn14">GPS</button>
  79. </li>
  80. <li>
  81. <button class="t_btn13">湖南省</button>
  82. </li>
  83. <li>
  84. <button class="t_btn2">湖南飞机场</button>
  85. </li>
  86. <li>
  87. <button class="t_btn4">湖南铁路</button>
  88. </li>
  89. <li>
  90. <button class="t_btn1">湖南公路</button>
  91. </li>
  92. <li>
  93. <button class="t_btn6">交通就业量</button>
  94. </li>
  95. <li>
  96. <button class="t_btn7">湖南货运量</button>
  97. </li>
  98. <li>
  99. <button class="t_btn5">各市货运量</button>
  100. </li>
  101. <li>
  102. <button class="t_btn8">货物周转量</button>
  103. </li>
  104. <li>
  105. <button class="t_btn9">运输线长度</button>
  106. </li>
  107. <li>
  108. <button class="t_btn10">湖南业务量</button>
  109. </li>
  110. <li>
  111. <button class="t_btn11">营运汽车</button>
  112. </li>
  113. <li>
  114. <button class="t_btn12">公共交通</button>
  115. </li>
  116. </ul>
  117. </div>
  118. <div class="left_2" style="display:none">
  119. <div class="main_title">
  120. 湖南省地图
  121. </div>
  122. </div>
  123. </div>
  124. <div class="main_center fl">
  125. <div class="center_text t_cos0">
  126. <!--左上边框-->
  127. <div class="t_line_box">
  128. <i class="t_l_line"></i>
  129. <i class="l_t_line"></i>
  130. </div>
  131. <!--右上边框-->
  132. <div class="t_line_box">
  133. <i class="t_r_line"></i>
  134. <i class="r_t_line"></i>
  135. </div>
  136. <!--左下边框-->
  137. <div class="t_line_box">
  138. <i class="l_b_line"></i>
  139. <i class="b_l_line"></i>
  140. </div>
  141. <!--右下边框-->
  142. <div class="t_line_box">
  143. <i class="r_b_line"></i>
  144. <i class="b_r_line"></i>
  145. </div>
  146. <div class="main_title">
  147. 中国地图
  148. </div>
  149. <div id="chart_map" style="width:100%;height:778px;"></div>
  150. </div>
  151. <div class="center_text t_cos1" style="display:none">
  152. <!--左上边框-->
  153. <div class="t_line_box">
  154. <i class="t_l_line"></i>
  155. <i class="l_t_line"></i>
  156. </div>
  157. <!--右上边框-->
  158. <div class="t_line_box">
  159. <i class="t_r_line"></i>
  160. <i class="r_t_line"></i>
  161. </div>
  162. <!--左下边框-->
  163. <div class="t_line_box">
  164. <i class="l_b_line"></i>
  165. <i class="b_l_line"></i>
  166. </div>
  167. <!--右下边框-->
  168. <div class="t_line_box">
  169. <i class="r_b_line"></i>
  170. <i class="b_r_line"></i>
  171. </div>
  172. <div class="main_title">
  173. 湖南省高速公路
  174. </div>
  175. <div id="chart_2" class="chart" style="width:100%;height:778px;"></div>
  176. </div>
  177. <div class="center_text t_cos2" style="display:none">
  178. <!--左上边框-->
  179. <div class="t_line_box">
  180. <i class="t_l_line"></i>
  181. <i class="l_t_line"></i>
  182. </div>
  183. <!--右上边框-->
  184. <div class="t_line_box">
  185. <i class="t_r_line"></i>
  186. <i class="r_t_line"></i>
  187. </div>
  188. <!--左下边框-->
  189. <div class="t_line_box">
  190. <i class="l_b_line"></i>
  191. <i class="b_l_line"></i>
  192. </div>
  193. <!--右下边框-->
  194. <div class="t_line_box">
  195. <i class="r_b_line"></i>
  196. <i class="b_r_line"></i>
  197. </div>
  198. <div class="main_title">
  199. 湖南省飞机场
  200. </div>
  201. <div id="chart_0" class="chart" style="width:100%;height:778px;"></div>
  202. </div>
  203. <div class="center_text t_cos3" style="display:none">
  204. <!--左上边框-->
  205. <div class="t_line_box">
  206. <i class="t_l_line"></i>
  207. <i class="l_t_line"></i>
  208. </div>
  209. <!--右上边框-->
  210. <div class="t_line_box">
  211. <i class="t_r_line"></i>
  212. <i class="r_t_line"></i>
  213. </div>
  214. <!--左下边框-->
  215. <div class="t_line_box">
  216. <i class="l_b_line"></i>
  217. <i class="b_l_line"></i>
  218. </div>
  219. <!--右下边框-->
  220. <div class="t_line_box">
  221. <i class="r_b_line"></i>
  222. <i class="b_r_line"></i>
  223. </div>
  224. <div class="main_title">
  225. 中国铁路
  226. </div>
  227. <div id="chart_4" class="chart" style="width:100%;height:778px;"></div>
  228. </div>
  229. <div class="center_text t_cos4" style="display:none">
  230. <!--左上边框-->
  231. <div class="t_line_box">
  232. <i class="t_l_line"></i>
  233. <i class="l_t_line"></i>
  234. </div>
  235. <!--右上边框-->
  236. <div class="t_line_box">
  237. <i class="t_r_line"></i>
  238. <i class="r_t_line"></i>
  239. </div>
  240. <!--左下边框-->
  241. <div class="t_line_box">
  242. <i class="l_b_line"></i>
  243. <i class="b_l_line"></i>
  244. </div>
  245. <!--右下边框-->
  246. <div class="t_line_box">
  247. <i class="r_b_line"></i>
  248. <i class="b_r_line"></i>
  249. </div>
  250. <div class="main_title">
  251. 湖南货运量收入
  252. </div>
  253. <div id="chart_1" class="chart" style="width:100%;height:778px;"></div>
  254. </div>
  255. <div class="center_text t_cos5" style="display:none">
  256. <!--左上边框-->
  257. <div class="t_line_box">
  258. <i class="t_l_line"></i>
  259. <i class="l_t_line"></i>
  260. </div>
  261. <!--右上边框-->
  262. <div class="t_line_box">
  263. <i class="t_r_line"></i>
  264. <i class="r_t_line"></i>
  265. </div>
  266. <!--左下边框-->
  267. <div class="t_line_box">
  268. <i class="l_b_line"></i>
  269. <i class="b_l_line"></i>
  270. </div>
  271. <!--右下边框-->
  272. <div class="t_line_box">
  273. <i class="r_b_line"></i>
  274. <i class="b_r_line"></i>
  275. </div>
  276. <div class="main_title">
  277. 交通就业人员
  278. </div>
  279. <div id="chart_3" class="chart" style="width:100%;height:778px;"></div>
  280. </div>
  281. <div class="center_text t_cos6" style="display:none">
  282. <!--左上边框-->
  283. <div class="t_line_box">
  284. <i class="t_l_line"></i>
  285. <i class="l_t_line"></i>
  286. </div>
  287. <!--右上边框-->
  288. <div class="t_line_box">
  289. <i class="t_r_line"></i>
  290. <i class="r_t_line"></i>
  291. </div>
  292. <!--左下边框-->
  293. <div class="t_line_box">
  294. <i class="l_b_line"></i>
  295. <i class="b_l_line"></i>
  296. </div>
  297. <!--右下边框-->
  298. <div class="t_line_box">
  299. <i class="r_b_line"></i>
  300. <i class="b_r_line"></i>
  301. </div>
  302. <div class="main_title">
  303. 湖南省铁路
  304. </div>
  305. <div id="chart_6" class="chart" style="width:100%;height:778px;"></div>
  306. </div>
  307. <div class="center_text t_cos7" style="display:none">
  308. <!--左上边框-->
  309. <div class="t_line_box">
  310. <i class="t_l_line"></i>
  311. <i class="l_t_line"></i>
  312. </div>
  313. <!--右上边框-->
  314. <div class="t_line_box">
  315. <i class="t_r_line"></i>
  316. <i class="r_t_line"></i>
  317. </div>
  318. <!--左下边框-->
  319. <div class="t_line_box">
  320. <i class="l_b_line"></i>
  321. <i class="b_l_line"></i>
  322. </div>
  323. <!--右下边框-->
  324. <div class="t_line_box">
  325. <i class="r_b_line"></i>
  326. <i class="b_r_line"></i>
  327. </div>
  328. <div class="main_title">
  329. 湖南总货运量
  330. </div>
  331. <div id="chart_7" class="chart" style="width:100%;height:778px;"></div>
  332. </div>
  333. <div class="center_text t_cos8" style="display:none">
  334. <!--左上边框-->
  335. <div class="t_line_box">
  336. <i class="t_l_line"></i>
  337. <i class="l_t_line"></i>
  338. </div>
  339. <!--右上边框-->
  340. <div class="t_line_box">
  341. <i class="t_r_line"></i>
  342. <i class="r_t_line"></i>
  343. </div>
  344. <!--左下边框-->
  345. <div class="t_line_box">
  346. <i class="l_b_line"></i>
  347. <i class="b_l_line"></i>
  348. </div>
  349. <!--右下边框-->
  350. <div class="t_line_box">
  351. <i class="r_b_line"></i>
  352. <i class="b_r_line"></i>
  353. </div>
  354. <div class="main_title">
  355. 湖南货物周转量
  356. </div>
  357. <div id="chart_8" class="chart" style="width:100%;height:778px;"></div>
  358. </div>
  359. <div class="center_text t_cos9" style="display:none">
  360. <!--左上边框-->
  361. <div class="t_line_box">
  362. <i class="t_l_line"></i>
  363. <i class="l_t_line"></i>
  364. </div>
  365. <!--右上边框-->
  366. <div class="t_line_box">
  367. <i class="t_r_line"></i>
  368. <i class="r_t_line"></i>
  369. </div>
  370. <!--左下边框-->
  371. <div class="t_line_box">
  372. <i class="l_b_line"></i>
  373. <i class="b_l_line"></i>
  374. </div>
  375. <!--右下边框-->
  376. <div class="t_line_box">
  377. <i class="r_b_line"></i>
  378. <i class="b_r_line"></i>
  379. </div>
  380. <div class="main_title">
  381. 湖南运输线长度
  382. </div>
  383. <div id="chart_9" class="chart" style="width:100%;height:778px;"></div>
  384. </div>
  385. <div class="center_text t_cos10" style="display:none">
  386. <!--左上边框-->
  387. <div class="t_line_box">
  388. <i class="t_l_line"></i>
  389. <i class="l_t_line"></i>
  390. </div>
  391. <!--右上边框-->
  392. <div class="t_line_box">
  393. <i class="t_r_line"></i>
  394. <i class="r_t_line"></i>
  395. </div>
  396. <!--左下边框-->
  397. <div class="t_line_box">
  398. <i class="l_b_line"></i>
  399. <i class="b_l_line"></i>
  400. </div>
  401. <!--右下边框-->
  402. <div class="t_line_box">
  403. <i class="r_b_line"></i>
  404. <i class="b_r_line"></i>
  405. </div>
  406. <div class="main_title">
  407. 湖南业务量
  408. </div>
  409. <div id="chart_10" class="chart" style="width:100%;height:778px;"></div>
  410. </div>
  411. <div class="center_text t_cos11" style="display:none">
  412. <!--左上边框-->
  413. <div class="t_line_box">
  414. <i class="t_l_line"></i>
  415. <i class="l_t_line"></i>
  416. </div>
  417. <!--右上边框-->
  418. <div class="t_line_box">
  419. <i class="t_r_line"></i>
  420. <i class="r_t_line"></i>
  421. </div>
  422. <!--左下边框-->
  423. <div class="t_line_box">
  424. <i class="l_b_line"></i>
  425. <i class="b_l_line"></i>
  426. </div>
  427. <!--右下边框-->
  428. <div class="t_line_box">
  429. <i class="r_b_line"></i>
  430. <i class="b_r_line"></i>
  431. </div>
  432. <div class="main_title">
  433. 湖南公路营运
  434. </div>
  435. <div id="chart_11" class="chart" style="width:100%;height:778px;"></div>
  436. </div>
  437. <div class="center_text t_cos12" style="display:none">
  438. <!--左上边框-->
  439. <div class="t_line_box">
  440. <i class="t_l_line"></i>
  441. <i class="l_t_line"></i>
  442. </div>
  443. <!--右上边框-->
  444. <div class="t_line_box">
  445. <i class="t_r_line"></i>
  446. <i class="r_t_line"></i>
  447. </div>
  448. <!--左下边框-->
  449. <div class="t_line_box">
  450. <i class="l_b_line"></i>
  451. <i class="b_l_line"></i>
  452. </div>
  453. <!--右下边框-->
  454. <div class="t_line_box">
  455. <i class="r_b_line"></i>
  456. <i class="b_r_line"></i>
  457. </div>
  458. <div class="main_title">
  459. 湖南城市交通
  460. </div>
  461. <div id="chart_12" class="chart" style="width:100%;height:778px;"></div>
  462. </div>
  463. <div class="center_text t_cos13" style="display:none">
  464. <!--左上边框-->
  465. <div class="t_line_box">
  466. <i class="t_l_line"></i>
  467. <i class="l_t_line"></i>
  468. </div>
  469. <!--右上边框-->
  470. <div class="t_line_box">
  471. <i class="t_r_line"></i>
  472. <i class="r_t_line"></i>
  473. </div>
  474. <!--左下边框-->
  475. <div class="t_line_box">
  476. <i class="l_b_line"></i>
  477. <i class="b_l_line"></i>
  478. </div>
  479. <!--右下边框-->
  480. <div class="t_line_box">
  481. <i class="r_b_line"></i>
  482. <i class="b_r_line"></i>
  483. </div>
  484. <div class="main_title">
  485. 湖南省地图
  486. </div>
  487. <div id="chart_13" class="chart" style="width:100%;height:778px; cursor: pointer;"></div>
  488. </div>
  489. <div class="center_text t_cos14" style="display:none">
  490. <!--左上边框-->
  491. <div class="t_line_box">
  492. <i class="t_l_line"></i>
  493. <i class="l_t_line"></i>
  494. </div>
  495. <!--右上边框-->
  496. <div class="t_line_box">
  497. <i class="t_r_line"></i>
  498. <i class="r_t_line"></i>
  499. </div>
  500. <!--左下边框-->
  501. <div class="t_line_box">
  502. <i class="l_b_line"></i>
  503. <i class="b_l_line"></i>
  504. </div>
  505. <!--右下边框-->
  506. <div class="t_line_box">
  507. <i class="r_b_line"></i>
  508. <i class="b_r_line"></i>
  509. </div>
  510. <div class="main_title">
  511. GPS
  512. </div>
  513. <div id="chart_14" class="chart" style="width:100%;height:778px; cursor: pointer;"></div>
  514. </div>
  515. </div>
  516. </div>
  517. </div>
  518. </body>
  519. <script src="../js/jquery-2.2.1.min.js"></script>
  520. <script src="../js/bootstrap.min.js"></script>
  521. <script src="../js/common.js"></script>
  522. <script src="http://api.map.baidu.com/api?v=2.0&ak=dApOtvB5E3x6byHpUGHbRF1fxctCBdjw"></script>
  523. <script src="../js/echarts.min.js"></script>
  524. <script src="../js/dataTool.js"></script>
  525. <script src="../js/base.js"></script>
  526. <script src="../js/china.js"></script>
  527. <script src="../js/hunan.js"></script>
  528. <script src="../js/bmap.js"></script>
  529. <script src="../js/echarts-all.js"></script>
  530. </html>