You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

492 lines
11 KiB

  1. /*大屏*/
  2. var geoCoordMap = {
  3. '新疆玛纳斯基地': [86.22, 44.30],
  4. '九江': [116.00, 29.70],
  5. '新乡': [116.402217, 35.311657],
  6. ' ': [79.92, 37.12],
  7. ' ': [86.85, 47.70],
  8. '若羌县': [88.17, 39.02],
  9. '上海': [121.4648, 31.2891],
  10. '东莞': [113.8953, 22.901],
  11. '东营': [118.7073, 37.5513],
  12. '中山': [113.4229, 22.478],
  13. '临汾': [111.4783, 36.1615],
  14. '临沂': [118.3118, 35.2936],
  15. '丹东': [124.541, 40.4242],
  16. '丽水': [119.5642, 28.1854],
  17. '乌鲁木齐': [87.9236, 43.5883],
  18. '佛山': [112.8955, 23.1097],
  19. '保定': [115.0488, 39.0948],
  20. '兰州': [103.5901, 36.3043],
  21. '包头': [110.3467, 41.4899],
  22. '北京': [116.4551, 40.2539],
  23. '北海': [109.314, 21.6211],
  24. '南京': [118.8062, 31.9208],
  25. '南宁': [108.479, 23.1152],
  26. '南昌': [116.0046, 28.6633],
  27. '南通': [121.1023, 32.1625],
  28. '厦门': [118.1689, 24.6478],
  29. '台州': [121.1353, 28.6688],
  30. '合肥': [117.29, 32.0581],
  31. '呼和浩特': [111.4124, 40.4901],
  32. '咸阳': [108.4131, 34.8706],
  33. '哈尔滨': [127.9688, 45.368],
  34. '唐山': [118.4766, 39.6826],
  35. '嘉兴': [120.9155, 30.6354],
  36. '大同': [113.7854, 39.8035],
  37. '大连': [122.2229, 39.4409],
  38. '天津': [117.4219, 39.4189],
  39. '太原': [112.3352, 37.9413],
  40. '威海': [121.9482, 37.1393],
  41. '宁波': [121.5967, 29.6466],
  42. '宝鸡': [107.1826, 34.3433],
  43. '宿迁': [118.5535, 33.7775],
  44. '常州': [119.4543, 31.5582],
  45. '广州': [113.5107, 23.2196],
  46. '廊坊': [116.521, 39.0509],
  47. '延安': [109.1052, 36.4252],
  48. '张家口': [115.1477, 40.8527],
  49. '徐州': [117.5208, 34.3268],
  50. '德州': [116.6858, 37.2107],
  51. '惠州': [114.6204, 23.1647],
  52. '成都': [103.9526, 30.7617],
  53. '扬州': [119.4653, 32.8162],
  54. '承德': [117.5757, 41.4075],
  55. '拉萨': [91.1865, 30.1465],
  56. '无锡': [120.3442, 31.5527],
  57. '日照': [119.2786, 35.5023],
  58. '昆明': [102.9199, 25.4663],
  59. '杭州': [119.5313, 29.8773],
  60. '枣庄': [117.323, 34.8926],
  61. '柳州': [109.3799, 24.9774],
  62. '株洲': [113.5327, 27.0319],
  63. '武汉': [114.3896, 30.6628],
  64. '汕头': [117.1692, 23.3405],
  65. '江门': [112.6318, 22.1484],
  66. '沈阳': [123.1238, 42.1216],
  67. '沧州': [116.8286, 38.2104],
  68. '河源': [114.917, 23.9722],
  69. '泉州': [118.3228, 25.1147],
  70. '泰安': [117.0264, 36.0516],
  71. '泰州': [120.0586, 32.5525],
  72. '济南': [117.1582, 36.8701],
  73. '济宁': [116.8286, 35.3375],
  74. '海口': [110.3893, 19.8516],
  75. '淄博': [118.0371, 36.6064],
  76. '淮安': [118.927, 33.4039],
  77. '深圳': [114.5435, 22.5439],
  78. '清远': [112.9175, 24.3292],
  79. '温州': [120.498, 27.8119],
  80. '渭南': [109.7864, 35.0299],
  81. '湖州': [119.8608, 30.7782],
  82. '湘潭': [112.5439, 27.7075],
  83. '滨州': [117.8174, 37.4963],
  84. '潍坊': [119.0918, 36.524],
  85. '烟台': [120.7397, 37.5128],
  86. '玉溪': [101.9312, 23.8898],
  87. '珠海': [113.7305, 22.1155],
  88. '盐城': [120.2234, 33.5577],
  89. '盘锦': [121.9482, 41.0449],
  90. '石家庄': [114.4995, 38.1006],
  91. '福州': [119.4543, 25.9222],
  92. '秦皇岛': [119.2126, 40.0232],
  93. '绍兴': [120.564, 29.7565],
  94. '聊城': [115.9167, 36.4032],
  95. '肇庆': [112.1265, 23.5822],
  96. '舟山': [122.2559, 30.2234],
  97. '苏州': [120.6519, 31.3989],
  98. '莱芜': [117.6526, 36.2714],
  99. '菏泽': [115.6201, 35.2057],
  100. '营口': [122.4316, 40.4297],
  101. '葫芦岛': [120.1575, 40.578],
  102. '衡水': [115.8838, 37.7161],
  103. '衢州': [118.6853, 28.8666],
  104. '西宁': [101.4038, 36.8207],
  105. '西安': [109.1162, 34.2004],
  106. '贵阳': [106.6992, 26.7682],
  107. '连云港': [119.1248, 34.552],
  108. '邢台': [114.8071, 37.2821],
  109. '邯郸': [114.4775, 36.535],
  110. '郑州': [113.4668, 34.6234],
  111. '鄂尔多斯': [108.9734, 39.2487],
  112. '重庆': [107.7539, 30.1904],
  113. '金华': [120.0037, 29.1028],
  114. '铜川': [109.0393, 35.1947],
  115. '银川': [106.3586, 38.1775],
  116. '镇江': [119.4763, 31.9702],
  117. '长春': [125.8154, 44.2584],
  118. '长沙': [113.0823, 28.2568],
  119. '长治': [112.8625, 36.4746],
  120. '阳泉': [113.4778, 38.0951],
  121. '青岛': [120.4651, 36.3373],
  122. '韶关': [113.7964, 24.7028]
  123. };
  124. var BJData = [
  125. [{
  126. name: '新乡'
  127. }, {
  128. name: '新乡',
  129. value: 200
  130. }],
  131. [{
  132. name: '新乡'
  133. }, {
  134. name: '呼和浩特',
  135. value: 90
  136. }],
  137. [{
  138. name: '新乡'
  139. }, {
  140. name: '哈尔滨',
  141. value: 90
  142. }],
  143. [{
  144. name: '新乡'
  145. }, {
  146. name: '石家庄',
  147. value: 90
  148. }],
  149. [{
  150. name: '新乡'
  151. }, {
  152. name: '昆明',
  153. value: 30
  154. }],
  155. [{
  156. name: '新乡'
  157. }, {
  158. name: '北京',
  159. value: 100
  160. }],
  161. [{
  162. name: '新乡'
  163. }, {
  164. name: '长春',
  165. value: 40
  166. }],
  167. [{
  168. name: '新乡'
  169. }, {
  170. name: '重庆',
  171. value: 40
  172. }],
  173. [{
  174. name: '新乡'
  175. }, {
  176. name: '贵阳',
  177. value: 50
  178. }],
  179. [{
  180. name: '新乡'
  181. }, {
  182. name: '南宁',
  183. value: 30
  184. }],
  185. [{
  186. name: '新乡'
  187. }, {
  188. name: '济南',
  189. value: 10
  190. }],
  191. [{
  192. name: '新乡'
  193. }, {
  194. name: '太原',
  195. value: 40
  196. }],
  197. [{
  198. name: '新乡'
  199. }, {
  200. name: '西安',
  201. value: 60
  202. }],
  203. [{
  204. name: '新乡'
  205. }, {
  206. name: '武汉',
  207. value: 50
  208. }],
  209. [{
  210. name: '新乡'
  211. }, {
  212. name: '合肥',
  213. value: 40
  214. }],
  215. [{
  216. name: '新乡'
  217. }, {
  218. name: '南京',
  219. value: 30
  220. }],
  221. [{
  222. name: '新乡'
  223. }, {
  224. name: '沈阳',
  225. value: 20
  226. }],
  227. [{
  228. name: '新乡'
  229. }, {
  230. name: '成都',
  231. value: 10
  232. }]
  233. ];
  234. var SHData = [
  235. [{
  236. name: '九江'
  237. }, {
  238. name: '九江',
  239. value: 200
  240. }],
  241. [{
  242. name: '九江'
  243. }, {
  244. name: '长沙',
  245. value: 95
  246. }],
  247. [{
  248. name: '九江'
  249. }, {
  250. name: '武汉',
  251. value: 30
  252. }],
  253. [{
  254. name: '九江'
  255. }, {
  256. name: '南昌',
  257. value: 20
  258. }],
  259. [{
  260. name: '九江'
  261. }, {
  262. name: '合肥',
  263. value: 70
  264. }],
  265. [{
  266. name: '九江'
  267. }, {
  268. name: '南京',
  269. value: 60
  270. }],
  271. [{
  272. name: '九江'
  273. }, {
  274. name: '福州',
  275. value: 50
  276. }],
  277. [{
  278. name: '九江'
  279. }, {
  280. name: '上海',
  281. value: 100
  282. }],
  283. [{
  284. name: '九江'
  285. }, {
  286. name: '深圳',
  287. value: 100
  288. }],
  289. ];
  290. var GZData = [
  291. [{
  292. name: '新疆玛纳斯基地'
  293. }, {
  294. name: '新疆玛纳斯基地',
  295. value: 200
  296. }],
  297. [{
  298. name: '新疆玛纳斯基地'
  299. }, {
  300. name: ' ',
  301. value: 90
  302. }],
  303. [{
  304. name: '新疆玛纳斯基地'
  305. }, {
  306. name: ' ',
  307. value: 40
  308. }],
  309. [{
  310. name: '新疆玛纳斯基地'
  311. }, {
  312. name: '呼和浩特',
  313. value: 90
  314. }],
  315. [{
  316. name: '新疆玛纳斯基地'
  317. }, {
  318. name: '昆明',
  319. value: 40
  320. }],
  321. [{
  322. name: '新疆玛纳斯基地'
  323. }, {
  324. name: '成都',
  325. value: 10
  326. }],
  327. [{
  328. name: '新疆玛纳斯基地'
  329. }, {
  330. name: '兰州',
  331. value: 95
  332. }],
  333. [{
  334. name: '新疆玛纳斯基地'
  335. }, {
  336. name: '银川',
  337. value: 90
  338. }],
  339. [{
  340. name: '新疆玛纳斯基地'
  341. }, {
  342. name: '西宁',
  343. value: 80
  344. }],
  345. ];
  346. var planePath = 'path://M.6,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705';
  347. var convertData = function (data) {
  348. var res = [];
  349. for (var i = 0; i < data.length; i++) {
  350. var dataItem = data[i];
  351. var fromCoord = geoCoordMap[dataItem[0].name];
  352. var toCoord = geoCoordMap[dataItem[1].name];
  353. if (fromCoord && toCoord) {
  354. res.push([{
  355. coord: fromCoord
  356. }, {
  357. coord: toCoord
  358. }]);
  359. }
  360. }
  361. return res;
  362. };
  363. var color = ['#3ed4ff', '#ffa022', '#a6c84c'];
  364. var series = [];
  365. [
  366. ['新乡', BJData],
  367. ['九江', SHData],
  368. ['新疆', GZData]
  369. ].forEach(function (item, i) {
  370. series.push({
  371. name: item[0] + ' Top10',
  372. type: 'lines',
  373. zlevel: 1,
  374. effect: {
  375. show: true,
  376. period: 6,
  377. trailLength: 0.7,
  378. color: '#fff',
  379. symbolSize: 3
  380. },
  381. lineStyle: {
  382. normal: {
  383. color: color[i],
  384. width: 0,
  385. curveness: 0.2
  386. }
  387. },
  388. data: convertData(item[1])
  389. }, {
  390. name: item[0] + ' Top10',
  391. type: 'lines',
  392. zlevel: 2,
  393. effect: {
  394. show: true,
  395. period: 6,
  396. trailLength: 0,
  397. symbol: planePath,
  398. symbolSize: 15
  399. },
  400. lineStyle: {
  401. normal: {
  402. color: color[i],
  403. width: 1,
  404. opacity: 0.4,
  405. curveness: 0.2
  406. }
  407. },
  408. data: convertData(item[1])
  409. }, {
  410. name: item[0] + ' Top10',
  411. type: 'effectScatter',
  412. coordinateSystem: 'geo',
  413. zlevel: 2,
  414. rippleEffect: {
  415. brushType: 'stroke'
  416. },
  417. label: {
  418. normal: {
  419. show: true,
  420. position: 'right',
  421. formatter: '{b}'
  422. }
  423. },
  424. symbolSize: function (val) {
  425. return val[2] / 8;
  426. },
  427. itemStyle: {
  428. normal: {
  429. color: color[i]
  430. }
  431. },
  432. data: item[1].map(function (dataItem) {
  433. return {
  434. name: dataItem[1].name,
  435. value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value])
  436. };
  437. })
  438. });
  439. });
  440. option = {
  441. backgroundColor: '#080a20',
  442. title: {
  443. left: 'left',
  444. textStyle: {
  445. color: '#fff'
  446. }
  447. },
  448. tooltip: {
  449. trigger: 'item'
  450. },
  451. legend: {
  452. orient: 'vertical',
  453. top: 'bottom',
  454. left: 'right',
  455. data: ['北京 Top10', '上海 Top10', '广州 Top10'],
  456. textStyle: {
  457. color: '#fff'
  458. },
  459. selectedMode: 'single'
  460. },
  461. geo: {
  462. map: 'china',
  463. zoom: 1.2,
  464. label: {
  465. emphasis: {
  466. show: false
  467. }
  468. },
  469. roam: true,
  470. itemStyle: {
  471. normal: {
  472. areaColor: '#142957',
  473. borderColor: '#0692a4'
  474. },
  475. emphasis: {
  476. areaColor: '#0b1c2d'
  477. }
  478. }
  479. },
  480. series: series
  481. };
  482. var myecharts = echarts.init($('.map .geo')[0])
  483. myecharts.setOption(option)