MinMap.js 76 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027
  1. var MinMap = (function () {
  2. 'use strict';
  3. var html = "<div v-cloak v-scope xui_min_map @vue:mounted=\"create\" :class=\"{show:show}\"> <canvas xui_min_map_cad></canvas> <canvas xui_min_map_img></canvas> <canvas xui_min_map_dir></canvas> </div> <style> [xui_min_map] {\n visibility: hidden;\n position: absolute;\n pointer-events: all;\n width: 204px;\n height: 200px;\n background-color: rgba(0, 0, 0, 0.3);\n border-radius: 10px;\n }\n [xui_min_map] canvas {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n }\n\n [xui_min_map].show {\n visibility: visible;\n } </style> ";
  4. var MathUtil = function MathUtil() {};
  5. MathUtil.prototype.getFixed = function getFixed (num, decimal) {
  6. if (!decimal) {
  7. decimal = 5;
  8. }
  9. // return Math.floor(num * 10000) / 10000;
  10. return parseFloat(num.toFixed(decimal))
  11. };
  12. MathUtil.prototype.createLine1 = function createLine1 (point1, point2) {
  13. if (point1.x == point2.x && point1.y == point2.y) {
  14. return null
  15. } else if (this.getFixed(Math.abs(point1.x - point2.x)) == 0) {
  16. return { x: point1.x }
  17. } else if (this.getFixed(Math.abs(point1.y - point2.y)) == 0) {
  18. return { y: point1.y }
  19. }
  20. var parametera = (point1.y - point2.y) / (point1.x - point2.x);
  21. var parameterb = (point1.x * point2.y - point2.x * point1.y) / (point1.x - point2.x);
  22. if (this.getFixed(parametera) == 0) {
  23. return { y: this.getFixed(parameterb) }
  24. }
  25. var parameter = { a: this.getFixed(parametera), b: this.getFixed(parameterb) };
  26. return parameter
  27. };
  28. MathUtil.prototype.createLine2 = function createLine2 (point, angle) {
  29. if (angle == Math.PI / 2 || angle == 1.5 * Math.PI) {
  30. return { x: point.x }
  31. }
  32. var a = Math.tan(angle);
  33. var b = point.y - a * point.x;
  34. if (a != 0) {
  35. return { a: a, b: b }
  36. } else {
  37. return { y: point.y }
  38. }
  39. };
  40. // 与lineA平行并且point在线上
  41. MathUtil.prototype.createLine3 = function createLine3 (lineA, point) {
  42. var parameter = {};
  43. if (typeof lineA.a === 'undefined') {
  44. if (typeof lineA.x !== 'undefined') {
  45. parameter.x = point.x;
  46. } else if (typeof lineA.y !== 'undefined') {
  47. parameter.y = point.y;
  48. }
  49. } else {
  50. parameter.a = lineA.a;
  51. parameter.b = point.y - point.x * lineA.a;
  52. }
  53. return parameter
  54. };
  55. MathUtil.prototype.create2AngleLine = function create2AngleLine (point, angle, driftAngle) {
  56. var line1 = this.createLine2(point, angle - driftAngle / 2);
  57. var line2 = this.createLine2(point, angle + driftAngle / 2);
  58. return { line1: line1, line2: line2 }
  59. };
  60. MathUtil.prototype.distanceForPoints = function distanceForPoints (point1, point2) {
  61. return Math.sqrt(Math.pow(point1.x - point2.x, 2) + Math.pow(point1.y - point2.y, 2))
  62. };
  63. //与line平行且两条线直接的距离是distance的两条线
  64. MathUtil.prototype.getParallelLineForDistance = function getParallelLineForDistance (line, distance) {
  65. var line1 = {};
  66. line1.a = line.a;
  67. line1.b = line.b;
  68. var line2 = {};
  69. line2.a = line.a;
  70. line2.b = line.b;
  71. if (typeof line.a == 'undefined') {
  72. if (line.hasOwnProperty('x')) {
  73. var x = line.x;
  74. line1.x = x + distance;
  75. line2.x = x - distance;
  76. } else if (line.hasOwnProperty('y')) {
  77. var y = line.y;
  78. line1.y = y + distance;
  79. line2.y = y - distance;
  80. }
  81. } else {
  82. var angle = Math.atan(line.a);
  83. var db = Math.abs(distance / Math.cos(angle));
  84. var b = line.b;
  85. line1.b = b + db;
  86. line2.b = b - db;
  87. }
  88. return { line1: line1, line2: line2 }
  89. };
  90. //获取扇形的两个端点
  91. MathUtil.prototype.getEndpoint = function getEndpoint (point, angle, sectorAngle) {
  92. var distance = 15;
  93. //line1是减,line2是加
  94. var lines1 = this.create2AngleLine(point, angle, sectorAngle);
  95. var line = this.createLine2(point, angle);
  96. line = this.getLineForPoint(line, point);
  97. var lines2 = this.getParallelLineForDistance(line, distance);
  98. var point1 = this.getIntersectionPoint(lines1.line1, lines2.line1);
  99. var point2 = this.getIntersectionPoint(lines1.line1, lines2.line2);
  100. var point3 = this.getIntersectionPoint(lines1.line2, lines2.line1);
  101. var point4 = this.getIntersectionPoint(lines1.line2, lines2.line2);
  102. var angle1 = this.Angle(point, point1, { x: point.x + 1, y: point.y });
  103. var angle2 = this.Angle(point, point2, { x: point.x + 1, y: point.y });
  104. var angle3 = this.Angle(point, point3, { x: point.x + 1, y: point.y });
  105. var angle4 = this.Angle(point, point4, { x: point.x + 1, y: point.y });
  106. if (angle > Math.PI) {
  107. angle = 2 * Math.PI - angle;
  108. }
  109. if (Math.abs((angle1 + angle3) / 2 - angle) < Math.abs((angle2 + angle4) / 2 - angle)) {
  110. return { p1: point1, p2: point3 }
  111. } else {
  112. return { p1: point2, p2: point4 }
  113. }
  114. };
  115. //两条线的交点
  116. MathUtil.prototype.getIntersectionPoint = function getIntersectionPoint (parameter1, parameter2) {
  117. if (this.isParallel(parameter1, parameter2)) {
  118. return null
  119. }
  120. if (typeof parameter1.a == 'undefined' && typeof parameter2.a != 'undefined') {
  121. if (parameter1.x) {
  122. return { x: parameter1.x, y: parameter2.a * parameter1.x + parameter2.b }
  123. } else if (parameter1.y) {
  124. return { x: (parameter1.y - parameter2.b) / parameter2.a, y: parameter1.y }
  125. }
  126. } else if (typeof parameter2.a == 'undefined' && typeof parameter1.a != 'undefined') {
  127. if (parameter2.x) {
  128. return { x: parameter2.x, y: parameter1.a * parameter2.x + parameter1.b }
  129. } else if (parameter2.y) {
  130. return { x: (parameter2.y - parameter1.b) / parameter1.a, y: parameter2.y }
  131. }
  132. } else if (typeof parameter2.a == 'undefined' && typeof parameter1.a == 'undefined') {
  133. if (parameter1.hasOwnProperty('x') && parameter2.hasOwnProperty('y')) {
  134. return { x: parameter1.x, y: parameter2.y }
  135. } else if (parameter1.hasOwnProperty('y') && parameter2.hasOwnProperty('x')) {
  136. return { x: parameter2.x, y: parameter1.y }
  137. } else {
  138. return null
  139. }
  140. }
  141. if (parameter1.a == parameter2.a) {
  142. return null
  143. }
  144. var joinpointx = (parameter2.b - parameter1.b) / (parameter1.a - parameter2.a);
  145. var joinpointy = (parameter1.a * parameter2.b - parameter2.a * parameter1.b) / (parameter1.a - parameter2.a);
  146. var point = { x: joinpointx, y: joinpointy };
  147. return point
  148. };
  149. //返回true表示平行
  150. MathUtil.prototype.isParallel = function isParallel (line1, line2) {
  151. var fixed = this.fixed;
  152. if (typeof line1.a == 'undefined' && typeof line2.a == 'undefined') {
  153. if (line1.hasOwnProperty('x') && line2.hasOwnProperty('x')) {
  154. return true
  155. } else if (line1.hasOwnProperty('y') && line2.hasOwnProperty('y')) {
  156. return true
  157. } else {
  158. return false
  159. }
  160. } else if (typeof line1.a == 'undefined' || typeof line2.a == 'undefined') {
  161. return false
  162. } else if (line1.a.toFixed(fixed) == line2.a.toFixed(fixed)) {
  163. return true
  164. } else {
  165. return false
  166. }
  167. };
  168. //两条相交的线段的夹角,永远小于180度
  169. MathUtil.prototype.Angle = function Angle (o, s, e) {
  170. var cosfi = 0,
  171. fi = 0,
  172. norm = 0;
  173. var dsx = s.x - o.x;
  174. var dsy = s.y - o.y;
  175. var dex = e.x - o.x;
  176. var dey = e.y - o.y;
  177. cosfi = dsx * dex + dsy * dey;
  178. norm = (dsx * dsx + dsy * dsy) * (dex * dex + dey * dey);
  179. cosfi /= Math.sqrt(norm);
  180. if (cosfi >= 1.0) { return 0 }
  181. //if (cosfi <= -1.0) return Math.PI;
  182. if (cosfi <= -1.0) { return 180 }
  183. fi = Math.acos(cosfi);
  184. if ((180 * fi) / Math.PI < 180) {
  185. //return 180 * fi / Math.PI;
  186. return fi
  187. } else {
  188. //return 360 - 180 * fi / Math.PI;
  189. return 2 * Math.PI - fi
  190. }
  191. };
  192. //经过point且与line垂直的线
  193. MathUtil.prototype.getLineForPoint = function getLineForPoint (line, point) {
  194. var parameter = {};
  195. if (line.a == 0 || typeof line.a == 'undefined') {
  196. if (line.hasOwnProperty('x')) {
  197. parameter.y = point.y;
  198. } else if (line.hasOwnProperty('y')) {
  199. parameter.x = point.x;
  200. }
  201. } else {
  202. parameter.a = -1 / line.a;
  203. parameter.b = point.y - point.x * parameter.a;
  204. }
  205. return parameter
  206. };
  207. MathUtil.prototype.createLine2 = function createLine2 (point, angle) {
  208. if (angle == Math.PI / 2 || angle == 1.5 * Math.PI) {
  209. return { x: point.x }
  210. }
  211. var a = Math.tan(angle);
  212. var b = point.y - a * point.x;
  213. if (a != 0) {
  214. return { a: a, b: b }
  215. } else {
  216. return { y: point.y }
  217. }
  218. };
  219. // 求两个点的距离
  220. MathUtil.prototype.getDistance = function getDistance (p1, p2) {
  221. var x1 = p1.x;
  222. var y1 = p1.y;
  223. var x2 = p2.x;
  224. var y2 = p2.y;
  225. var num = Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2));
  226. return this.getFixed(num)
  227. };
  228. // true表示逆时针,false表示顺时针
  229. MathUtil.prototype.isClockwise = function isClockwise (vertices) {
  230. var area = 0;
  231. for (var i = 0; i < vertices.length; i++) {
  232. var j = (i + 1) % vertices.length;
  233. area += vertices[i].x * vertices[j].y;
  234. area -= vertices[j].x * vertices[i].y;
  235. }
  236. var sub = area / 2;
  237. if (sub > 0) {
  238. // 逆时针
  239. return true
  240. } else {
  241. // 顺时针
  242. return false
  243. }
  244. };
  245. // 垂直线
  246. MathUtil.prototype.getVerticalLine = function getVerticalLine (line, point) {
  247. if (typeof line.a === 'undefined') {
  248. if (line.hasOwnProperty('x')) {
  249. return { y: point.y }
  250. } else if (line.hasOwnProperty('y')) {
  251. return { x: point.x }
  252. } else {
  253. return null
  254. }
  255. } else if (line.a == 0) {
  256. return { x: point.x }
  257. } else {
  258. var tl = {};
  259. tl.a = -1 / line.a;
  260. var result = this.createLine3(tl, point);
  261. return result
  262. }
  263. };
  264. var mathUtil = new MathUtil();
  265. var Style = {
  266. Wall: {
  267. strokeStyle: '#FFFFFF',
  268. lineWidth: 2,
  269. lineWidth_out: 4,
  270. //承重墙
  271. important: {
  272. strokeStyle: '#FFFFFF',
  273. lineWidth: 4,
  274. },
  275. error: {
  276. strokeStyle: 'rgba(255,0,0,0.5)',
  277. fillStyle: 'rgba(255,0,0,0.8)',
  278. },
  279. },
  280. Point: {
  281. strokeStyle: 'green',
  282. fillStyle: 'rgb(0, 200, 175)',
  283. radius: 4,
  284. },
  285. Symbol: {
  286. strokeStyle: 'rgba(255,255,255,1)',
  287. fillStyle: 'rgba(255,255,255,0)',
  288. lineWidth: 1,
  289. //垭口
  290. Pass: {},
  291. },
  292. Component: {
  293. strokeStyle: 'rgba(255,255,255,1)',
  294. fillStyle: 'rgba(255,255,255,0)',
  295. lineWidth: 1,
  296. },
  297. Tag: {
  298. strokeStyle: 'rgb(255,255,255,1)',
  299. fillStyle: 'rgb(255,255,255,1)',
  300. strokeStyle_adding: 'rgba(243, 255, 0, 0.8)',
  301. fillStyle_adding: 'rgba(243, 255, 0, 0.8)',
  302. lineWidth: 1,
  303. },
  304. Font: {
  305. font: '12px Microsoft YaHei',
  306. fillStyle: '#FFFFFF',
  307. strokeStyle: '#FFFFFF',
  308. textAlign: 'center',
  309. textBaseline: 'middle',
  310. miterLimit: 10,
  311. direction: 'ltr',
  312. },
  313. Pano: {
  314. radius: 10,
  315. lineWidth: 2,
  316. strokeStyle: 'rgba(255,255,255,0.4)',
  317. fillStyle: 'rgba(255,255,255,0.1)',
  318. },
  319. Measure: {
  320. txt: 'rgba(255,255,255,0.6)',
  321. strokeStyle: 'rgba(255,255,255,0.6)',
  322. lineWidth: 1,
  323. },
  324. };
  325. var VectorType = {
  326. Point: 'Point',
  327. WallCorner: 'WallCorner',
  328. Wall: 'Wall',
  329. SingleDoor: 'SingleDoor',
  330. DoubleDoor: 'DoubleDoor',
  331. SlideDoor: 'SlideDoor',
  332. SingleWindow: 'SingleWindow',
  333. BayWindow: 'BayWindow',
  334. FrenchWindow: 'FrenchWindow',
  335. Pass: 'Pass',
  336. Beam: 'Beam',
  337. Flue: 'Flue',
  338. Corridor: 'Corridor',
  339. Line: 'Line',
  340. Tag: 'Tag',
  341. };
  342. //相机(漫游点)的朝向对应的扇形广角
  343. //cad区域离canvas上下左右的距离
  344. var canvasPadding = {
  345. top: 20,
  346. down: 20,
  347. left: 20,
  348. right: 20,
  349. };
  350. var theme = {
  351. cameraR: 2, //相机(漫游点)的半径
  352. camera_fillStyle: '#1FE4DC', //相机(漫游点)的填充样式
  353. camera_strokeStyle: 'white', //相机(漫游点)的外框样式
  354. cameraSectorR: 18, //相机(漫游点)的朝向对应的扇形半径
  355. cameraSector_fillStyle: ['rgba(31,228,220, 1)', 'rgba(31,228,220, 0)'], //相机(漫游点)的朝向对应的扇形填充样式
  356. cameraSectorAngle: (70 / 180) * Math.PI, //70° //相机(漫游点)的朝向对应的扇形广角
  357. };
  358. var hexToRGBA = function (color, alpha) {
  359. //十六进制颜色值的正则表达式
  360. var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
  361. color = color.toLowerCase();
  362. // 如果是16进制颜色
  363. if (color && reg.test(color)) {
  364. if (color.length === 4) {
  365. var colorNew = '#';
  366. for (var i = 1; i < 4; i += 1) {
  367. colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1));
  368. }
  369. color = colorNew;
  370. }
  371. //处理六位的颜色值
  372. var colors = [];
  373. for (var i = 1; i < 7; i += 2) {
  374. colors.push(parseInt('0x' + color.slice(i, i + 2)));
  375. }
  376. if (alpha === void 0) {
  377. return ("rgb(" + (colors.join(',')) + ")")
  378. } else {
  379. return ("rgba(" + (colors.join(',')) + "," + (alpha === void 0 ? 1 : alpha) + ")")
  380. }
  381. }
  382. return color
  383. };
  384. var MinMap = function MinMap(app, dom, config) {
  385. var this$1$1 = this;
  386. this.app = app;
  387. this.dom = dom;
  388. this.mode = null;
  389. this.ready = false;
  390. this.$minmap = null;
  391. if (config.theme) {
  392. this.theme(config.theme);
  393. }
  394. window.addEventListener('resize', function () {
  395. this$1$1.render();
  396. });
  397. this.app.core.get('Player').on('mode.changing', function (currentMode, mode, pano) {
  398. this$1$1.mode = mode;
  399. if (mode === 'panorama' && !this$1$1.app.core.get('Player').vrEnabled) {
  400. if (this$1$1.app.MinMap.display !== false && this$1$1.app.MinMap.hidden !== true) {
  401. this$1$1.show();
  402. this$1$1.render(pano.floorIndex);
  403. }
  404. } else {
  405. this$1$1.hide();
  406. }
  407. });
  408. this.angle = 0;
  409. };
  410. MinMap.prototype.init = function init () {
  411. this.canvas1 = null;
  412. this.canvas2 = null;
  413. this.canvas3 = null;
  414. this.context1 = null;
  415. this.context2 = null;
  416. this.ratio = null; //移动端需要放大3倍的样子画,这样才能清晰
  417. this.resolution = null;
  418. this.playerPoint = null;
  419. this.playerAngle = null;
  420. this.canvas_bounding = null; //在规定的区域绘图(上下左右要有留边)
  421. this.cad_bounding = null; //户型数据的区域
  422. this.$minmap = this.dom.querySelector('[xui_min_map]');
  423. this.initContext();
  424. this.data();
  425. };
  426. MinMap.prototype.data = function data (reload) {
  427. var this$1$1 = this;
  428. return this.app.store.get('flooruser', reload).then(function (floor) {
  429. //this.app.store.getAppImage('images/cad_enter_mini.png').then(img => {
  430. //this.enter_mini_Img = img
  431. //this.floor = floor
  432. this$1$1.floor = JSON.parse(JSON.stringify(floor));
  433. this$1$1.floor.floors.sort(function (v1, v2) {
  434. return v1.subgroup - v2.subgroup
  435. });
  436. this$1$1.setCadBounding();
  437. this$1$1.render(this$1$1.app.core.get('Player').currentPano.floorIndex, reload);
  438. //})
  439. })
  440. };
  441. MinMap.prototype.show = function show () {
  442. if (this.mode != 'panorama' && this.app.Camera.mode != 'panorama') {
  443. return
  444. }
  445. this.mode = null;
  446. this.$minmap && (this.$minmap.style.visibility = 'visible');
  447. };
  448. MinMap.prototype.hide = function hide () {
  449. this.$minmap && (this.$minmap.style.visibility = 'hidden');
  450. };
  451. MinMap.prototype.theme = function theme$1 (options) {
  452. if ( options === void 0 ) options = {};
  453. if (options.camera_fillStyle && !options.cameraSector_fillStyle) {
  454. options.cameraSector_fillStyle = [hexToRGBA(options.camera_fillStyle, 1), hexToRGBA(options.camera_fillStyle, 0)];
  455. }
  456. Object.assign(theme, options);
  457. };
  458. //subgroup表示按照顺序拍摄的楼层,floorNum表示真正的楼层
  459. MinMap.prototype.getFloorNumFromSubgroup = function getFloorNumFromSubgroup (floorsData, subgroup) {
  460. for (var i = 0; i < floorsData.floors.length; ++i) {
  461. var floor = floorsData.floors[i];
  462. if (!floor.hasOwnProperty('subgroup') || floor.subgroup == subgroup) {
  463. return i
  464. }
  465. }
  466. };
  467. //采用两个canvas叠加的方式,一个是cad,一个是相机。相机会经常刷新,cad保持不变
  468. MinMap.prototype.render = function render (subgroup, reload) {
  469. var this$1$1 = this;
  470. if (!this.floor) {
  471. return
  472. }
  473. this.angle = 0;
  474. if (subgroup != void 0) {
  475. this.subgroup = subgroup;
  476. //this.floorNum = this.app.store.getValue('floorcad').floors.findIndex(c => c.subgroup == this.subgroup)
  477. //this.floorNum = subgroup
  478. this.floorNum = subgroup; //this.getFloorNumFromSubgroup(this.floor, subgroup) 使用数据顺序会使颠倒楼层的小地图数据不正确(floorplan.json已按楼层高低排序)
  479. } else {
  480. this.floorNum = this.floorNum == void 0 ? 0 : this.floorNum;
  481. }
  482. var metadata = this.app.store.getValue('metadata');
  483. this.initMapping();
  484. this.angle = metadata.floorPlanAngle;
  485. if (this.floor.type === 'image') {
  486. this.clear();
  487. var floor = this.floor.floors.find(function (c) { return c.subgroup == this$1$1.floorNum; });
  488. this.app.store.getUserImage(floor.filename, reload).then(function (img) {
  489. this$1$1.initMappingForImg(img.width, img.height);
  490. this$1$1.drawCadImg(img, this$1$1.angle, this$1$1.imgRes, floor.opacity / 100);
  491. if (this$1$1.player && this$1$1.player.camera) {
  492. this$1$1.drawPlayer(
  493. {
  494. x: this$1$1.player.camera.position.x,
  495. y: this$1$1.player.camera.position.z,
  496. },
  497. (this$1$1.player.cameraControls.controls.panorama.lon / 180) * Math.PI
  498. );
  499. }
  500. });
  501. } else {
  502. this.drawCad(this.floor.floors[this.floorNum]);
  503. //this.drawPanos(this.floorNum)
  504. }
  505. // 绘制完成才显示小地图
  506. this.$xui.show = true;
  507. if (this.ready == false) {
  508. this.ready = true;
  509. this.bindEvent();
  510. }
  511. if (this.player && this.player.camera) {
  512. this.drawPlayer(
  513. {
  514. x: this.player.camera.position.x,
  515. y: this.player.camera.position.z,
  516. },
  517. (this.player.cameraControls.controls.panorama.lon / 180) * Math.PI
  518. );
  519. }
  520. };
  521. MinMap.prototype.setCadBounding = function setCadBounding () {
  522. // let minX = null,
  523. // minY = null,
  524. // maxX = null,
  525. // maxY = null
  526. // for (let i = 0; i < this.floor.floors.length; ++i) {
  527. // if (this.floor.floors[i].boundingBox) {
  528. // if (minX == null || minX > this.floor.floors[i].boundingBox.minX) {
  529. // minX = this.floor.floors[i].boundingBox.minX
  530. // }
  531. // if (minY == null || minY > this.floor.floors[i].boundingBox.minY) {
  532. // minY = this.floor.floors[i].boundingBox.minY
  533. // }
  534. // if (maxX == null || maxX < this.floor.floors[i].boundingBox.maxX) {
  535. // maxX = this.floor.floors[i].boundingBox.maxX
  536. // }
  537. // if (maxY == null || maxY < this.floor.floors[i].boundingBox.maxY) {
  538. // maxY = this.floor.floors[i].boundingBox.maxY
  539. // }
  540. // }
  541. // }
  542. // this.cad_bounding = this.Bounds(minX, minY, maxX, maxY)
  543. var minX = null,
  544. minY = null,
  545. maxX = null,
  546. maxY = null;
  547. for (var i = 0; i < this.floor.floors.length; ++i) {
  548. if (this.floor.floors[i].points) {
  549. for (var key in this.floor.floors[i].points) {
  550. if (minX == null || minX > this.floor.floors[i].points[key].x) {
  551. minX = this.floor.floors[i].points[key].x;
  552. }
  553. if (minY == null || minY > this.floor.floors[i].points[key].y) {
  554. minY = this.floor.floors[i].points[key].y;
  555. }
  556. if (maxX == null || maxX < this.floor.floors[i].points[key].x) {
  557. maxX = this.floor.floors[i].points[key].x;
  558. }
  559. if (maxY == null || maxY < this.floor.floors[i].points[key].y) {
  560. maxY = this.floor.floors[i].points[key].y;
  561. }
  562. }
  563. }
  564. }
  565. this.cad_bounding = this.Bounds(minX, minY, maxX, maxY);
  566. };
  567. MinMap.prototype.drawPlayer = function drawPlayer (point, angle) {
  568. angle += this.angle;
  569. if (angle < 0 || angle > 2 * Math.PI) {
  570. var n = angle / (2 * Math.PI);
  571. angle = angle - Math.floor(n) * (2 * Math.PI);
  572. if (angle < 0) {
  573. angle += 2 * Math.PI;
  574. }
  575. }
  576. if (this.playerPoint == null || this.playerPoint.x != point.x || this.playerPoint.y != point.y || this.playerAngle == null || this.playerAngle != angle) {
  577. this.clearCanvas();
  578. this.playerPoint = point;
  579. point = this.getVectorForRotate(point);
  580. point = this.getScreenXY(point);
  581. var endpoints = mathUtil.getEndpoint(point, angle, theme.cameraSectorAngle);
  582. this.drawSector(point, endpoints.p1, endpoints.p2, mathUtil.distanceForPoints(point, endpoints.p1));
  583. this.playerAngle = angle;
  584. this.drawPoint(point);
  585. this.drawCircle(point);
  586. }
  587. };
  588. MinMap.prototype.initContext = function initContext () {
  589. this.canvas1 = this.dom.querySelector('canvas[xui_min_map_cad]');
  590. this.canvas2 = this.dom.querySelector('canvas[xui_min_map_dir]');
  591. this.canvas3 = this.dom.querySelector('canvas[xui_min_map_img]');
  592. this.context1 = this.canvas1.getContext('2d');
  593. this.context2 = this.canvas2.getContext('2d');
  594. this.initRatio();
  595. this.canvas1.width = this.canvas1.clientWidth * this.ratio;
  596. this.canvas1.height = this.canvas1.clientHeight * this.ratio;
  597. this.canvas2.width = this.canvas2.clientWidth * this.ratio;
  598. this.canvas2.height = this.canvas2.clientHeight * this.ratio;
  599. this.context1.scale(this.ratio, this.ratio);
  600. this.context2.scale(this.ratio, this.ratio);
  601. this.canvas_bounding = this.Bounds(
  602. -this.canvas1.width / 2 + canvasPadding.left,
  603. -this.canvas1.height / 2 + canvasPadding.top,
  604. this.canvas1.width / 2 - canvasPadding.right,
  605. this.canvas1.height / 2 - canvasPadding.down
  606. );
  607. };
  608. MinMap.prototype.bindEvent = function bindEvent () {
  609. var this$1$1 = this;
  610. this.$minmap.addEventListener('click', function () {
  611. if (this$1$1.app.store.getValue('metadata').controls.showFloorplan) {
  612. if (this$1$1.app.Camera.locked) {
  613. return
  614. }
  615. this$1$1.app.Camera.floorplan();
  616. }
  617. });
  618. if (!this.player) {
  619. this.player = this.app.core.get('Player');
  620. }
  621. this.player.on('update', function (ref) {
  622. var x = ref.x;
  623. var y = ref.y;
  624. var lon = ref.lon;
  625. ref.hasChanged;
  626. if (this$1$1.player.cameraControls.activeControl && !this$1$1.player.cameraControls.activeControl.updateForCad) {
  627. if (!this$1$1.floor || this$1$1.app.MinMap.display === false) {
  628. return
  629. }
  630. this$1$1.drawPlayer(
  631. {
  632. x: x,
  633. y: -1 * y,
  634. },
  635. (lon / 180) * Math.PI
  636. );
  637. }
  638. });
  639. this.player.on('flying.ended', function (ref) {
  640. var targetPano = ref.targetPano;
  641. if (targetPano.floorIndex !== this$1$1.subgroup) {
  642. this$1$1.render(targetPano.floorIndex);
  643. }
  644. });
  645. };
  646. //得测试一下手机端是否模糊
  647. MinMap.prototype.initRatio = function initRatio () {
  648. this.context1.webkitBackingStorePixelRatio ||
  649. this.context1.mozBackingStorePixelRatio ||
  650. this.context1.msBackingStorePixelRatio ||
  651. this.context1.oBackingStorePixelRatio ||
  652. this.context1.backingStorePixelRatio ||
  653. 1;
  654. //this.ratio = devicePixelRatio / backingStoreRatio
  655. this.ratio = 1;
  656. };
  657. MinMap.prototype.initMapping = function initMapping () {
  658. var scaleX = Math.abs((this.canvas_bounding.right - this.canvas_bounding.left) / (this.cad_bounding.right - this.cad_bounding.left));
  659. var scaleY = Math.abs((this.canvas_bounding.down - this.canvas_bounding.top) / (this.cad_bounding.top - this.cad_bounding.down));
  660. this.center = {
  661. x: (this.cad_bounding.left + this.cad_bounding.right) / 2,
  662. y: (this.cad_bounding.top + this.cad_bounding.down) / 2,
  663. };
  664. this.resolution = Math.min(scaleX, scaleY);
  665. };
  666. MinMap.prototype.getScreenXY = function getScreenXY (point) {
  667. var x = (point.x - this.center.x) * this.resolution - this.canvas_bounding.left + canvasPadding.left;
  668. var y = this.canvas_bounding.top - (point.y - this.center.y) * this.resolution + canvasPadding.top;
  669. x = (0.5 + x) << 0;
  670. y = (0.5 + y) << 0;
  671. return { x: Math.floor(x), y: Math.floor(y) }
  672. };
  673. MinMap.prototype.clear = function clear () {
  674. this.context1.clearRect(0, 0, this.context1.canvas.width, this.context1.canvas.height);
  675. };
  676. MinMap.prototype.drawDefaultCad = function drawDefaultCad (data) {
  677. var minX = null,
  678. minY = null,
  679. maxX = null,
  680. maxY = null;
  681. var points = {};
  682. if (data && data['vertex-xy']) {
  683. this.clear();
  684. for (var i = 0; i < data['vertex-xy'].length; ++i) {
  685. var point = data['vertex-xy'][i];
  686. points[point.id] = {
  687. x: point.x,
  688. y: point.y,
  689. };
  690. if (minX == null) {
  691. minX = point.x;
  692. } else if (minX > point.x) {
  693. minX = point.x;
  694. }
  695. if (minY == null) {
  696. minY = point.y;
  697. } else if (minY > point.y) {
  698. minY = point.y;
  699. }
  700. if (maxX == null) {
  701. maxX = point.x;
  702. } else if (maxX < point.x) {
  703. maxX = point.x;
  704. }
  705. if (maxY == null) {
  706. maxY = point.y;
  707. } else if (maxY < point.y) {
  708. maxY = point.y;
  709. }
  710. }
  711. } else {
  712. return
  713. }
  714. this.cad_bounding = this.Bounds(minX, minY, maxX, maxY);
  715. this.initMapping();
  716. if (data.segment) {
  717. this.context1.lineCap = 'square'; //线段端点的样式
  718. // 绘制线段
  719. this.context1.beginPath();
  720. for (var i$1 = 0; i$1 < data.segment.length; ++i$1) {
  721. var segment = data.segment[i$1];
  722. var startId = segment.a;
  723. var endId = segment.b;
  724. var start = this.getScreenXY(points[startId]);
  725. var end = this.getScreenXY(points[endId]);
  726. if (segment.border) {
  727. this.context1.lineWidth = Style.Wall.important.lineWidth;
  728. this.context1.strokeStyle = Style.Wall.important.strokeStyle;
  729. } else if (!segment.border && !segment.exterior) {
  730. this.context1.lineWidth = Style.Wall.lineWidth;
  731. this.context1.strokeStyle = Style.Wall.strokeStyle;
  732. } else if (segment.exterior) {
  733. this.context1.lineWidth = Style.Wall.important.lineWidth;
  734. this.context1.strokeStyle = Style.Wall.important.strokeStyle;
  735. }
  736. // 起点
  737. this.context1.moveTo(start.x, start.y);
  738. // 终点
  739. this.context1.lineTo(end.x, end.y);
  740. this.context1.stroke();
  741. }
  742. }
  743. };
  744. MinMap.prototype.drawCad = function drawCad (data) {
  745. // this.cad_bounding = this.Bounds(data.boundingBox.minX, data.boundingBox.minY, data.boundingBox.maxX, data.boundingBox.maxY)
  746. // this.initMapping()
  747. if (data.walls) {
  748. this.clear();
  749. this.context1.lineCap = 'square'; //线段端点的样式
  750. // 绘制线段
  751. this.context1.beginPath();
  752. for (var key in data.walls) {
  753. this.drawWall(data, key);
  754. }
  755. }
  756. if (data.symbols) {
  757. for (var key$1 in data.symbols) {
  758. this.drawSymbol(data.symbols[key$1]);
  759. }
  760. }
  761. if (data.components) {
  762. for (var key$2 in data.components) {
  763. this.drawComponent(data.components[key$2]);
  764. }
  765. }
  766. };
  767. MinMap.prototype.drawPoint = function drawPoint (point) {
  768. var twoPi = Math.PI * 2;
  769. //let pt = this.getScreenXY(point)
  770. var pt = point;
  771. this.context2.save();
  772. this.context2.fillStyle = theme.camera_fillStyle;
  773. this.context2.beginPath();
  774. this.context2.moveTo(pt.x, pt.y);
  775. this.context2.arc(pt.x, pt.y, theme.cameraR, 0, twoPi, true);
  776. this.context2.closePath();
  777. this.context2.fill();
  778. this.context2.restore();
  779. };
  780. MinMap.prototype.drawCircle = function drawCircle (point) {
  781. var radius = theme.cameraR + 1;
  782. var twoPi = Math.PI * 2;
  783. //let pt = this.getScreenXY(point)
  784. var pt = point;
  785. this.context2.save();
  786. this.context2.strokeStyle = theme.camera_strokeStyle;
  787. this.context2.lineWidth = 2;
  788. this.context2.beginPath();
  789. this.context2.arc(pt.x, pt.y, radius, 0, twoPi, true);
  790. this.context2.closePath();
  791. this.context2.stroke();
  792. this.context2.restore();
  793. };
  794. MinMap.prototype.drawCircle2 = function drawCircle2 (point) {
  795. var radius = theme.cameraR + 1;
  796. var twoPi = Math.PI * 2;
  797. var pt = this.getScreenXY(point);
  798. this.context2.save();
  799. this.context2.strokeStyle = theme.camera_strokeStyle;
  800. this.context2.lineWidth = 2;
  801. this.context2.beginPath();
  802. this.context2.arc(pt.x, pt.y, radius, 0, twoPi, true);
  803. this.context2.closePath();
  804. this.context2.stroke();
  805. this.context2.restore();
  806. };
  807. MinMap.prototype.drawSector = function drawSector (point1, point2, point3) {
  808. this.context2.save();
  809. var gr = this.context2.createRadialGradient(point1.x, point1.y, 0, point1.x, point1.y, mathUtil.distanceForPoints(point1, point2));
  810. //添加颜色端点
  811. gr.addColorStop(0, theme.cameraSector_fillStyle[0]);
  812. gr.addColorStop(1, theme.cameraSector_fillStyle[1]);
  813. // let pt1 = this.getScreenXY(point1);
  814. // let pt2 = this.getScreenXY(point2);
  815. // let pt3 = this.getScreenXY(point3);
  816. var pt1 = point1;
  817. var pt2 = point2;
  818. var pt3 = point3;
  819. this.context2.fillStyle = gr;
  820. this.context2.beginPath();
  821. this.context2.moveTo(pt1.x, pt1.y); //创建一个起点
  822. this.context2.lineTo(pt2.x, pt2.y); // 创建一个水平线
  823. this.context2.arcTo(pt2.x, pt2.y, pt3.x, pt3.y, theme.cameraSectorR); // 创建一个弧
  824. this.context2.lineTo(pt3.x, pt3.y); // 继续垂直线
  825. this.context2.closePath();
  826. this.context2.fill();
  827. this.context2.restore();
  828. };
  829. MinMap.prototype.drawWall = function drawWall (data, key) {
  830. var segment = data.walls[key];
  831. var startId = segment.start;
  832. var endId = segment.end;
  833. // let start = this.getScreenXY(data.points[startId])
  834. // let end = this.getScreenXY(data.points[endId])
  835. var start = data.points[startId];
  836. var end = data.points[endId];
  837. var points = [];
  838. points.push(start);
  839. for (var i = 0; i < segment.children.length; ++i) {
  840. var symbol = data.symbols[segment.children[i]];
  841. points.push(symbol.startPoint);
  842. points.push(symbol.endPoint);
  843. }
  844. points.push(end);
  845. points = points.sort(sortNumber.bind(this));
  846. function sortNumber(a, b) {
  847. return mathUtil.getDistance(start, a) - mathUtil.getDistance(start, b)
  848. }
  849. this.context1.save();
  850. this.context1.beginPath();
  851. this.context1.lineCap = 'square'; //线段端点的样式
  852. if (segment.important) {
  853. this.context1.lineWidth = Style.Wall.important.lineWidth;
  854. this.context1.strokeStyle = Style.Wall.important.strokeStyle;
  855. } else if (!segment.important && !segment.out) {
  856. this.context1.lineWidth = Style.Wall.lineWidth;
  857. this.context1.strokeStyle = Style.Wall.strokeStyle;
  858. } else if (segment.out) {
  859. this.context1.lineWidth = Style.Wall.important.lineWidth;
  860. this.context1.strokeStyle = Style.Wall.important.strokeStyle;
  861. }
  862. for (var i$1 = 0; i$1 < points.length - 1; i$1 += 2) {
  863. var point1 = this.getScreenXY(points[i$1]);
  864. var point2 = this.getScreenXY(points[i$1 + 1]);
  865. this.context1.moveTo(point1.x, point1.y);
  866. this.context1.lineTo(point2.x, point2.y);
  867. }
  868. this.context1.stroke();
  869. // // 起点
  870. // this.context1.moveTo(start.x, start.y)
  871. // // 终点
  872. // this.context1.lineTo(end.x, end.y)
  873. // this.context1.stroke()
  874. this.context1.restore();
  875. };
  876. MinMap.prototype.drawSymbol = function drawSymbol (symbol) {
  877. switch (symbol.geoType) {
  878. case VectorType.SingleDoor:
  879. this.drawSingleDoor(symbol);
  880. break
  881. case VectorType.DoubleDoor:
  882. this.drawDoubleDoor(symbol);
  883. break
  884. case VectorType.SlideDoor:
  885. this.drawSlideDoor(symbol);
  886. break
  887. case VectorType.SingleWindow:
  888. this.drawSingleWindow(symbol);
  889. break
  890. case VectorType.FrenchWindow:
  891. this.drawFrenchWindow(symbol);
  892. break
  893. case VectorType.BayWindow:
  894. this.drawBayWindow(symbol);
  895. break
  896. case VectorType.Pass:
  897. this.drawPass(symbol);
  898. break
  899. }
  900. };
  901. MinMap.prototype.drawComponent = function drawComponent (component) {
  902. switch (component.geoType) {
  903. case VectorType.Beam:
  904. this.drawBeam(component);
  905. break
  906. case VectorType.Flue:
  907. this.drawFlue(component);
  908. break
  909. case VectorType.Corridor:
  910. this.drawCorridor(component);
  911. break
  912. }
  913. };
  914. MinMap.prototype.drawSingleDoor = function drawSingleDoor (geometry) {
  915. var points2d = geometry.points2d;
  916. if (!points2d) {
  917. points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide);
  918. }
  919. var points = [];
  920. for (var i = 0; i < points2d.length; ++i) {
  921. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  922. }
  923. var distance = mathUtil.getDistance(points[0], points[1]);
  924. this.context1.save();
  925. this.context1.lineWidth = Style.Symbol.lineWidth;
  926. this.context1.lineCap = 'square';
  927. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  928. this.context1.beginPath();
  929. this.context1.moveTo(points[0].x, points[0].y);
  930. this.context1.lineTo(points[1].x, points[1].y);
  931. this.context1.arcTo(points[2].x, points[2].y, points[3].x, points[3].y, distance); // 创建弧
  932. this.context1.closePath();
  933. this.context1.stroke();
  934. this.context1.restore();
  935. // if (geometry.enter != null) {
  936. // this.drawEntranceDoor(geometry)
  937. // }
  938. };
  939. MinMap.prototype.drawDoubleDoor = function drawDoubleDoor (geometry) {
  940. var points2d = geometry.points2d;
  941. if (!points2d) {
  942. points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide);
  943. }
  944. var points = [];
  945. for (var i = 0; i < points2d.length; ++i) {
  946. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  947. }
  948. var distance = mathUtil.getDistance(points[0], points[1]);
  949. this.context1.save();
  950. this.context1.lineWidth = Style.Symbol.lineWidth;
  951. this.context1.lineCap = 'square';
  952. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  953. this.context1.beginPath();
  954. this.context1.moveTo(points[0].x, points[0].y);
  955. this.context1.lineTo(points[1].x, points[1].y);
  956. this.context1.arcTo(points[4].x, points[4].y, points[5].x, points[5].y, distance); // 创建弧
  957. this.context1.closePath();
  958. this.context1.stroke();
  959. this.context1.beginPath();
  960. this.context1.moveTo(points[2].x, points[2].y);
  961. this.context1.lineTo(points[1].x, points[1].y);
  962. this.context1.arcTo(points[4].x, points[4].y, points[3].x, points[3].y, distance); // 创建弧
  963. this.context1.closePath();
  964. this.context1.stroke();
  965. this.context1.restore();
  966. // if (geometry.enter != null) {
  967. // this.drawEntranceDoor(geometry)
  968. // }
  969. };
  970. MinMap.prototype.drawSlideDoor = function drawSlideDoor (geometry) {
  971. var points2d = geometry.points2d;
  972. if (!points2d) {
  973. points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide);
  974. }
  975. var points = [];
  976. for (var i = 0; i < points2d.length; ++i) {
  977. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  978. }
  979. this.context1.save();
  980. this.context1.lineWidth = Style.Symbol.lineWidth;
  981. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  982. this.context1.beginPath();
  983. this.context1.moveTo(points[0].x, points[0].y);
  984. this.context1.lineTo(points[1].x, points[1].y);
  985. this.context1.lineTo(points[2].x, points[2].y);
  986. this.context1.lineTo(points[3].x, points[3].y);
  987. this.context1.closePath();
  988. this.context1.stroke();
  989. this.context1.beginPath();
  990. this.context1.moveTo(points[4].x, points[4].y);
  991. this.context1.lineTo(points[5].x, points[5].y);
  992. this.context1.lineTo(points[6].x, points[6].y);
  993. this.context1.lineTo(points[7].x, points[7].y);
  994. this.context1.closePath();
  995. this.context1.stroke();
  996. this.context1.restore();
  997. // if (geometry.enter != null) {
  998. // this.drawEntranceDoor(geometry)
  999. // }
  1000. };
  1001. MinMap.prototype.drawSingleWindow = function drawSingleWindow (geometry) {
  1002. var points2d = geometry.points2d;
  1003. if (!points2d) {
  1004. points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide);
  1005. }
  1006. var points = [];
  1007. for (var i = 0; i < points2d.length; ++i) {
  1008. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1009. }
  1010. this.context1.save();
  1011. this.context1.lineWidth = Style.Symbol.lineWidth;
  1012. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  1013. this.context1.beginPath();
  1014. this.context1.moveTo(points[0].x, points[0].y);
  1015. this.context1.lineTo(points[1].x, points[1].y);
  1016. this.context1.stroke();
  1017. this.context1.beginPath();
  1018. this.context1.moveTo(points[2].x, points[2].y);
  1019. this.context1.lineTo(points[3].x, points[3].y);
  1020. this.context1.lineTo(points[4].x, points[4].y);
  1021. this.context1.lineTo(points[5].x, points[5].y);
  1022. this.context1.closePath();
  1023. this.context1.stroke();
  1024. this.context1.restore();
  1025. };
  1026. MinMap.prototype.drawBayWindow = function drawBayWindow (geometry) {
  1027. var points2d = geometry.points2d;
  1028. if (!points2d) {
  1029. points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide);
  1030. }
  1031. var points = [];
  1032. for (var i = 0; i < points2d.length; ++i) {
  1033. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1034. }
  1035. this.context1.save();
  1036. this.context1.lineWidth = Style.Symbol.lineWidth;
  1037. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  1038. this.context1.beginPath();
  1039. this.context1.moveTo(points[0].x, points[0].y);
  1040. this.context1.lineTo(points[1].x, points[1].y);
  1041. this.context1.lineTo(points[2].x, points[2].y);
  1042. this.context1.lineTo(points[3].x, points[3].y);
  1043. this.context1.closePath();
  1044. this.context1.stroke();
  1045. this.context1.beginPath();
  1046. this.context1.moveTo(points[5].x, points[5].y);
  1047. this.context1.lineTo(points[6].x, points[6].y);
  1048. this.context1.lineTo(points[7].x, points[7].y);
  1049. this.context1.lineTo(points[4].x, points[4].y);
  1050. this.context1.stroke();
  1051. this.context1.restore();
  1052. };
  1053. MinMap.prototype.drawFrenchWindow = function drawFrenchWindow (geometry) {
  1054. var points2d = geometry.points2d;
  1055. if (!points2d) {
  1056. points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide);
  1057. }
  1058. var points = [];
  1059. for (var i = 0; i < points2d.length; ++i) {
  1060. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1061. }
  1062. this.context1.save();
  1063. this.context1.lineWidth = Style.Symbol.lineWidth;
  1064. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  1065. this.context1.beginPath();
  1066. this.context1.moveTo(points[0].x, points[0].y);
  1067. this.context1.lineTo(points[1].x, points[1].y);
  1068. this.context1.moveTo(points[2].x, points[2].y);
  1069. this.context1.lineTo(points[3].x, points[3].y);
  1070. this.context1.moveTo(points[4].x, points[4].y);
  1071. this.context1.lineTo(points[5].x, points[5].y);
  1072. this.context1.moveTo(points[2].x, points[2].y);
  1073. this.context1.lineTo(points[4].x, points[4].y);
  1074. this.context1.moveTo(points[3].x, points[3].y);
  1075. this.context1.lineTo(points[5].x, points[5].y);
  1076. this.context1.moveTo(points[6].x, points[6].y);
  1077. this.context1.lineTo(points[7].x, points[7].y);
  1078. this.context1.stroke();
  1079. this.context1.restore();
  1080. };
  1081. MinMap.prototype.drawEntranceDoor = function drawEntranceDoor (symbol) {
  1082. this.context1.save();
  1083. var mid = {
  1084. x: (symbol.startPoint.x + symbol.endPoint.x) / 2,
  1085. y: (symbol.startPoint.y + symbol.endPoint.y) / 2,
  1086. };
  1087. var line = mathUtil.createLine1(symbol.startPoint, symbol.endPoint);
  1088. var vLine = mathUtil.getLineForPoint(line, mid);
  1089. var lines = null;
  1090. var position = null;
  1091. var join1, join2;
  1092. //方向相同的时候,指向symbol的中点
  1093. if (symbol.openSide != symbol.enter) {
  1094. lines = mathUtil.getParallelLineForDistance(line, this.enter_mini_Img.height / 2 / this.resolution);
  1095. }
  1096. //不同的时候,离中点有一定距离
  1097. else {
  1098. lines = mathUtil.getParallelLineForDistance(line, this.enter_mini_Img.height / 2 / this.resolution + mathUtil.getDistance(symbol.startPoint, symbol.endPoint));
  1099. }
  1100. join1 = mathUtil.getIntersectionPoint(lines.line1, vLine);
  1101. join2 = mathUtil.getIntersectionPoint(lines.line2, vLine);
  1102. var angle = mathUtil.Angle(
  1103. symbol.startPoint,
  1104. {
  1105. x: symbol.startPoint.x + 1,
  1106. y: symbol.startPoint.y,
  1107. },
  1108. symbol.endPoint
  1109. );
  1110. if (mathUtil.isClockwise([symbol.startPoint, symbol.endPoint, join2])) {
  1111. //LEFT
  1112. if (symbol.openSide == 'LEFT') {
  1113. if (symbol.enter == 'default') {
  1114. position = join1;
  1115. } else {
  1116. position = join2;
  1117. }
  1118. } else {
  1119. if (symbol.enter == 'default') {
  1120. position = join2;
  1121. } else {
  1122. position = join1;
  1123. }
  1124. }
  1125. } else if (mathUtil.isClockwise([symbol.startPoint, symbol.endPoint, join1])) {
  1126. //LEFT
  1127. if (symbol.openSide == 'LEFT') {
  1128. if (symbol.enter == 'default') {
  1129. position = join2;
  1130. } else {
  1131. position = join1;
  1132. }
  1133. } else {
  1134. if (symbol.enter == 'default') {
  1135. position = join1;
  1136. } else {
  1137. position = join2;
  1138. }
  1139. }
  1140. }
  1141. if (!mathUtil.isClockwise([symbol.startPoint, symbol.endPoint, position])) {
  1142. angle = Math.PI + angle;
  1143. }
  1144. mid = this.getScreenXY(mid);
  1145. position = this.getScreenXY(position);
  1146. this.context1.translate(position.x, position.y);
  1147. if (symbol.startPoint.y <= symbol.endPoint.y) {
  1148. this.context1.rotate(-angle);
  1149. } else {
  1150. this.context1.rotate(angle);
  1151. }
  1152. this.context1.drawImage(this.enter_mini_Img, -this.enter_mini_Img.width / 2, -this.enter_mini_Img.height / 2);
  1153. this.context1.restore();
  1154. };
  1155. MinMap.prototype.drawPass = function drawPass (geometry) {
  1156. var points2d = geometry.points2d;
  1157. var points = [];
  1158. for (var i = 0; i < points2d.length; ++i) {
  1159. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1160. }
  1161. this.context1.save();
  1162. this.context1.lineWidth = Style.Symbol.lineWidth;
  1163. this.context1.strokeStyle = Style.Symbol.strokeStyle;
  1164. this.context1.beginPath();
  1165. this.context1.moveTo(points[0].x, points[0].y);
  1166. this.context1.lineTo(points[1].x, points[1].y);
  1167. this.context1.lineTo(points[2].x, points[2].y);
  1168. this.context1.lineTo(points[3].x, points[3].y);
  1169. this.context1.closePath();
  1170. this.context1.stroke();
  1171. this.context1.beginPath();
  1172. this.context1.moveTo(points[4].x, points[4].y);
  1173. this.context1.lineTo(points[5].x, points[5].y);
  1174. this.context1.setLineDash([3, 2, 2]);
  1175. this.context1.stroke();
  1176. this.context1.beginPath();
  1177. this.context1.moveTo(points[6].x, points[6].y);
  1178. this.context1.lineTo(points[7].x, points[7].y);
  1179. this.context1.setLineDash([3, 2, 2]);
  1180. this.context1.stroke();
  1181. this.context1.restore();
  1182. };
  1183. MinMap.prototype.drawBeam = function drawBeam (geometry) {
  1184. var points2d = geometry.points2d;
  1185. var points = [];
  1186. for (var i = 0; i < points2d.length; ++i) {
  1187. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1188. }
  1189. this.context1.save();
  1190. this.context1.lineWidth = Style.Component.lineWidth;
  1191. this.context1.strokeStyle = Style.Component.strokeStyle;
  1192. this.context1.beginPath();
  1193. this.context1.moveTo(points[0].x, points[0].y);
  1194. this.context1.lineTo(points[1].x, points[1].y);
  1195. this.context1.lineTo(points[2].x, points[2].y);
  1196. this.context1.lineTo(points[3].x, points[3].y);
  1197. this.context1.closePath();
  1198. this.context1.stroke();
  1199. this.context1.moveTo(points[0].x, points[0].y);
  1200. this.context1.lineTo(points[2].x, points[2].y);
  1201. this.context1.moveTo(points[1].x, points[1].y);
  1202. this.context1.lineTo(points[3].x, points[3].y);
  1203. this.context1.stroke();
  1204. this.context1.restore();
  1205. };
  1206. MinMap.prototype.drawFlue = function drawFlue (geometry) {
  1207. var points2d = geometry.points2d;
  1208. var points = [];
  1209. for (var i = 0; i < points2d.length; ++i) {
  1210. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1211. }
  1212. this.context1.save();
  1213. this.context1.lineWidth = Style.Component.lineWidth;
  1214. this.context1.strokeStyle = Style.Component.strokeStyle;
  1215. this.context1.beginPath();
  1216. this.context1.moveTo(points[0].x, points[0].y);
  1217. this.context1.lineTo(points[1].x, points[1].y);
  1218. this.context1.lineTo(points[2].x, points[2].y);
  1219. this.context1.lineTo(points[3].x, points[3].y);
  1220. this.context1.closePath();
  1221. this.context1.beginPath();
  1222. this.context1.moveTo(points[4].x, points[4].y);
  1223. this.context1.lineTo(points[5].x, points[5].y);
  1224. this.context1.lineTo(points[6].x, points[6].y);
  1225. this.context1.lineTo(points[7].x, points[7].y);
  1226. this.context1.closePath();
  1227. this.context1.moveTo(points[4].x, points[4].y);
  1228. this.context1.lineTo(points[8].x, points[8].y);
  1229. this.context1.lineTo(points[6].x, points[6].y);
  1230. this.context1.stroke();
  1231. this.context1.restore();
  1232. };
  1233. MinMap.prototype.drawCorridor = function drawCorridor (geometry) {
  1234. var points2d = geometry.points2d;
  1235. var points = [];
  1236. for (var i = 0; i < points2d.length; ++i) {
  1237. points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y });
  1238. }
  1239. this.context1.save();
  1240. this.context1.lineWidth = Style.Component.lineWidth;
  1241. this.context1.strokeStyle = Style.Component.strokeStyle;
  1242. this.context1.beginPath();
  1243. this.context1.moveTo(points[0].x, points[0].y);
  1244. this.context1.lineTo(points[1].x, points[1].y);
  1245. this.context1.lineTo(points[2].x, points[2].y);
  1246. this.context1.lineTo(points[3].x, points[3].y);
  1247. this.context1.closePath();
  1248. this.context1.stroke();
  1249. for (var i$1 = 4; i$1 < points.length - 1; i$1 += 2) {
  1250. this.context1.moveTo(points[i$1].x, points[i$1].y);
  1251. this.context1.lineTo(points[i$1 + 1].x, points[i$1 + 1].y);
  1252. }
  1253. this.context1.stroke();
  1254. this.context1.restore();
  1255. };
  1256. MinMap.prototype.drawPanos = function drawPanos (floorNum) {
  1257. if (!this.player) {
  1258. this.player = this.app.core.get('Player');
  1259. }
  1260. var panos = this.player.model.panos.list;
  1261. for (var i = 0; i < panos.length; ++i) {
  1262. var pano = panos[i];
  1263. if (pano.floorIndex != floorNum) {
  1264. continue
  1265. }
  1266. var position = this.getVectorForRotate({ x: pano.position.x, y: -1 * pano.position.z }, this.angle);
  1267. this.drawCircle2(position);
  1268. this.drawText(position, pano.id);
  1269. }
  1270. };
  1271. // 文字
  1272. MinMap.prototype.drawText = function drawText (position, txt, screenCoord, angle) {
  1273. this.context1.save();
  1274. this.context1.font = '12px Microsoft YaHei';
  1275. var pt = { x: position.x, y: position.y };
  1276. if (!screenCoord) {
  1277. pt = this.getScreenXY({ x: position.x, y: position.y });
  1278. }
  1279. if (angle) {
  1280. this.context1.translate(pt.x, pt.y);
  1281. this.context1.rotate(angle);
  1282. this.context1.fillText(txt, 0, 0);
  1283. } else {
  1284. this.context1.fillText(txt, pt.x, pt.y);
  1285. }
  1286. this.context1.restore();
  1287. };
  1288. MinMap.prototype.getVectorForRotate = function getVectorForRotate (point) {
  1289. var angle = -1 * this.angle;
  1290. if (Math.abs(angle) < 0.01 || Math.abs(angle - 2 * Math.PI) < 0.01) {
  1291. return point
  1292. } else {
  1293. var defaultCenter = new THREE.Vector2(this.player.model.center.x, -1 * this.player.model.center.z);
  1294. // let defaultCenter = {
  1295. // x: (this.cad_bounding.left + this.cad_bounding.right) / 2,
  1296. // y: (this.cad_bounding.top + this.cad_bounding.down) / 2,
  1297. // }
  1298. var x = (point.x - defaultCenter.x) * Math.cos(angle) - (point.y - defaultCenter.y) * Math.sin(angle) + defaultCenter.x;
  1299. var y = (point.y - defaultCenter.y) * Math.cos(angle) + (point.x - defaultCenter.x) * Math.sin(angle) + defaultCenter.y;
  1300. point.x = x;
  1301. point.y = y;
  1302. return point
  1303. }
  1304. };
  1305. //图形的范围
  1306. MinMap.prototype.Bounds = function Bounds (x1, y1, x2, y2) {
  1307. var bounds = {};
  1308. bounds.leftBottom = { x: x1, y: y1 };
  1309. bounds.rigthTop = { x: x2, y: y2 };
  1310. bounds.leftTop = { x: x1, y: y2 };
  1311. bounds.rightBottom = { x: x2, y: y1 };
  1312. bounds.left = x1;
  1313. bounds.right = x2;
  1314. bounds.down = y1;
  1315. bounds.top = y2;
  1316. return bounds
  1317. };
  1318. MinMap.prototype.clearCanvas = function clearCanvas (mode) {
  1319. if (mode == 1) {
  1320. this.context1.clearRect(0, 0, this.canvas1.width, this.canvas1.height);
  1321. } else {
  1322. this.context2.clearRect(0, 0, this.canvas2.width, this.canvas2.height);
  1323. }
  1324. };
  1325. /*****************************************************************左上角图片***************************************************************************/
  1326. //计算图片与canvas的映射,因为图片的像素一般大于canvas的长宽,图片的中心和canvas的中心重合
  1327. //三维场景的坐标系与canvas坐标系进行映射,三维场景对应的楼层的center与canvas的中心重合
  1328. MinMap.prototype.initMappingForImg = function initMappingForImg (cadImg_Width, cadImg_Height) {
  1329. var scaleX = Math.abs((this.canvas_bounding.right - this.canvas_bounding.left) / cadImg_Width);
  1330. var scaleY = Math.abs((this.canvas_bounding.down - this.canvas_bounding.top) / cadImg_Height);
  1331. this.center = {
  1332. x: 0,
  1333. y: 0,
  1334. };
  1335. this.imgRes = Math.min(scaleX, scaleY);
  1336. var boundingBox = this.player.model.floors.index[0].boundingBox;
  1337. var size = boundingBox.getSize(new THREE.Vector3());
  1338. scaleX = Math.abs((this.canvas_bounding.right - this.canvas_bounding.left) / Math.abs(size.x));
  1339. scaleY = Math.abs((this.canvas_bounding.down - this.canvas_bounding.top) / Math.abs(size.z));
  1340. this.resolution = Math.min(scaleX, scaleY);
  1341. };
  1342. //transparentValue是0-1
  1343. MinMap.prototype.drawCadImg = function drawCadImg (img, angle, scale, transparentValue) {
  1344. if (transparentValue < 0.3) {
  1345. transparentValue = 0.3;
  1346. }
  1347. this.context1.save();
  1348. this.context1.globalAlpha = transparentValue;
  1349. this.context1.translate(this.canvas1.width / 2, this.canvas1.height / 2);
  1350. this.context1.rotate(angle);
  1351. this.context1.scale(scale, scale);
  1352. this.context1.translate(-img.width / 2, -img.height / 2);
  1353. this.context1.drawImage(img, 0, 0);
  1354. this.context1.restore();
  1355. };
  1356. /*****************************************************************************************************************************************************/
  1357. MinMap.prototype.setPoints2d = function setPoints2d (geoType, startPoint, endPoint, openSide) {
  1358. var points2d = null;
  1359. switch (geoType) {
  1360. case VectorType.SingleDoor:
  1361. points2d = this.setSingleDoorPoints2d(startPoint, endPoint, openSide);
  1362. break
  1363. case VectorType.DoubleDoor:
  1364. points2d = this.setDoubleDoorPoints2d(startPoint, endPoint, openSide);
  1365. break
  1366. case VectorType.SlideDoor:
  1367. points2d = this.setSlideDoorPoints2d(startPoint, endPoint, openSide);
  1368. break
  1369. case VectorType.SingleWindow:
  1370. points2d = this.setSingleWindowPoints2d(startPoint, endPoint);
  1371. break
  1372. case VectorType.FrenchWindow:
  1373. points2d = this.setFrenchWindowPoints2d(startPoint, endPoint);
  1374. break
  1375. case VectorType.BayWindow:
  1376. points2d = this.setBayWindowPoints2d(startPoint, endPoint, openSide);
  1377. break
  1378. }
  1379. return points2d
  1380. };
  1381. MinMap.prototype.setBayWindowPoints2d = function setBayWindowPoints2d (startPoint, endPoint, openSide) {
  1382. var thickness = 1;
  1383. var line = mathUtil.createLine1(startPoint, endPoint);
  1384. var len1 = mathUtil.getDistance(startPoint, endPoint) / 2;
  1385. var len2 = 4 / this.resolution + len1;
  1386. var midPoint = {
  1387. x: (startPoint.x + endPoint.x) / 2,
  1388. y: (startPoint.y + endPoint.y) / 2,
  1389. };
  1390. var vertline = mathUtil.getVerticalLine(line, midPoint);
  1391. var vStartLine1, vStartLine2, vEndLine1, vEndLine2;
  1392. //垂直
  1393. var lines1 = mathUtil.getParallelLineForDistance(vertline, len1);
  1394. var lines2 = mathUtil.getParallelLineForDistance(vertline, len2);
  1395. var dis1 = mathUtil.getDisForPoinLine(startPoint, lines1.line1);
  1396. var dis2 = mathUtil.getDisForPoinLine(startPoint, lines1.line2);
  1397. if (dis1 > dis2) {
  1398. vStartLine1 = lines1.line2;
  1399. vStartLine2 = lines2.line2;
  1400. vEndLine1 = lines1.line1;
  1401. vEndLine2 = lines2.line1;
  1402. } else {
  1403. vStartLine1 = lines1.line1;
  1404. vStartLine2 = lines2.line1;
  1405. vEndLine1 = lines1.line2;
  1406. vEndLine2 = lines2.line2;
  1407. }
  1408. //平行
  1409. var lines3 = mathUtil.getParallelLineForDistance(line, 2 / this.resolution);
  1410. var lines4 = mathUtil.getParallelLineForDistance(line, thickness - 2 / this.resolution);
  1411. var lines5 = mathUtil.getParallelLineForDistance(line, thickness);
  1412. var pLine1 = lines3.line1;
  1413. var pLine2 = lines3.line2;
  1414. var pLine3 = lines4.line2;
  1415. var pLine4 = lines5.line2;
  1416. var pLine5 = lines3.line2;
  1417. var pLine6 = lines3.line1;
  1418. var pLine7 = lines4.line1;
  1419. var pLine8 = lines5.line1;
  1420. var point1 = mathUtil.getIntersectionPoint(vStartLine1, pLine1);
  1421. var point2 = mathUtil.getIntersectionPoint(vEndLine1, pLine1);
  1422. var point3 = mathUtil.getIntersectionPoint(vEndLine1, pLine3);
  1423. var point4 = mathUtil.getIntersectionPoint(vStartLine1, pLine3);
  1424. var point5 = mathUtil.getIntersectionPoint(vStartLine2, pLine2);
  1425. var point6 = mathUtil.getIntersectionPoint(vEndLine2, pLine2);
  1426. var point7 = mathUtil.getIntersectionPoint(vEndLine2, pLine4);
  1427. var point8 = mathUtil.getIntersectionPoint(vStartLine2, pLine4);
  1428. var point9 = mathUtil.getIntersectionPoint(vStartLine1, pLine5);
  1429. var point10 = mathUtil.getIntersectionPoint(vEndLine1, pLine5);
  1430. var point11 = mathUtil.getIntersectionPoint(vEndLine1, pLine7);
  1431. var point12 = mathUtil.getIntersectionPoint(vStartLine1, pLine7);
  1432. var point13 = mathUtil.getIntersectionPoint(vStartLine2, pLine6);
  1433. var point14 = mathUtil.getIntersectionPoint(vEndLine2, pLine6);
  1434. var point15 = mathUtil.getIntersectionPoint(vEndLine2, pLine8);
  1435. var point16 = mathUtil.getIntersectionPoint(vStartLine2, pLine8);
  1436. var points2d = [];
  1437. points2d.push(point1);
  1438. points2d.push(point2);
  1439. points2d.push(point3);
  1440. points2d.push(point4);
  1441. if (openSide == 'LEFT') {
  1442. //逆时针
  1443. if (mathUtil.isClockwise(points2d)) {
  1444. points2d.push(point5);
  1445. points2d.push(point6);
  1446. points2d.push(point7);
  1447. points2d.push(point8);
  1448. } else {
  1449. points2d = [];
  1450. points2d.push(point9);
  1451. points2d.push(point10);
  1452. points2d.push(point11);
  1453. points2d.push(point12);
  1454. points2d.push(point13);
  1455. points2d.push(point14);
  1456. points2d.push(point15);
  1457. points2d.push(point16);
  1458. }
  1459. } else if (openSide == 'RIGHT') {
  1460. //逆时针
  1461. if (mathUtil.isClockwise(points2d)) {
  1462. points2d = [];
  1463. points2d.push(point9);
  1464. points2d.push(point10);
  1465. points2d.push(point11);
  1466. points2d.push(point12);
  1467. points2d.push(point13);
  1468. points2d.push(point14);
  1469. points2d.push(point15);
  1470. points2d.push(point16);
  1471. } else {
  1472. points2d.push(point5);
  1473. points2d.push(point6);
  1474. points2d.push(point7);
  1475. points2d.push(point8);
  1476. }
  1477. }
  1478. return points2d
  1479. };
  1480. MinMap.prototype.setDoubleDoorPoints2d = function setDoubleDoorPoints2d (startPoint, endPoint, openSide) {
  1481. var line = mathUtil.createLine1(startPoint, endPoint);
  1482. var len = mathUtil.getDistance(startPoint, endPoint);
  1483. var lines = mathUtil.getParallelLineForDistance(line, len / 2);
  1484. var vertline1 = mathUtil.getVerticalLine(line, startPoint);
  1485. var vertline2 = mathUtil.getVerticalLine(line, endPoint);
  1486. var midPoint = {
  1487. x: (startPoint.x + endPoint.x) / 2,
  1488. y: (startPoint.y + endPoint.y) / 2,
  1489. };
  1490. var vertline = mathUtil.getVerticalLine(line, midPoint);
  1491. var startJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline1);
  1492. var startJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline1);
  1493. var endJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline2);
  1494. var endJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline2);
  1495. var midJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline);
  1496. var midJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline);
  1497. var points2d = [];
  1498. points2d.push(startPoint);
  1499. points2d.push(midPoint);
  1500. points2d.push(endPoint);
  1501. points2d.push(endJoin1);
  1502. points2d.push(midJoin1);
  1503. points2d.push(startJoin1);
  1504. //逆时针
  1505. if (openSide == 'LEFT') {
  1506. if (mathUtil.isClockwise(points2d)) ; else {
  1507. points2d = [];
  1508. points2d.push(startPoint);
  1509. points2d.push(midPoint);
  1510. points2d.push(endPoint);
  1511. points2d.push(endJoin2);
  1512. points2d.push(midJoin2);
  1513. points2d.push(startJoin2);
  1514. }
  1515. } else if (openSide == 'RIGHT') {
  1516. if (mathUtil.isClockwise(points2d)) {
  1517. points2d = [];
  1518. points2d.push(startPoint);
  1519. points2d.push(midPoint);
  1520. points2d.push(endPoint);
  1521. points2d.push(endJoin2);
  1522. points2d.push(midJoin2);
  1523. points2d.push(startJoin2);
  1524. }
  1525. }
  1526. return points2d
  1527. };
  1528. MinMap.prototype.setFrenchWindowPoints2d = function setFrenchWindowPoints2d (startPoint, endPoint) {
  1529. var len = 4 / this.resolution;
  1530. var line = mathUtil.createLine1(startPoint, endPoint);
  1531. var lines = mathUtil.getParallelLineForDistance(line, len);
  1532. var vertline1 = mathUtil.getVerticalLine(line, startPoint);
  1533. var vertline2 = mathUtil.getVerticalLine(line, endPoint);
  1534. var points2d = [];
  1535. points2d.push(startPoint);
  1536. points2d.push(endPoint);
  1537. var midPoint = {
  1538. x: (startPoint.x + endPoint.x) / 2,
  1539. y: (startPoint.y + endPoint.y) / 2,
  1540. };
  1541. var vertline = mathUtil.getVerticalLine(line, midPoint);
  1542. var startJoin1 = mathUtil.getIntersectionPoint(vertline1, lines.line1);
  1543. var endJoin1 = mathUtil.getIntersectionPoint(vertline2, lines.line1);
  1544. points2d.push(startJoin1);
  1545. points2d.push(endJoin1);
  1546. var startJoin2 = mathUtil.getIntersectionPoint(vertline1, lines.line2);
  1547. var endJoin2 = mathUtil.getIntersectionPoint(vertline2, lines.line2);
  1548. points2d.push(startJoin2);
  1549. points2d.push(endJoin2);
  1550. var midJoin1 = mathUtil.getIntersectionPoint(vertline, lines.line1);
  1551. var midJoin2 = mathUtil.getIntersectionPoint(vertline, lines.line2);
  1552. points2d.push(midJoin1);
  1553. points2d.push(midJoin2);
  1554. return points2d
  1555. };
  1556. MinMap.prototype.setSingleDoorPoints2d = function setSingleDoorPoints2d (startPoint, endPoint, openSide) {
  1557. var line = mathUtil.createLine1(startPoint, endPoint);
  1558. var len = mathUtil.getDistance(startPoint, endPoint);
  1559. var lines = mathUtil.getParallelLineForDistance(line, len);
  1560. var vertline1 = mathUtil.getVerticalLine(line, startPoint);
  1561. var vertline2 = mathUtil.getVerticalLine(line, endPoint);
  1562. var startJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline1);
  1563. var startJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline1);
  1564. var endJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline2);
  1565. var endJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline2);
  1566. var points2d = [];
  1567. points2d.push(startPoint);
  1568. points2d.push(endPoint);
  1569. points2d.push(endJoin1);
  1570. points2d.push(startJoin1);
  1571. //逆时针
  1572. if (openSide == 'LEFT') {
  1573. if (mathUtil.isClockwise(points2d)) ; else {
  1574. points2d = [];
  1575. points2d.push(startPoint);
  1576. points2d.push(endPoint);
  1577. points2d.push(endJoin2);
  1578. points2d.push(startJoin2);
  1579. }
  1580. } else if (openSide == 'RIGHT') {
  1581. if (mathUtil.isClockwise(points2d)) {
  1582. points2d = [];
  1583. points2d.push(startPoint);
  1584. points2d.push(endPoint);
  1585. points2d.push(endJoin2);
  1586. points2d.push(startJoin2);
  1587. }
  1588. }
  1589. return points2d
  1590. };
  1591. MinMap.prototype.setSingleWindowPoints2d = function setSingleWindowPoints2d (startPoint, endPoint) {
  1592. var points2d = [];
  1593. points2d.push(startPoint);
  1594. points2d.push(endPoint);
  1595. var len = 4 / this.resolution;
  1596. var line = mathUtil.createLine1(startPoint, endPoint);
  1597. var lines = mathUtil.getParallelLineForDistance(line, len);
  1598. var vertline1 = mathUtil.getVerticalLine(line, startPoint);
  1599. var vertline2 = mathUtil.getVerticalLine(line, endPoint);
  1600. var point1 = mathUtil.getIntersectionPoint(vertline1, lines.line1);
  1601. var point2 = mathUtil.getIntersectionPoint(vertline2, lines.line1);
  1602. var point3 = mathUtil.getIntersectionPoint(vertline2, lines.line2);
  1603. var point4 = mathUtil.getIntersectionPoint(vertline1, lines.line2);
  1604. points2d.push(point1);
  1605. points2d.push(point2);
  1606. points2d.push(point3);
  1607. points2d.push(point4);
  1608. return points2d
  1609. };
  1610. MinMap.prototype.setSlideDoorPoints2d = function setSlideDoorPoints2d (startPoint, endPoint, openSide) {
  1611. var line = mathUtil.createLine1(startPoint, endPoint);
  1612. var len = 2 / this.resolution;
  1613. var lines1 = mathUtil.getParallelLineForDistance(line, len);
  1614. if (startPoint.x > endPoint.x) {
  1615. var temp = lines1.line1;
  1616. lines1.line1 = lines1.line2;
  1617. lines1.line2 = temp;
  1618. }
  1619. var vertline1 = mathUtil.getVerticalLine(line, startPoint);
  1620. var vertline2 = mathUtil.getVerticalLine(line, endPoint);
  1621. var line1 = lines1.line1;
  1622. var line2 = lines1.line2;
  1623. var startJoin = mathUtil.getIntersectionPoint(lines1.line1, vertline1);
  1624. var endJoin = mathUtil.getIntersectionPoint(lines1.line2, vertline2);
  1625. var points2d = [];
  1626. points2d.push(startPoint);
  1627. points2d.push(endPoint);
  1628. points2d.push(startJoin);
  1629. if (mathUtil.isClockwise(points2d)) {
  1630. if (openSide == null || openSide == 'LEFT') ; else {
  1631. line1 = lines1.line2;
  1632. line2 = lines1.line1;
  1633. startJoin = mathUtil.getIntersectionPoint(line1, vertline1);
  1634. endJoin = mathUtil.getIntersectionPoint(line2, vertline2);
  1635. }
  1636. } else {
  1637. if (openSide == null || openSide == 'LEFT') {
  1638. line1 = lines1.line2;
  1639. line2 = lines1.line1;
  1640. startJoin = mathUtil.getIntersectionPoint(line1, vertline1);
  1641. endJoin = mathUtil.getIntersectionPoint(line2, vertline2);
  1642. }
  1643. }
  1644. var midPoint = {
  1645. x: (startPoint.x + endPoint.x) / 2,
  1646. y: (startPoint.y + endPoint.y) / 2,
  1647. };
  1648. points2d = [];
  1649. points2d.push(startPoint);
  1650. var width = 4 / this.resolution;
  1651. var vertline = mathUtil.getVerticalLine(line, midPoint);
  1652. var lines2 = mathUtil.getParallelLineForDistance(vertline, width);
  1653. var join1 = mathUtil.getIntersectionPoint(line1, lines2.line1);
  1654. var join2 = mathUtil.getIntersectionPoint(line1, lines2.line2);
  1655. var join3 = mathUtil.getIntersectionPoint(line2, lines2.line1);
  1656. var join4 = mathUtil.getIntersectionPoint(line2, lines2.line2);
  1657. var join5 = mathUtil.getIntersectionPoint(line, lines2.line1);
  1658. var join6 = mathUtil.getIntersectionPoint(line, lines2.line2);
  1659. if (mathUtil.getDistance(startPoint, join5) < mathUtil.getDistance(startPoint, join6)) {
  1660. points2d.push(join6);
  1661. points2d.push(join2);
  1662. points2d.push(startJoin);
  1663. points2d.push(endPoint);
  1664. points2d.push(join5);
  1665. points2d.push(join3);
  1666. points2d.push(endJoin);
  1667. } else {
  1668. points2d.push(join5);
  1669. points2d.push(join1);
  1670. points2d.push(startJoin);
  1671. points2d.push(endPoint);
  1672. points2d.push(join6);
  1673. points2d.push(join4);
  1674. points2d.push(endJoin);
  1675. }
  1676. return points2d
  1677. };
  1678. MinMap.prototype.setSlideDoorPoints2d = function setSlideDoorPoints2d (startPoint, endPoint, openSide) {
  1679. var line = mathUtil.createLine1(startPoint, endPoint);
  1680. var len = 2 / this.resolution;
  1681. var lines1 = mathUtil.getParallelLineForDistance(line, len);
  1682. if (startPoint.x > endPoint.x) {
  1683. var temp = lines1.line1;
  1684. lines1.line1 = lines1.line2;
  1685. lines1.line2 = temp;
  1686. }
  1687. var vertline1 = mathUtil.getVerticalLine(line, startPoint);
  1688. var vertline2 = mathUtil.getVerticalLine(line, endPoint);
  1689. var line1 = lines1.line1;
  1690. var line2 = lines1.line2;
  1691. var startJoin = mathUtil.getIntersectionPoint(lines1.line1, vertline1);
  1692. var endJoin = mathUtil.getIntersectionPoint(lines1.line2, vertline2);
  1693. var points2d = [];
  1694. points2d.push(startPoint);
  1695. points2d.push(endPoint);
  1696. points2d.push(startJoin);
  1697. if (mathUtil.isClockwise(points2d)) {
  1698. if (openSide == null || openSide == 'LEFT') ; else {
  1699. line1 = lines1.line2;
  1700. line2 = lines1.line1;
  1701. startJoin = mathUtil.getIntersectionPoint(line1, vertline1);
  1702. endJoin = mathUtil.getIntersectionPoint(line2, vertline2);
  1703. }
  1704. } else {
  1705. if (openSide == null || openSide == 'LEFT') {
  1706. line1 = lines1.line2;
  1707. line2 = lines1.line1;
  1708. startJoin = mathUtil.getIntersectionPoint(line1, vertline1);
  1709. endJoin = mathUtil.getIntersectionPoint(line2, vertline2);
  1710. }
  1711. }
  1712. var midPoint = {
  1713. x: (startPoint.x + endPoint.x) / 2,
  1714. y: (startPoint.y + endPoint.y) / 2,
  1715. };
  1716. points2d = [];
  1717. points2d.push(startPoint);
  1718. var width = 4 / this.resolution;
  1719. var vertline = mathUtil.getVerticalLine(line, midPoint);
  1720. var lines2 = mathUtil.getParallelLineForDistance(vertline, width);
  1721. var join1 = mathUtil.getIntersectionPoint(line1, lines2.line1);
  1722. var join2 = mathUtil.getIntersectionPoint(line1, lines2.line2);
  1723. var join3 = mathUtil.getIntersectionPoint(line2, lines2.line1);
  1724. var join4 = mathUtil.getIntersectionPoint(line2, lines2.line2);
  1725. var join5 = mathUtil.getIntersectionPoint(line, lines2.line1);
  1726. var join6 = mathUtil.getIntersectionPoint(line, lines2.line2);
  1727. if (mathUtil.getDistance(startPoint, join5) < mathUtil.getDistance(startPoint, join6)) {
  1728. points2d.push(join6);
  1729. points2d.push(join2);
  1730. points2d.push(startJoin);
  1731. points2d.push(endPoint);
  1732. points2d.push(join5);
  1733. points2d.push(join3);
  1734. points2d.push(endJoin);
  1735. } else {
  1736. points2d.push(join5);
  1737. points2d.push(join1);
  1738. points2d.push(startJoin);
  1739. points2d.push(endPoint);
  1740. points2d.push(join6);
  1741. points2d.push(join4);
  1742. points2d.push(endJoin);
  1743. }
  1744. return points2d
  1745. };
  1746. function Plugin(app, config) {
  1747. if ( config === void 0 ) config = {};
  1748. var deferred = KanKan.Deferred();
  1749. var scope = null;
  1750. if (config.el) {
  1751. scope = config.el === 'string' ? document.querySelector(config.el) : config.el;
  1752. }
  1753. var started = function () {
  1754. var plugin = new MinMap(app, scope || app.dom, config);
  1755. plugin.$scope = scope;
  1756. plugin.$html = html;
  1757. plugin.$name = 'MinMap';
  1758. plugin.$load = function () {
  1759. PetiteVue.createApp({
  1760. show: false,
  1761. create: function create() {
  1762. plugin.$xui = this;
  1763. plugin.init();
  1764. if (!app.store.getValue('metadata').controls.showMap) {
  1765. plugin.hide();
  1766. }
  1767. app.MinMap.install(plugin);
  1768. },
  1769. }).mount((scope || app.dom).querySelector('[xui_min_map]'));
  1770. };
  1771. deferred.resolve(plugin);
  1772. };
  1773. if (app.Scene.loaded) {
  1774. started();
  1775. } else {
  1776. app.Scene.on('loaded', started);
  1777. }
  1778. return deferred
  1779. }
  1780. return Plugin;
  1781. }());
  1782. //# sourceMappingURL=MinMap.js.map