index.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255
  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.0" />
  7. <title>交通运输应急指挥系统</title>
  8. <!-- <script src="./flexible.js"></script> -->
  9. <script src="./webClient/defaultConfig.js"></script>
  10. <script src="./webClient/initWebSocket.js"></script>
  11. <script src="./webClient/webClient_initWnd.js"></script>
  12. <script src="./lib/jquery.js"></script>
  13. <script src="./lib/md5.js"></script>
  14. <script src="./lib/jsencrypt.min.js"></script>
  15. <!-- <script src="../webClient/defaultConfig.js"></script>-->
  16. <!-- <script src="../webClient/initWebSocket.js"></script>-->
  17. <!-- <script src="../webClient/webClient_initWnd.js"></script>-->
  18. <script src="./js/common.js"></script>
  19. <script src="./login.js"></script>
  20. <script src="./meeting.js"></script>
  21. <script src="./js/videoplay.js"></script>
  22. <!-- <script src="https://gw.alipayobjects.com/os/antv/pkg/_antv.g6-3.1.1/build/g6.js"></script> -->
  23. <link rel="stylesheet" href="<%- mapurl %>/minemapapi/v2.1.0/minemap.css">
  24. <script src="<%- mapurl %>/minemapapi/v2.1.0/minemap.js"></script>
  25. <script src="<%- mapurl %>/minemapapi/v2.1.0/plugins/turf/turf.min.js"></script>
  26. <script>
  27. minemap.domainUrl = '<%- mapurl %>';
  28. minemap.dataDomainUrl = '<%- mapurl %>';
  29. minemap.serverDomainUrl = '<%- mapurl %>';
  30. minemap.spriteUrl = '<%- mapurl %>/minemapapi/v2.1.0/sprite/sprite';
  31. minemap.serviceUrl = '<%- mapurl %>/service/';
  32. /**
  33. * key、solution设置
  34. */
  35. minemap.key = "38025fbc9e3f4e1fb64b34b2b55080ab";
  36. minemap.solution = 12887;
  37. </script>
  38. <!-- <link rel="stylesheet" href="https://minedata.cn/minemapapi/v2.1.0/minemap.css" />
  39. <script src="https://minedata.cn/minemapapi/v2.1.0/minemap.js"></script>
  40. <script>
  41. minemap.domainUrl = 'https://minedata.cn';
  42. minemap.dataDomainUrl = 'https://minedata.cn';
  43. minemap.serverDomainUrl = 'https://minedata.cn';
  44. minemap.spriteUrl = 'https://minedata.cn/minemapapi/v2.1.0/sprite/sprite';
  45. minemap.serviceUrl = 'https://minedata.cn/service/';
  46. minemap.key = '77ef70465c2d4888b3a5132523494b94';
  47. minemap.solution = 16857;
  48. </script> -->
  49. <script>
  50. (function(win, lib) {
  51. var doc = win.document;
  52. var docEl = doc.documentElement;
  53. var metaEl = doc.querySelector('meta[name="viewport"]');
  54. var flexibleEl = doc.querySelector('meta[name="flexible"]');
  55. var dpr = 0;
  56. var scale = 0;
  57. var tid;
  58. // var flexible = lib.flexible || (lib.flexible = {});
  59. // if (metaEl) {
  60. // console.warn('将根据已有的meta标签来设置缩放比例');
  61. // var match = metaEl
  62. // .getAttribute('content')
  63. // .match(/initial\-scale=([\d\.]+)/);
  64. // if (match) {
  65. // scale = parseFloat(match[1]);
  66. // dpr = parseInt(1 / scale);
  67. // }
  68. // } else if (flexibleEl) {
  69. // var content = flexibleEl.getAttribute('content');
  70. // if (content) {
  71. // var initialDpr = content.match(/initial\-dpr=([\d\.]+)/);
  72. // var maximumDpr = content.match(/maximum\-dpr=([\d\.]+)/);
  73. // if (initialDpr) {
  74. // dpr = parseFloat(initialDpr[1]);
  75. // scale = parseFloat((1 / dpr).toFixed(2));
  76. // }
  77. // if (maximumDpr) {
  78. // dpr = parseFloat(maximumDpr[1]);
  79. // scale = parseFloat((1 / dpr).toFixed(2));
  80. // }
  81. // }
  82. // }
  83. // if (!dpr && !scale) {
  84. // var isAndroid = win.navigator.appVersion.match(/android/gi);
  85. // var isIPhone = win.navigator.appVersion.match(/iphone/gi);
  86. // var devicePixelRatio = win.devicePixelRatio;
  87. // if (isIPhone) {
  88. // // iOS下,对于2和3的屏,用2倍的方案,其余的用1倍方案
  89. // if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
  90. // dpr = 3;
  91. // } else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
  92. // dpr = 2;
  93. // } else {
  94. // dpr = 1;
  95. // }
  96. // } else {
  97. // // 其他设备下,仍旧使用1倍的方案
  98. // dpr = 1;
  99. // }
  100. // scale = 1 / dpr;
  101. // }
  102. // docEl.setAttribute('data-dpr', dpr);
  103. // if (!metaEl) {
  104. // metaEl = doc.createElement('meta');
  105. // metaEl.setAttribute('name', 'viewport');
  106. // metaEl.setAttribute(
  107. // 'content',
  108. // 'initial-scale=' +
  109. // scale +
  110. // ', maximum-scale=' +
  111. // scale +
  112. // ', minimum-scale=' +
  113. // scale +
  114. // ', user-scalable=no',
  115. // );
  116. // if (docEl.firstElementChild) {
  117. // docEl.firstElementChild.appendChild(metaEl);
  118. // } else {
  119. // var wrap = doc.createElement('div');
  120. // wrap.appendChild(metaEl);
  121. // doc.write(wrap.innerHTML);
  122. // }
  123. // }
  124. // var index = 0;
  125. function detectZoom() {
  126. let ratio = 0,
  127. screen = window.screen,
  128. ua = navigator.userAgent.toLowerCase();
  129. if (window.devicePixelRatio !== undefined) {
  130. ratio = window.devicePixelRatio;
  131. } else if (~ua.indexOf('msie')) {
  132. if (screen.deviceXDPI && screen.logicalXDPI) {
  133. ratio = screen.deviceXDPI / screen.logicalXDPI;
  134. }
  135. } else if (window.outerWidth !== undefined && window.innerWidth !== undefined) {
  136. ratio = window.outerWidth / window.innerWidth;
  137. }
  138. if (ratio) {
  139. ratio = Math.round(ratio * 100);
  140. }
  141. return ratio;
  142. }
  143. function refreshRem() {
  144. const m = detectZoom();
  145. console.log(m, 'MMMMMMMMMMMMMMM')
  146. document.body.style.zoom = 100 / Number(m);
  147. if (window.map != undefined) {
  148. map.resize();
  149. }
  150. // var docEl = doc.documentElement;
  151. // var width = docEl.getBoundingClientRect().width;
  152. // if (width / dpr > 5760) {
  153. // width = 5760 * dpr;
  154. // }
  155. // var rem = width / 10;
  156. // docEl.style.fontSize = rem + 'px';
  157. // flexible.rem = win.rem = rem;
  158. // var isMac = (navigator.platform == "Mac68K") || (navigator.platform == "MacPPC") || (navigator.platform == "Macintosh") || (navigator.platform == "MacIntel");
  159. // var t = window.devicePixelRatio // 获取下载的缩放 125% -> 1.25 150% -> 1.5
  160. // console.log(t)
  161. // if (t != 1 && !isMac) { // 如果进行了缩放,也就是不是1
  162. // setTimeout(() => {
  163. // document.body.style.zoom = -0.005 * t + 0.76; // 就去修改页面的缩放比例,这个公式我自己算的,不准确,勉强。
  164. // if (window.map != undefined) {
  165. // map.resize();
  166. // }
  167. // }, 2 * 1000)
  168. // } else {
  169. // document.body.style.zoom = 1;
  170. // }
  171. }
  172. // window.onresize = () => {
  173. // // refreshRem()
  174. // }
  175. win.addEventListener(
  176. 'resize',
  177. function() {
  178. // debugger
  179. clearTimeout(tid);
  180. tid = setTimeout(refreshRem, 300);
  181. },
  182. false,
  183. );
  184. // win.addEventListener(
  185. // 'pageshow',
  186. // function(e) {
  187. // if (e.persisted) {
  188. // clearTimeout(tid);
  189. // tid = setTimeout(refreshRem, 300);
  190. // }
  191. // },
  192. // false,
  193. // );
  194. // if (doc.readyState === 'complete') {
  195. // doc.body.style.fontSize = 12 * dpr + 'px';
  196. // } else {
  197. // doc.addEventListener(
  198. // 'DOMContentLoaded',
  199. // function(e) {
  200. // doc.body.style.fontSize = 12 * dpr + 'px';
  201. // },
  202. // false,
  203. // );
  204. // }
  205. refreshRem();
  206. // flexible.dpr = win.dpr = dpr;
  207. // flexible.refreshRem = refreshRem;
  208. // flexible.rem2px = function(d) {
  209. // var val = parseFloat(d) * this.rem;
  210. // if (typeof d === 'string' && d.match(/rem$/)) {
  211. // val += 'px';
  212. // }
  213. // return val;
  214. // };
  215. // flexible.px2rem = function(d) {
  216. // var val = parseFloat(d) / this.rem;
  217. // if (typeof d === 'string' && d.match(/px$/)) {
  218. // val += 'rem';
  219. // }
  220. // return val;
  221. // };
  222. })(window, window['lib'] || (window['lib'] = {}));
  223. </script>
  224. </head>
  225. <body style="position: fixed;background-color: #112692;
  226. width: 100%;
  227. height: 100%;">
  228. <div id="app" style="height: 100%;"></div>
  229. <script type="module" src="/src/main.ts"></script>
  230. </body>
  231. </html>