var MinMap = (function () { 'use strict'; var html = "
"; var MathUtil = function MathUtil() {}; MathUtil.prototype.getFixed = function getFixed (num, decimal) { if (!decimal) { decimal = 5; } // return Math.floor(num * 10000) / 10000; return parseFloat(num.toFixed(decimal)) }; MathUtil.prototype.createLine1 = function createLine1 (point1, point2) { if (point1.x == point2.x && point1.y == point2.y) { return null } else if (this.getFixed(Math.abs(point1.x - point2.x)) == 0) { return { x: point1.x } } else if (this.getFixed(Math.abs(point1.y - point2.y)) == 0) { return { y: point1.y } } var parametera = (point1.y - point2.y) / (point1.x - point2.x); var parameterb = (point1.x * point2.y - point2.x * point1.y) / (point1.x - point2.x); if (this.getFixed(parametera) == 0) { return { y: this.getFixed(parameterb) } } var parameter = { a: this.getFixed(parametera), b: this.getFixed(parameterb) }; return parameter }; MathUtil.prototype.createLine2 = function createLine2 (point, angle) { if (angle == Math.PI / 2 || angle == 1.5 * Math.PI) { return { x: point.x } } var a = Math.tan(angle); var b = point.y - a * point.x; if (a != 0) { return { a: a, b: b } } else { return { y: point.y } } }; // 与lineA平行并且point在线上 MathUtil.prototype.createLine3 = function createLine3 (lineA, point) { var parameter = {}; if (typeof lineA.a === 'undefined') { if (typeof lineA.x !== 'undefined') { parameter.x = point.x; } else if (typeof lineA.y !== 'undefined') { parameter.y = point.y; } } else { parameter.a = lineA.a; parameter.b = point.y - point.x * lineA.a; } return parameter }; MathUtil.prototype.create2AngleLine = function create2AngleLine (point, angle, driftAngle) { var line1 = this.createLine2(point, angle - driftAngle / 2); var line2 = this.createLine2(point, angle + driftAngle / 2); return { line1: line1, line2: line2 } }; MathUtil.prototype.distanceForPoints = function distanceForPoints (point1, point2) { return Math.sqrt(Math.pow(point1.x - point2.x, 2) + Math.pow(point1.y - point2.y, 2)) }; //与line平行且两条线直接的距离是distance的两条线 MathUtil.prototype.getParallelLineForDistance = function getParallelLineForDistance (line, distance) { var line1 = {}; line1.a = line.a; line1.b = line.b; var line2 = {}; line2.a = line.a; line2.b = line.b; if (typeof line.a == 'undefined') { if (line.hasOwnProperty('x')) { var x = line.x; line1.x = x + distance; line2.x = x - distance; } else if (line.hasOwnProperty('y')) { var y = line.y; line1.y = y + distance; line2.y = y - distance; } } else { var angle = Math.atan(line.a); var db = Math.abs(distance / Math.cos(angle)); var b = line.b; line1.b = b + db; line2.b = b - db; } return { line1: line1, line2: line2 } }; //获取扇形的两个端点 MathUtil.prototype.getEndpoint = function getEndpoint (point, angle, sectorAngle) { var distance = 15; //line1是减,line2是加 var lines1 = this.create2AngleLine(point, angle, sectorAngle); var line = this.createLine2(point, angle); line = this.getLineForPoint(line, point); var lines2 = this.getParallelLineForDistance(line, distance); var point1 = this.getIntersectionPoint(lines1.line1, lines2.line1); var point2 = this.getIntersectionPoint(lines1.line1, lines2.line2); var point3 = this.getIntersectionPoint(lines1.line2, lines2.line1); var point4 = this.getIntersectionPoint(lines1.line2, lines2.line2); var angle1 = this.Angle(point, point1, { x: point.x + 1, y: point.y }); var angle2 = this.Angle(point, point2, { x: point.x + 1, y: point.y }); var angle3 = this.Angle(point, point3, { x: point.x + 1, y: point.y }); var angle4 = this.Angle(point, point4, { x: point.x + 1, y: point.y }); if (angle > Math.PI) { angle = 2 * Math.PI - angle; } if (Math.abs((angle1 + angle3) / 2 - angle) < Math.abs((angle2 + angle4) / 2 - angle)) { return { p1: point1, p2: point3 } } else { return { p1: point2, p2: point4 } } }; //两条线的交点 MathUtil.prototype.getIntersectionPoint = function getIntersectionPoint (parameter1, parameter2) { if (this.isParallel(parameter1, parameter2)) { return null } if (typeof parameter1.a == 'undefined' && typeof parameter2.a != 'undefined') { if (parameter1.x) { return { x: parameter1.x, y: parameter2.a * parameter1.x + parameter2.b } } else if (parameter1.y) { return { x: (parameter1.y - parameter2.b) / parameter2.a, y: parameter1.y } } } else if (typeof parameter2.a == 'undefined' && typeof parameter1.a != 'undefined') { if (parameter2.x) { return { x: parameter2.x, y: parameter1.a * parameter2.x + parameter1.b } } else if (parameter2.y) { return { x: (parameter2.y - parameter1.b) / parameter1.a, y: parameter2.y } } } else if (typeof parameter2.a == 'undefined' && typeof parameter1.a == 'undefined') { if (parameter1.hasOwnProperty('x') && parameter2.hasOwnProperty('y')) { return { x: parameter1.x, y: parameter2.y } } else if (parameter1.hasOwnProperty('y') && parameter2.hasOwnProperty('x')) { return { x: parameter2.x, y: parameter1.y } } else { return null } } if (parameter1.a == parameter2.a) { return null } var joinpointx = (parameter2.b - parameter1.b) / (parameter1.a - parameter2.a); var joinpointy = (parameter1.a * parameter2.b - parameter2.a * parameter1.b) / (parameter1.a - parameter2.a); var point = { x: joinpointx, y: joinpointy }; return point }; //返回true表示平行 MathUtil.prototype.isParallel = function isParallel (line1, line2) { var fixed = this.fixed; if (typeof line1.a == 'undefined' && typeof line2.a == 'undefined') { if (line1.hasOwnProperty('x') && line2.hasOwnProperty('x')) { return true } else if (line1.hasOwnProperty('y') && line2.hasOwnProperty('y')) { return true } else { return false } } else if (typeof line1.a == 'undefined' || typeof line2.a == 'undefined') { return false } else if (line1.a.toFixed(fixed) == line2.a.toFixed(fixed)) { return true } else { return false } }; //两条相交的线段的夹角,永远小于180度 MathUtil.prototype.Angle = function Angle (o, s, e) { var cosfi = 0, fi = 0, norm = 0; var dsx = s.x - o.x; var dsy = s.y - o.y; var dex = e.x - o.x; var dey = e.y - o.y; cosfi = dsx * dex + dsy * dey; norm = (dsx * dsx + dsy * dsy) * (dex * dex + dey * dey); cosfi /= Math.sqrt(norm); if (cosfi >= 1.0) { return 0 } //if (cosfi <= -1.0) return Math.PI; if (cosfi <= -1.0) { return 180 } fi = Math.acos(cosfi); if ((180 * fi) / Math.PI < 180) { //return 180 * fi / Math.PI; return fi } else { //return 360 - 180 * fi / Math.PI; return 2 * Math.PI - fi } }; //经过point且与line垂直的线 MathUtil.prototype.getLineForPoint = function getLineForPoint (line, point) { var parameter = {}; if (line.a == 0 || typeof line.a == 'undefined') { if (line.hasOwnProperty('x')) { parameter.y = point.y; } else if (line.hasOwnProperty('y')) { parameter.x = point.x; } } else { parameter.a = -1 / line.a; parameter.b = point.y - point.x * parameter.a; } return parameter }; MathUtil.prototype.createLine2 = function createLine2 (point, angle) { if (angle == Math.PI / 2 || angle == 1.5 * Math.PI) { return { x: point.x } } var a = Math.tan(angle); var b = point.y - a * point.x; if (a != 0) { return { a: a, b: b } } else { return { y: point.y } } }; // 求两个点的距离 MathUtil.prototype.getDistance = function getDistance (p1, p2) { var x1 = p1.x; var y1 = p1.y; var x2 = p2.x; var y2 = p2.y; var num = Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2)); return this.getFixed(num) }; // true表示逆时针,false表示顺时针 MathUtil.prototype.isClockwise = function isClockwise (vertices) { var area = 0; for (var i = 0; i < vertices.length; i++) { var j = (i + 1) % vertices.length; area += vertices[i].x * vertices[j].y; area -= vertices[j].x * vertices[i].y; } var sub = area / 2; if (sub > 0) { // 逆时针 return true } else { // 顺时针 return false } }; // 垂直线 MathUtil.prototype.getVerticalLine = function getVerticalLine (line, point) { if (typeof line.a === 'undefined') { if (line.hasOwnProperty('x')) { return { y: point.y } } else if (line.hasOwnProperty('y')) { return { x: point.x } } else { return null } } else if (line.a == 0) { return { x: point.x } } else { var tl = {}; tl.a = -1 / line.a; var result = this.createLine3(tl, point); return result } }; var mathUtil = new MathUtil(); var Style = { Wall: { strokeStyle: '#FFFFFF', lineWidth: 2, lineWidth_out: 4, //承重墙 important: { strokeStyle: '#FFFFFF', lineWidth: 4, }, error: { strokeStyle: 'rgba(255,0,0,0.5)', fillStyle: 'rgba(255,0,0,0.8)', }, }, Point: { strokeStyle: 'green', fillStyle: 'rgb(0, 200, 175)', radius: 4, }, Symbol: { strokeStyle: 'rgba(255,255,255,1)', fillStyle: 'rgba(255,255,255,0)', lineWidth: 1, //垭口 Pass: {}, }, Component: { strokeStyle: 'rgba(255,255,255,1)', fillStyle: 'rgba(255,255,255,0)', lineWidth: 1, }, Tag: { strokeStyle: 'rgb(255,255,255,1)', fillStyle: 'rgb(255,255,255,1)', strokeStyle_adding: 'rgba(243, 255, 0, 0.8)', fillStyle_adding: 'rgba(243, 255, 0, 0.8)', lineWidth: 1, }, Font: { font: '12px Microsoft YaHei', fillStyle: '#FFFFFF', strokeStyle: '#FFFFFF', textAlign: 'center', textBaseline: 'middle', miterLimit: 10, direction: 'ltr', }, Pano: { radius: 10, lineWidth: 2, strokeStyle: 'rgba(255,255,255,0.4)', fillStyle: 'rgba(255,255,255,0.1)', }, Measure: { txt: 'rgba(255,255,255,0.6)', strokeStyle: 'rgba(255,255,255,0.6)', lineWidth: 1, }, }; var VectorType = { Point: 'Point', WallCorner: 'WallCorner', Wall: 'Wall', SingleDoor: 'SingleDoor', DoubleDoor: 'DoubleDoor', SlideDoor: 'SlideDoor', SingleWindow: 'SingleWindow', BayWindow: 'BayWindow', FrenchWindow: 'FrenchWindow', Pass: 'Pass', Beam: 'Beam', Flue: 'Flue', Corridor: 'Corridor', Line: 'Line', Tag: 'Tag', }; //相机(漫游点)的朝向对应的扇形广角 //cad区域离canvas上下左右的距离 var canvasPadding = { top: 20, down: 20, left: 20, right: 20, }; var theme = { cameraR: 2, //相机(漫游点)的半径 camera_fillStyle: '#1FE4DC', //相机(漫游点)的填充样式 camera_strokeStyle: 'white', //相机(漫游点)的外框样式 cameraSectorR: 18, //相机(漫游点)的朝向对应的扇形半径 cameraSector_fillStyle: ['rgba(31,228,220, 1)', 'rgba(31,228,220, 0)'], //相机(漫游点)的朝向对应的扇形填充样式 cameraSectorAngle: (70 / 180) * Math.PI, //70° //相机(漫游点)的朝向对应的扇形广角 }; var hexToRGBA = function (color, alpha) { //十六进制颜色值的正则表达式 var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/; color = color.toLowerCase(); // 如果是16进制颜色 if (color && reg.test(color)) { if (color.length === 4) { var colorNew = '#'; for (var i = 1; i < 4; i += 1) { colorNew += color.slice(i, i + 1).concat(color.slice(i, i + 1)); } color = colorNew; } //处理六位的颜色值 var colors = []; for (var i = 1; i < 7; i += 2) { colors.push(parseInt('0x' + color.slice(i, i + 2))); } if (alpha === void 0) { return ("rgb(" + (colors.join(',')) + ")") } else { return ("rgba(" + (colors.join(',')) + "," + (alpha === void 0 ? 1 : alpha) + ")") } } return color }; var MinMap = function MinMap(app, dom, config) { var this$1$1 = this; this.app = app; this.dom = dom; this.mode = null; this.ready = false; this.$minmap = null; if (config.theme) { this.theme(config.theme); } window.addEventListener('resize', function () { this$1$1.render(); }); this.app.core.get('Player').on('mode.changing', function (currentMode, mode, pano) { this$1$1.mode = mode; if (mode === 'panorama' && !this$1$1.app.core.get('Player').vrEnabled) { if (this$1$1.app.MinMap.display !== false && this$1$1.app.MinMap.hidden !== true) { this$1$1.show(); this$1$1.render(pano.floorIndex); } } else { this$1$1.hide(); } }); this.angle = 0; }; MinMap.prototype.init = function init () { this.canvas1 = null; this.canvas2 = null; this.canvas3 = null; this.context1 = null; this.context2 = null; this.ratio = null; //移动端需要放大3倍的样子画,这样才能清晰 this.resolution = null; this.playerPoint = null; this.playerAngle = null; this.canvas_bounding = null; //在规定的区域绘图(上下左右要有留边) this.cad_bounding = null; //户型数据的区域 this.$minmap = this.dom.querySelector('[xui_min_map]'); this.initContext(); this.data(); }; MinMap.prototype.data = function data (reload) { var this$1$1 = this; return this.app.store.get('flooruser', reload).then(function (floor) { //this.app.store.getAppImage('images/cad_enter_mini.png').then(img => { //this.enter_mini_Img = img //this.floor = floor this$1$1.floor = JSON.parse(JSON.stringify(floor)); this$1$1.floor.floors.sort(function (v1, v2) { return v1.subgroup - v2.subgroup }); this$1$1.setCadBounding(); this$1$1.render(this$1$1.app.core.get('Player').currentPano.floorIndex, reload); //}) }) }; MinMap.prototype.show = function show () { if (this.mode != 'panorama' && this.app.Camera.mode != 'panorama') { return } this.mode = null; this.$minmap && (this.$minmap.style.visibility = 'visible'); }; MinMap.prototype.hide = function hide () { this.$minmap && (this.$minmap.style.visibility = 'hidden'); }; MinMap.prototype.theme = function theme$1 (options) { if ( options === void 0 ) options = {}; if (options.camera_fillStyle && !options.cameraSector_fillStyle) { options.cameraSector_fillStyle = [hexToRGBA(options.camera_fillStyle, 1), hexToRGBA(options.camera_fillStyle, 0)]; } Object.assign(theme, options); }; //subgroup表示按照顺序拍摄的楼层,floorNum表示真正的楼层 MinMap.prototype.getFloorNumFromSubgroup = function getFloorNumFromSubgroup (floorsData, subgroup) { for (var i = 0; i < floorsData.floors.length; ++i) { var floor = floorsData.floors[i]; if (!floor.hasOwnProperty('subgroup') || floor.subgroup == subgroup) { return i } } }; //采用两个canvas叠加的方式,一个是cad,一个是相机。相机会经常刷新,cad保持不变 MinMap.prototype.render = function render (subgroup, reload) { var this$1$1 = this; if (!this.floor) { return } this.angle = 0; if (subgroup != void 0) { this.subgroup = subgroup; //this.floorNum = this.app.store.getValue('floorcad').floors.findIndex(c => c.subgroup == this.subgroup) //this.floorNum = subgroup this.floorNum = subgroup; //this.getFloorNumFromSubgroup(this.floor, subgroup) 使用数据顺序会使颠倒楼层的小地图数据不正确(floorplan.json已按楼层高低排序) } else { this.floorNum = this.floorNum == void 0 ? 0 : this.floorNum; } var metadata = this.app.store.getValue('metadata'); this.initMapping(); this.angle = metadata.floorPlanAngle; if (this.floor.type === 'image') { this.clear(); var floor = this.floor.floors.find(function (c) { return c.subgroup == this$1$1.floorNum; }); this.app.store.getUserImage(floor.filename, reload).then(function (img) { this$1$1.initMappingForImg(img.width, img.height); this$1$1.drawCadImg(img, this$1$1.angle, this$1$1.imgRes, floor.opacity / 100); if (this$1$1.player && this$1$1.player.camera) { this$1$1.drawPlayer( { x: this$1$1.player.camera.position.x, y: this$1$1.player.camera.position.z, }, (this$1$1.player.cameraControls.controls.panorama.lon / 180) * Math.PI ); } }); } else { this.drawCad(this.floor.floors[this.floorNum]); //this.drawPanos(this.floorNum) } // 绘制完成才显示小地图 this.$xui.show = true; if (this.ready == false) { this.ready = true; this.bindEvent(); } if (this.player && this.player.camera) { this.drawPlayer( { x: this.player.camera.position.x, y: this.player.camera.position.z, }, (this.player.cameraControls.controls.panorama.lon / 180) * Math.PI ); } }; MinMap.prototype.setCadBounding = function setCadBounding () { // let minX = null, // minY = null, // maxX = null, // maxY = null // for (let i = 0; i < this.floor.floors.length; ++i) { // if (this.floor.floors[i].boundingBox) { // if (minX == null || minX > this.floor.floors[i].boundingBox.minX) { // minX = this.floor.floors[i].boundingBox.minX // } // if (minY == null || minY > this.floor.floors[i].boundingBox.minY) { // minY = this.floor.floors[i].boundingBox.minY // } // if (maxX == null || maxX < this.floor.floors[i].boundingBox.maxX) { // maxX = this.floor.floors[i].boundingBox.maxX // } // if (maxY == null || maxY < this.floor.floors[i].boundingBox.maxY) { // maxY = this.floor.floors[i].boundingBox.maxY // } // } // } // this.cad_bounding = this.Bounds(minX, minY, maxX, maxY) var minX = null, minY = null, maxX = null, maxY = null; for (var i = 0; i < this.floor.floors.length; ++i) { if (this.floor.floors[i].points) { for (var key in this.floor.floors[i].points) { if (minX == null || minX > this.floor.floors[i].points[key].x) { minX = this.floor.floors[i].points[key].x; } if (minY == null || minY > this.floor.floors[i].points[key].y) { minY = this.floor.floors[i].points[key].y; } if (maxX == null || maxX < this.floor.floors[i].points[key].x) { maxX = this.floor.floors[i].points[key].x; } if (maxY == null || maxY < this.floor.floors[i].points[key].y) { maxY = this.floor.floors[i].points[key].y; } } } } this.cad_bounding = this.Bounds(minX, minY, maxX, maxY); }; MinMap.prototype.drawPlayer = function drawPlayer (point, angle) { angle += this.angle; if (angle < 0 || angle > 2 * Math.PI) { var n = angle / (2 * Math.PI); angle = angle - Math.floor(n) * (2 * Math.PI); if (angle < 0) { angle += 2 * Math.PI; } } if (this.playerPoint == null || this.playerPoint.x != point.x || this.playerPoint.y != point.y || this.playerAngle == null || this.playerAngle != angle) { this.clearCanvas(); this.playerPoint = point; point = this.getVectorForRotate(point); point = this.getScreenXY(point); var endpoints = mathUtil.getEndpoint(point, angle, theme.cameraSectorAngle); this.drawSector(point, endpoints.p1, endpoints.p2, mathUtil.distanceForPoints(point, endpoints.p1)); this.playerAngle = angle; this.drawPoint(point); this.drawCircle(point); } }; MinMap.prototype.initContext = function initContext () { this.canvas1 = this.dom.querySelector('canvas[xui_min_map_cad]'); this.canvas2 = this.dom.querySelector('canvas[xui_min_map_dir]'); this.canvas3 = this.dom.querySelector('canvas[xui_min_map_img]'); this.context1 = this.canvas1.getContext('2d'); this.context2 = this.canvas2.getContext('2d'); this.initRatio(); this.canvas1.width = this.canvas1.clientWidth * this.ratio; this.canvas1.height = this.canvas1.clientHeight * this.ratio; this.canvas2.width = this.canvas2.clientWidth * this.ratio; this.canvas2.height = this.canvas2.clientHeight * this.ratio; this.context1.scale(this.ratio, this.ratio); this.context2.scale(this.ratio, this.ratio); this.canvas_bounding = this.Bounds( -this.canvas1.width / 2 + canvasPadding.left, -this.canvas1.height / 2 + canvasPadding.top, this.canvas1.width / 2 - canvasPadding.right, this.canvas1.height / 2 - canvasPadding.down ); }; MinMap.prototype.bindEvent = function bindEvent () { var this$1$1 = this; this.$minmap.addEventListener('click', function () { if (this$1$1.app.store.getValue('metadata').controls.showFloorplan) { if (this$1$1.app.Camera.locked) { return } this$1$1.app.Camera.floorplan(); } }); if (!this.player) { this.player = this.app.core.get('Player'); } this.player.on('update', function (ref) { var x = ref.x; var y = ref.y; var lon = ref.lon; ref.hasChanged; if (this$1$1.player.cameraControls.activeControl && !this$1$1.player.cameraControls.activeControl.updateForCad) { if (!this$1$1.floor || this$1$1.app.MinMap.display === false) { return } this$1$1.drawPlayer( { x: x, y: -1 * y, }, (lon / 180) * Math.PI ); } }); this.player.on('flying.ended', function (ref) { var targetPano = ref.targetPano; if (targetPano.floorIndex !== this$1$1.subgroup) { this$1$1.render(targetPano.floorIndex); } }); }; //得测试一下手机端是否模糊 MinMap.prototype.initRatio = function initRatio () { this.context1.webkitBackingStorePixelRatio || this.context1.mozBackingStorePixelRatio || this.context1.msBackingStorePixelRatio || this.context1.oBackingStorePixelRatio || this.context1.backingStorePixelRatio || 1; //this.ratio = devicePixelRatio / backingStoreRatio this.ratio = 1; }; MinMap.prototype.initMapping = function initMapping () { var scaleX = Math.abs((this.canvas_bounding.right - this.canvas_bounding.left) / (this.cad_bounding.right - this.cad_bounding.left)); var scaleY = Math.abs((this.canvas_bounding.down - this.canvas_bounding.top) / (this.cad_bounding.top - this.cad_bounding.down)); this.center = { x: (this.cad_bounding.left + this.cad_bounding.right) / 2, y: (this.cad_bounding.top + this.cad_bounding.down) / 2, }; this.resolution = Math.min(scaleX, scaleY); }; MinMap.prototype.getScreenXY = function getScreenXY (point) { var x = (point.x - this.center.x) * this.resolution - this.canvas_bounding.left + canvasPadding.left; var y = this.canvas_bounding.top - (point.y - this.center.y) * this.resolution + canvasPadding.top; x = (0.5 + x) << 0; y = (0.5 + y) << 0; return { x: Math.floor(x), y: Math.floor(y) } }; MinMap.prototype.clear = function clear () { this.context1.clearRect(0, 0, this.context1.canvas.width, this.context1.canvas.height); }; MinMap.prototype.drawDefaultCad = function drawDefaultCad (data) { var minX = null, minY = null, maxX = null, maxY = null; var points = {}; if (data && data['vertex-xy']) { this.clear(); for (var i = 0; i < data['vertex-xy'].length; ++i) { var point = data['vertex-xy'][i]; points[point.id] = { x: point.x, y: point.y, }; if (minX == null) { minX = point.x; } else if (minX > point.x) { minX = point.x; } if (minY == null) { minY = point.y; } else if (minY > point.y) { minY = point.y; } if (maxX == null) { maxX = point.x; } else if (maxX < point.x) { maxX = point.x; } if (maxY == null) { maxY = point.y; } else if (maxY < point.y) { maxY = point.y; } } } else { return } this.cad_bounding = this.Bounds(minX, minY, maxX, maxY); this.initMapping(); if (data.segment) { this.context1.lineCap = 'square'; //线段端点的样式 // 绘制线段 this.context1.beginPath(); for (var i$1 = 0; i$1 < data.segment.length; ++i$1) { var segment = data.segment[i$1]; var startId = segment.a; var endId = segment.b; var start = this.getScreenXY(points[startId]); var end = this.getScreenXY(points[endId]); if (segment.border) { this.context1.lineWidth = Style.Wall.important.lineWidth; this.context1.strokeStyle = Style.Wall.important.strokeStyle; } else if (!segment.border && !segment.exterior) { this.context1.lineWidth = Style.Wall.lineWidth; this.context1.strokeStyle = Style.Wall.strokeStyle; } else if (segment.exterior) { this.context1.lineWidth = Style.Wall.important.lineWidth; this.context1.strokeStyle = Style.Wall.important.strokeStyle; } // 起点 this.context1.moveTo(start.x, start.y); // 终点 this.context1.lineTo(end.x, end.y); this.context1.stroke(); } } }; MinMap.prototype.drawCad = function drawCad (data) { // this.cad_bounding = this.Bounds(data.boundingBox.minX, data.boundingBox.minY, data.boundingBox.maxX, data.boundingBox.maxY) // this.initMapping() if (data.walls) { this.clear(); this.context1.lineCap = 'square'; //线段端点的样式 // 绘制线段 this.context1.beginPath(); for (var key in data.walls) { this.drawWall(data, key); } } if (data.symbols) { for (var key$1 in data.symbols) { this.drawSymbol(data.symbols[key$1]); } } if (data.components) { for (var key$2 in data.components) { this.drawComponent(data.components[key$2]); } } }; MinMap.prototype.drawPoint = function drawPoint (point) { var twoPi = Math.PI * 2; //let pt = this.getScreenXY(point) var pt = point; this.context2.save(); this.context2.fillStyle = theme.camera_fillStyle; this.context2.beginPath(); this.context2.moveTo(pt.x, pt.y); this.context2.arc(pt.x, pt.y, theme.cameraR, 0, twoPi, true); this.context2.closePath(); this.context2.fill(); this.context2.restore(); }; MinMap.prototype.drawCircle = function drawCircle (point) { var radius = theme.cameraR + 1; var twoPi = Math.PI * 2; //let pt = this.getScreenXY(point) var pt = point; this.context2.save(); this.context2.strokeStyle = theme.camera_strokeStyle; this.context2.lineWidth = 2; this.context2.beginPath(); this.context2.arc(pt.x, pt.y, radius, 0, twoPi, true); this.context2.closePath(); this.context2.stroke(); this.context2.restore(); }; MinMap.prototype.drawCircle2 = function drawCircle2 (point) { var radius = theme.cameraR + 1; var twoPi = Math.PI * 2; var pt = this.getScreenXY(point); this.context2.save(); this.context2.strokeStyle = theme.camera_strokeStyle; this.context2.lineWidth = 2; this.context2.beginPath(); this.context2.arc(pt.x, pt.y, radius, 0, twoPi, true); this.context2.closePath(); this.context2.stroke(); this.context2.restore(); }; MinMap.prototype.drawSector = function drawSector (point1, point2, point3) { this.context2.save(); var gr = this.context2.createRadialGradient(point1.x, point1.y, 0, point1.x, point1.y, mathUtil.distanceForPoints(point1, point2)); //添加颜色端点 gr.addColorStop(0, theme.cameraSector_fillStyle[0]); gr.addColorStop(1, theme.cameraSector_fillStyle[1]); // let pt1 = this.getScreenXY(point1); // let pt2 = this.getScreenXY(point2); // let pt3 = this.getScreenXY(point3); var pt1 = point1; var pt2 = point2; var pt3 = point3; this.context2.fillStyle = gr; this.context2.beginPath(); this.context2.moveTo(pt1.x, pt1.y); //创建一个起点 this.context2.lineTo(pt2.x, pt2.y); // 创建一个水平线 this.context2.arcTo(pt2.x, pt2.y, pt3.x, pt3.y, theme.cameraSectorR); // 创建一个弧 this.context2.lineTo(pt3.x, pt3.y); // 继续垂直线 this.context2.closePath(); this.context2.fill(); this.context2.restore(); }; MinMap.prototype.drawWall = function drawWall (data, key) { var segment = data.walls[key]; var startId = segment.start; var endId = segment.end; // let start = this.getScreenXY(data.points[startId]) // let end = this.getScreenXY(data.points[endId]) var start = data.points[startId]; var end = data.points[endId]; var points = []; points.push(start); for (var i = 0; i < segment.children.length; ++i) { var symbol = data.symbols[segment.children[i]]; points.push(symbol.startPoint); points.push(symbol.endPoint); } points.push(end); points = points.sort(sortNumber.bind(this)); function sortNumber(a, b) { return mathUtil.getDistance(start, a) - mathUtil.getDistance(start, b) } this.context1.save(); this.context1.beginPath(); this.context1.lineCap = 'square'; //线段端点的样式 if (segment.important) { this.context1.lineWidth = Style.Wall.important.lineWidth; this.context1.strokeStyle = Style.Wall.important.strokeStyle; } else if (!segment.important && !segment.out) { this.context1.lineWidth = Style.Wall.lineWidth; this.context1.strokeStyle = Style.Wall.strokeStyle; } else if (segment.out) { this.context1.lineWidth = Style.Wall.important.lineWidth; this.context1.strokeStyle = Style.Wall.important.strokeStyle; } for (var i$1 = 0; i$1 < points.length - 1; i$1 += 2) { var point1 = this.getScreenXY(points[i$1]); var point2 = this.getScreenXY(points[i$1 + 1]); this.context1.moveTo(point1.x, point1.y); this.context1.lineTo(point2.x, point2.y); } this.context1.stroke(); // // 起点 // this.context1.moveTo(start.x, start.y) // // 终点 // this.context1.lineTo(end.x, end.y) // this.context1.stroke() this.context1.restore(); }; MinMap.prototype.drawSymbol = function drawSymbol (symbol) { switch (symbol.geoType) { case VectorType.SingleDoor: this.drawSingleDoor(symbol); break case VectorType.DoubleDoor: this.drawDoubleDoor(symbol); break case VectorType.SlideDoor: this.drawSlideDoor(symbol); break case VectorType.SingleWindow: this.drawSingleWindow(symbol); break case VectorType.FrenchWindow: this.drawFrenchWindow(symbol); break case VectorType.BayWindow: this.drawBayWindow(symbol); break case VectorType.Pass: this.drawPass(symbol); break } }; MinMap.prototype.drawComponent = function drawComponent (component) { switch (component.geoType) { case VectorType.Beam: this.drawBeam(component); break case VectorType.Flue: this.drawFlue(component); break case VectorType.Corridor: this.drawCorridor(component); break } }; MinMap.prototype.drawSingleDoor = function drawSingleDoor (geometry) { var points2d = geometry.points2d; if (!points2d) { points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide); } var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } var distance = mathUtil.getDistance(points[0], points[1]); this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.lineCap = 'square'; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.arcTo(points[2].x, points[2].y, points[3].x, points[3].y, distance); // 创建弧 this.context1.closePath(); this.context1.stroke(); this.context1.restore(); // if (geometry.enter != null) { // this.drawEntranceDoor(geometry) // } }; MinMap.prototype.drawDoubleDoor = function drawDoubleDoor (geometry) { var points2d = geometry.points2d; if (!points2d) { points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide); } var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } var distance = mathUtil.getDistance(points[0], points[1]); this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.lineCap = 'square'; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.arcTo(points[4].x, points[4].y, points[5].x, points[5].y, distance); // 创建弧 this.context1.closePath(); this.context1.stroke(); this.context1.beginPath(); this.context1.moveTo(points[2].x, points[2].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.arcTo(points[4].x, points[4].y, points[3].x, points[3].y, distance); // 创建弧 this.context1.closePath(); this.context1.stroke(); this.context1.restore(); // if (geometry.enter != null) { // this.drawEntranceDoor(geometry) // } }; MinMap.prototype.drawSlideDoor = function drawSlideDoor (geometry) { var points2d = geometry.points2d; if (!points2d) { points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide); } var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.closePath(); this.context1.stroke(); this.context1.beginPath(); this.context1.moveTo(points[4].x, points[4].y); this.context1.lineTo(points[5].x, points[5].y); this.context1.lineTo(points[6].x, points[6].y); this.context1.lineTo(points[7].x, points[7].y); this.context1.closePath(); this.context1.stroke(); this.context1.restore(); // if (geometry.enter != null) { // this.drawEntranceDoor(geometry) // } }; MinMap.prototype.drawSingleWindow = function drawSingleWindow (geometry) { var points2d = geometry.points2d; if (!points2d) { points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide); } var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.stroke(); this.context1.beginPath(); this.context1.moveTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.lineTo(points[4].x, points[4].y); this.context1.lineTo(points[5].x, points[5].y); this.context1.closePath(); this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawBayWindow = function drawBayWindow (geometry) { var points2d = geometry.points2d; if (!points2d) { points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide); } var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.closePath(); this.context1.stroke(); this.context1.beginPath(); this.context1.moveTo(points[5].x, points[5].y); this.context1.lineTo(points[6].x, points[6].y); this.context1.lineTo(points[7].x, points[7].y); this.context1.lineTo(points[4].x, points[4].y); this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawFrenchWindow = function drawFrenchWindow (geometry) { var points2d = geometry.points2d; if (!points2d) { points2d = this.setPoints2d(geometry.geoType, geometry.startPoint, geometry.endPoint, geometry.openSide); } var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.moveTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.moveTo(points[4].x, points[4].y); this.context1.lineTo(points[5].x, points[5].y); this.context1.moveTo(points[2].x, points[2].y); this.context1.lineTo(points[4].x, points[4].y); this.context1.moveTo(points[3].x, points[3].y); this.context1.lineTo(points[5].x, points[5].y); this.context1.moveTo(points[6].x, points[6].y); this.context1.lineTo(points[7].x, points[7].y); this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawEntranceDoor = function drawEntranceDoor (symbol) { this.context1.save(); var mid = { x: (symbol.startPoint.x + symbol.endPoint.x) / 2, y: (symbol.startPoint.y + symbol.endPoint.y) / 2, }; var line = mathUtil.createLine1(symbol.startPoint, symbol.endPoint); var vLine = mathUtil.getLineForPoint(line, mid); var lines = null; var position = null; var join1, join2; //方向相同的时候,指向symbol的中点 if (symbol.openSide != symbol.enter) { lines = mathUtil.getParallelLineForDistance(line, this.enter_mini_Img.height / 2 / this.resolution); } //不同的时候,离中点有一定距离 else { lines = mathUtil.getParallelLineForDistance(line, this.enter_mini_Img.height / 2 / this.resolution + mathUtil.getDistance(symbol.startPoint, symbol.endPoint)); } join1 = mathUtil.getIntersectionPoint(lines.line1, vLine); join2 = mathUtil.getIntersectionPoint(lines.line2, vLine); var angle = mathUtil.Angle( symbol.startPoint, { x: symbol.startPoint.x + 1, y: symbol.startPoint.y, }, symbol.endPoint ); if (mathUtil.isClockwise([symbol.startPoint, symbol.endPoint, join2])) { //LEFT if (symbol.openSide == 'LEFT') { if (symbol.enter == 'default') { position = join1; } else { position = join2; } } else { if (symbol.enter == 'default') { position = join2; } else { position = join1; } } } else if (mathUtil.isClockwise([symbol.startPoint, symbol.endPoint, join1])) { //LEFT if (symbol.openSide == 'LEFT') { if (symbol.enter == 'default') { position = join2; } else { position = join1; } } else { if (symbol.enter == 'default') { position = join1; } else { position = join2; } } } if (!mathUtil.isClockwise([symbol.startPoint, symbol.endPoint, position])) { angle = Math.PI + angle; } mid = this.getScreenXY(mid); position = this.getScreenXY(position); this.context1.translate(position.x, position.y); if (symbol.startPoint.y <= symbol.endPoint.y) { this.context1.rotate(-angle); } else { this.context1.rotate(angle); } this.context1.drawImage(this.enter_mini_Img, -this.enter_mini_Img.width / 2, -this.enter_mini_Img.height / 2); this.context1.restore(); }; MinMap.prototype.drawPass = function drawPass (geometry) { var points2d = geometry.points2d; var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Symbol.lineWidth; this.context1.strokeStyle = Style.Symbol.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.closePath(); this.context1.stroke(); this.context1.beginPath(); this.context1.moveTo(points[4].x, points[4].y); this.context1.lineTo(points[5].x, points[5].y); this.context1.setLineDash([3, 2, 2]); this.context1.stroke(); this.context1.beginPath(); this.context1.moveTo(points[6].x, points[6].y); this.context1.lineTo(points[7].x, points[7].y); this.context1.setLineDash([3, 2, 2]); this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawBeam = function drawBeam (geometry) { var points2d = geometry.points2d; var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Component.lineWidth; this.context1.strokeStyle = Style.Component.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.closePath(); this.context1.stroke(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.moveTo(points[1].x, points[1].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawFlue = function drawFlue (geometry) { var points2d = geometry.points2d; var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Component.lineWidth; this.context1.strokeStyle = Style.Component.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.closePath(); this.context1.beginPath(); this.context1.moveTo(points[4].x, points[4].y); this.context1.lineTo(points[5].x, points[5].y); this.context1.lineTo(points[6].x, points[6].y); this.context1.lineTo(points[7].x, points[7].y); this.context1.closePath(); this.context1.moveTo(points[4].x, points[4].y); this.context1.lineTo(points[8].x, points[8].y); this.context1.lineTo(points[6].x, points[6].y); this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawCorridor = function drawCorridor (geometry) { var points2d = geometry.points2d; var points = []; for (var i = 0; i < points2d.length; ++i) { points[i] = this.getScreenXY({ x: points2d[i].x, y: points2d[i].y }); } this.context1.save(); this.context1.lineWidth = Style.Component.lineWidth; this.context1.strokeStyle = Style.Component.strokeStyle; this.context1.beginPath(); this.context1.moveTo(points[0].x, points[0].y); this.context1.lineTo(points[1].x, points[1].y); this.context1.lineTo(points[2].x, points[2].y); this.context1.lineTo(points[3].x, points[3].y); this.context1.closePath(); this.context1.stroke(); for (var i$1 = 4; i$1 < points.length - 1; i$1 += 2) { this.context1.moveTo(points[i$1].x, points[i$1].y); this.context1.lineTo(points[i$1 + 1].x, points[i$1 + 1].y); } this.context1.stroke(); this.context1.restore(); }; MinMap.prototype.drawPanos = function drawPanos (floorNum) { if (!this.player) { this.player = this.app.core.get('Player'); } var panos = this.player.model.panos.list; for (var i = 0; i < panos.length; ++i) { var pano = panos[i]; if (pano.floorIndex != floorNum) { continue } var position = this.getVectorForRotate({ x: pano.position.x, y: -1 * pano.position.z }, this.angle); this.drawCircle2(position); this.drawText(position, pano.id); } }; // 文字 MinMap.prototype.drawText = function drawText (position, txt, screenCoord, angle) { this.context1.save(); this.context1.font = '12px Microsoft YaHei'; var pt = { x: position.x, y: position.y }; if (!screenCoord) { pt = this.getScreenXY({ x: position.x, y: position.y }); } if (angle) { this.context1.translate(pt.x, pt.y); this.context1.rotate(angle); this.context1.fillText(txt, 0, 0); } else { this.context1.fillText(txt, pt.x, pt.y); } this.context1.restore(); }; MinMap.prototype.getVectorForRotate = function getVectorForRotate (point) { var angle = -1 * this.angle; if (Math.abs(angle) < 0.01 || Math.abs(angle - 2 * Math.PI) < 0.01) { return point } else { var defaultCenter = new THREE.Vector2(this.player.model.center.x, -1 * this.player.model.center.z); // let defaultCenter = { // x: (this.cad_bounding.left + this.cad_bounding.right) / 2, // y: (this.cad_bounding.top + this.cad_bounding.down) / 2, // } var x = (point.x - defaultCenter.x) * Math.cos(angle) - (point.y - defaultCenter.y) * Math.sin(angle) + defaultCenter.x; var y = (point.y - defaultCenter.y) * Math.cos(angle) + (point.x - defaultCenter.x) * Math.sin(angle) + defaultCenter.y; point.x = x; point.y = y; return point } }; //图形的范围 MinMap.prototype.Bounds = function Bounds (x1, y1, x2, y2) { var bounds = {}; bounds.leftBottom = { x: x1, y: y1 }; bounds.rigthTop = { x: x2, y: y2 }; bounds.leftTop = { x: x1, y: y2 }; bounds.rightBottom = { x: x2, y: y1 }; bounds.left = x1; bounds.right = x2; bounds.down = y1; bounds.top = y2; return bounds }; MinMap.prototype.clearCanvas = function clearCanvas (mode) { if (mode == 1) { this.context1.clearRect(0, 0, this.canvas1.width, this.canvas1.height); } else { this.context2.clearRect(0, 0, this.canvas2.width, this.canvas2.height); } }; /*****************************************************************左上角图片***************************************************************************/ //计算图片与canvas的映射,因为图片的像素一般大于canvas的长宽,图片的中心和canvas的中心重合 //三维场景的坐标系与canvas坐标系进行映射,三维场景对应的楼层的center与canvas的中心重合 MinMap.prototype.initMappingForImg = function initMappingForImg (cadImg_Width, cadImg_Height) { var scaleX = Math.abs((this.canvas_bounding.right - this.canvas_bounding.left) / cadImg_Width); var scaleY = Math.abs((this.canvas_bounding.down - this.canvas_bounding.top) / cadImg_Height); this.center = { x: 0, y: 0, }; this.imgRes = Math.min(scaleX, scaleY); var boundingBox = this.player.model.floors.index[0].boundingBox; var size = boundingBox.getSize(new THREE.Vector3()); scaleX = Math.abs((this.canvas_bounding.right - this.canvas_bounding.left) / Math.abs(size.x)); scaleY = Math.abs((this.canvas_bounding.down - this.canvas_bounding.top) / Math.abs(size.z)); this.resolution = Math.min(scaleX, scaleY); }; //transparentValue是0-1 MinMap.prototype.drawCadImg = function drawCadImg (img, angle, scale, transparentValue) { if (transparentValue < 0.3) { transparentValue = 0.3; } this.context1.save(); this.context1.globalAlpha = transparentValue; this.context1.translate(this.canvas1.width / 2, this.canvas1.height / 2); this.context1.rotate(angle); this.context1.scale(scale, scale); this.context1.translate(-img.width / 2, -img.height / 2); this.context1.drawImage(img, 0, 0); this.context1.restore(); }; /*****************************************************************************************************************************************************/ MinMap.prototype.setPoints2d = function setPoints2d (geoType, startPoint, endPoint, openSide) { var points2d = null; switch (geoType) { case VectorType.SingleDoor: points2d = this.setSingleDoorPoints2d(startPoint, endPoint, openSide); break case VectorType.DoubleDoor: points2d = this.setDoubleDoorPoints2d(startPoint, endPoint, openSide); break case VectorType.SlideDoor: points2d = this.setSlideDoorPoints2d(startPoint, endPoint, openSide); break case VectorType.SingleWindow: points2d = this.setSingleWindowPoints2d(startPoint, endPoint); break case VectorType.FrenchWindow: points2d = this.setFrenchWindowPoints2d(startPoint, endPoint); break case VectorType.BayWindow: points2d = this.setBayWindowPoints2d(startPoint, endPoint, openSide); break } return points2d }; MinMap.prototype.setBayWindowPoints2d = function setBayWindowPoints2d (startPoint, endPoint, openSide) { var thickness = 1; var line = mathUtil.createLine1(startPoint, endPoint); var len1 = mathUtil.getDistance(startPoint, endPoint) / 2; var len2 = 4 / this.resolution + len1; var midPoint = { x: (startPoint.x + endPoint.x) / 2, y: (startPoint.y + endPoint.y) / 2, }; var vertline = mathUtil.getVerticalLine(line, midPoint); var vStartLine1, vStartLine2, vEndLine1, vEndLine2; //垂直 var lines1 = mathUtil.getParallelLineForDistance(vertline, len1); var lines2 = mathUtil.getParallelLineForDistance(vertline, len2); var dis1 = mathUtil.getDisForPoinLine(startPoint, lines1.line1); var dis2 = mathUtil.getDisForPoinLine(startPoint, lines1.line2); if (dis1 > dis2) { vStartLine1 = lines1.line2; vStartLine2 = lines2.line2; vEndLine1 = lines1.line1; vEndLine2 = lines2.line1; } else { vStartLine1 = lines1.line1; vStartLine2 = lines2.line1; vEndLine1 = lines1.line2; vEndLine2 = lines2.line2; } //平行 var lines3 = mathUtil.getParallelLineForDistance(line, 2 / this.resolution); var lines4 = mathUtil.getParallelLineForDistance(line, thickness - 2 / this.resolution); var lines5 = mathUtil.getParallelLineForDistance(line, thickness); var pLine1 = lines3.line1; var pLine2 = lines3.line2; var pLine3 = lines4.line2; var pLine4 = lines5.line2; var pLine5 = lines3.line2; var pLine6 = lines3.line1; var pLine7 = lines4.line1; var pLine8 = lines5.line1; var point1 = mathUtil.getIntersectionPoint(vStartLine1, pLine1); var point2 = mathUtil.getIntersectionPoint(vEndLine1, pLine1); var point3 = mathUtil.getIntersectionPoint(vEndLine1, pLine3); var point4 = mathUtil.getIntersectionPoint(vStartLine1, pLine3); var point5 = mathUtil.getIntersectionPoint(vStartLine2, pLine2); var point6 = mathUtil.getIntersectionPoint(vEndLine2, pLine2); var point7 = mathUtil.getIntersectionPoint(vEndLine2, pLine4); var point8 = mathUtil.getIntersectionPoint(vStartLine2, pLine4); var point9 = mathUtil.getIntersectionPoint(vStartLine1, pLine5); var point10 = mathUtil.getIntersectionPoint(vEndLine1, pLine5); var point11 = mathUtil.getIntersectionPoint(vEndLine1, pLine7); var point12 = mathUtil.getIntersectionPoint(vStartLine1, pLine7); var point13 = mathUtil.getIntersectionPoint(vStartLine2, pLine6); var point14 = mathUtil.getIntersectionPoint(vEndLine2, pLine6); var point15 = mathUtil.getIntersectionPoint(vEndLine2, pLine8); var point16 = mathUtil.getIntersectionPoint(vStartLine2, pLine8); var points2d = []; points2d.push(point1); points2d.push(point2); points2d.push(point3); points2d.push(point4); if (openSide == 'LEFT') { //逆时针 if (mathUtil.isClockwise(points2d)) { points2d.push(point5); points2d.push(point6); points2d.push(point7); points2d.push(point8); } else { points2d = []; points2d.push(point9); points2d.push(point10); points2d.push(point11); points2d.push(point12); points2d.push(point13); points2d.push(point14); points2d.push(point15); points2d.push(point16); } } else if (openSide == 'RIGHT') { //逆时针 if (mathUtil.isClockwise(points2d)) { points2d = []; points2d.push(point9); points2d.push(point10); points2d.push(point11); points2d.push(point12); points2d.push(point13); points2d.push(point14); points2d.push(point15); points2d.push(point16); } else { points2d.push(point5); points2d.push(point6); points2d.push(point7); points2d.push(point8); } } return points2d }; MinMap.prototype.setDoubleDoorPoints2d = function setDoubleDoorPoints2d (startPoint, endPoint, openSide) { var line = mathUtil.createLine1(startPoint, endPoint); var len = mathUtil.getDistance(startPoint, endPoint); var lines = mathUtil.getParallelLineForDistance(line, len / 2); var vertline1 = mathUtil.getVerticalLine(line, startPoint); var vertline2 = mathUtil.getVerticalLine(line, endPoint); var midPoint = { x: (startPoint.x + endPoint.x) / 2, y: (startPoint.y + endPoint.y) / 2, }; var vertline = mathUtil.getVerticalLine(line, midPoint); var startJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline1); var startJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline1); var endJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline2); var endJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline2); var midJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline); var midJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline); var points2d = []; points2d.push(startPoint); points2d.push(midPoint); points2d.push(endPoint); points2d.push(endJoin1); points2d.push(midJoin1); points2d.push(startJoin1); //逆时针 if (openSide == 'LEFT') { if (mathUtil.isClockwise(points2d)) ; else { points2d = []; points2d.push(startPoint); points2d.push(midPoint); points2d.push(endPoint); points2d.push(endJoin2); points2d.push(midJoin2); points2d.push(startJoin2); } } else if (openSide == 'RIGHT') { if (mathUtil.isClockwise(points2d)) { points2d = []; points2d.push(startPoint); points2d.push(midPoint); points2d.push(endPoint); points2d.push(endJoin2); points2d.push(midJoin2); points2d.push(startJoin2); } } return points2d }; MinMap.prototype.setFrenchWindowPoints2d = function setFrenchWindowPoints2d (startPoint, endPoint) { var len = 4 / this.resolution; var line = mathUtil.createLine1(startPoint, endPoint); var lines = mathUtil.getParallelLineForDistance(line, len); var vertline1 = mathUtil.getVerticalLine(line, startPoint); var vertline2 = mathUtil.getVerticalLine(line, endPoint); var points2d = []; points2d.push(startPoint); points2d.push(endPoint); var midPoint = { x: (startPoint.x + endPoint.x) / 2, y: (startPoint.y + endPoint.y) / 2, }; var vertline = mathUtil.getVerticalLine(line, midPoint); var startJoin1 = mathUtil.getIntersectionPoint(vertline1, lines.line1); var endJoin1 = mathUtil.getIntersectionPoint(vertline2, lines.line1); points2d.push(startJoin1); points2d.push(endJoin1); var startJoin2 = mathUtil.getIntersectionPoint(vertline1, lines.line2); var endJoin2 = mathUtil.getIntersectionPoint(vertline2, lines.line2); points2d.push(startJoin2); points2d.push(endJoin2); var midJoin1 = mathUtil.getIntersectionPoint(vertline, lines.line1); var midJoin2 = mathUtil.getIntersectionPoint(vertline, lines.line2); points2d.push(midJoin1); points2d.push(midJoin2); return points2d }; MinMap.prototype.setSingleDoorPoints2d = function setSingleDoorPoints2d (startPoint, endPoint, openSide) { var line = mathUtil.createLine1(startPoint, endPoint); var len = mathUtil.getDistance(startPoint, endPoint); var lines = mathUtil.getParallelLineForDistance(line, len); var vertline1 = mathUtil.getVerticalLine(line, startPoint); var vertline2 = mathUtil.getVerticalLine(line, endPoint); var startJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline1); var startJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline1); var endJoin1 = mathUtil.getIntersectionPoint(lines.line1, vertline2); var endJoin2 = mathUtil.getIntersectionPoint(lines.line2, vertline2); var points2d = []; points2d.push(startPoint); points2d.push(endPoint); points2d.push(endJoin1); points2d.push(startJoin1); //逆时针 if (openSide == 'LEFT') { if (mathUtil.isClockwise(points2d)) ; else { points2d = []; points2d.push(startPoint); points2d.push(endPoint); points2d.push(endJoin2); points2d.push(startJoin2); } } else if (openSide == 'RIGHT') { if (mathUtil.isClockwise(points2d)) { points2d = []; points2d.push(startPoint); points2d.push(endPoint); points2d.push(endJoin2); points2d.push(startJoin2); } } return points2d }; MinMap.prototype.setSingleWindowPoints2d = function setSingleWindowPoints2d (startPoint, endPoint) { var points2d = []; points2d.push(startPoint); points2d.push(endPoint); var len = 4 / this.resolution; var line = mathUtil.createLine1(startPoint, endPoint); var lines = mathUtil.getParallelLineForDistance(line, len); var vertline1 = mathUtil.getVerticalLine(line, startPoint); var vertline2 = mathUtil.getVerticalLine(line, endPoint); var point1 = mathUtil.getIntersectionPoint(vertline1, lines.line1); var point2 = mathUtil.getIntersectionPoint(vertline2, lines.line1); var point3 = mathUtil.getIntersectionPoint(vertline2, lines.line2); var point4 = mathUtil.getIntersectionPoint(vertline1, lines.line2); points2d.push(point1); points2d.push(point2); points2d.push(point3); points2d.push(point4); return points2d }; MinMap.prototype.setSlideDoorPoints2d = function setSlideDoorPoints2d (startPoint, endPoint, openSide) { var line = mathUtil.createLine1(startPoint, endPoint); var len = 2 / this.resolution; var lines1 = mathUtil.getParallelLineForDistance(line, len); if (startPoint.x > endPoint.x) { var temp = lines1.line1; lines1.line1 = lines1.line2; lines1.line2 = temp; } var vertline1 = mathUtil.getVerticalLine(line, startPoint); var vertline2 = mathUtil.getVerticalLine(line, endPoint); var line1 = lines1.line1; var line2 = lines1.line2; var startJoin = mathUtil.getIntersectionPoint(lines1.line1, vertline1); var endJoin = mathUtil.getIntersectionPoint(lines1.line2, vertline2); var points2d = []; points2d.push(startPoint); points2d.push(endPoint); points2d.push(startJoin); if (mathUtil.isClockwise(points2d)) { if (openSide == null || openSide == 'LEFT') ; else { line1 = lines1.line2; line2 = lines1.line1; startJoin = mathUtil.getIntersectionPoint(line1, vertline1); endJoin = mathUtil.getIntersectionPoint(line2, vertline2); } } else { if (openSide == null || openSide == 'LEFT') { line1 = lines1.line2; line2 = lines1.line1; startJoin = mathUtil.getIntersectionPoint(line1, vertline1); endJoin = mathUtil.getIntersectionPoint(line2, vertline2); } } var midPoint = { x: (startPoint.x + endPoint.x) / 2, y: (startPoint.y + endPoint.y) / 2, }; points2d = []; points2d.push(startPoint); var width = 4 / this.resolution; var vertline = mathUtil.getVerticalLine(line, midPoint); var lines2 = mathUtil.getParallelLineForDistance(vertline, width); var join1 = mathUtil.getIntersectionPoint(line1, lines2.line1); var join2 = mathUtil.getIntersectionPoint(line1, lines2.line2); var join3 = mathUtil.getIntersectionPoint(line2, lines2.line1); var join4 = mathUtil.getIntersectionPoint(line2, lines2.line2); var join5 = mathUtil.getIntersectionPoint(line, lines2.line1); var join6 = mathUtil.getIntersectionPoint(line, lines2.line2); if (mathUtil.getDistance(startPoint, join5) < mathUtil.getDistance(startPoint, join6)) { points2d.push(join6); points2d.push(join2); points2d.push(startJoin); points2d.push(endPoint); points2d.push(join5); points2d.push(join3); points2d.push(endJoin); } else { points2d.push(join5); points2d.push(join1); points2d.push(startJoin); points2d.push(endPoint); points2d.push(join6); points2d.push(join4); points2d.push(endJoin); } return points2d }; MinMap.prototype.setSlideDoorPoints2d = function setSlideDoorPoints2d (startPoint, endPoint, openSide) { var line = mathUtil.createLine1(startPoint, endPoint); var len = 2 / this.resolution; var lines1 = mathUtil.getParallelLineForDistance(line, len); if (startPoint.x > endPoint.x) { var temp = lines1.line1; lines1.line1 = lines1.line2; lines1.line2 = temp; } var vertline1 = mathUtil.getVerticalLine(line, startPoint); var vertline2 = mathUtil.getVerticalLine(line, endPoint); var line1 = lines1.line1; var line2 = lines1.line2; var startJoin = mathUtil.getIntersectionPoint(lines1.line1, vertline1); var endJoin = mathUtil.getIntersectionPoint(lines1.line2, vertline2); var points2d = []; points2d.push(startPoint); points2d.push(endPoint); points2d.push(startJoin); if (mathUtil.isClockwise(points2d)) { if (openSide == null || openSide == 'LEFT') ; else { line1 = lines1.line2; line2 = lines1.line1; startJoin = mathUtil.getIntersectionPoint(line1, vertline1); endJoin = mathUtil.getIntersectionPoint(line2, vertline2); } } else { if (openSide == null || openSide == 'LEFT') { line1 = lines1.line2; line2 = lines1.line1; startJoin = mathUtil.getIntersectionPoint(line1, vertline1); endJoin = mathUtil.getIntersectionPoint(line2, vertline2); } } var midPoint = { x: (startPoint.x + endPoint.x) / 2, y: (startPoint.y + endPoint.y) / 2, }; points2d = []; points2d.push(startPoint); var width = 4 / this.resolution; var vertline = mathUtil.getVerticalLine(line, midPoint); var lines2 = mathUtil.getParallelLineForDistance(vertline, width); var join1 = mathUtil.getIntersectionPoint(line1, lines2.line1); var join2 = mathUtil.getIntersectionPoint(line1, lines2.line2); var join3 = mathUtil.getIntersectionPoint(line2, lines2.line1); var join4 = mathUtil.getIntersectionPoint(line2, lines2.line2); var join5 = mathUtil.getIntersectionPoint(line, lines2.line1); var join6 = mathUtil.getIntersectionPoint(line, lines2.line2); if (mathUtil.getDistance(startPoint, join5) < mathUtil.getDistance(startPoint, join6)) { points2d.push(join6); points2d.push(join2); points2d.push(startJoin); points2d.push(endPoint); points2d.push(join5); points2d.push(join3); points2d.push(endJoin); } else { points2d.push(join5); points2d.push(join1); points2d.push(startJoin); points2d.push(endPoint); points2d.push(join6); points2d.push(join4); points2d.push(endJoin); } return points2d }; function Plugin(app, config) { if ( config === void 0 ) config = {}; var deferred = KanKan.Deferred(); var scope = null; if (config.el) { scope = config.el === 'string' ? document.querySelector(config.el) : config.el; } var started = function () { var plugin = new MinMap(app, scope || app.dom, config); plugin.$scope = scope; plugin.$html = html; plugin.$name = 'MinMap'; plugin.$load = function () { PetiteVue.createApp({ show: false, create: function create() { plugin.$xui = this; plugin.init(); if (!app.store.getValue('metadata').controls.showMap) { plugin.hide(); } app.MinMap.install(plugin); }, }).mount((scope || app.dom).querySelector('[xui_min_map]')); }; deferred.resolve(plugin); }; if (app.Scene.loaded) { started(); } else { app.Scene.on('loaded', started); } return deferred } return Plugin; }()); //# sourceMappingURL=MinMap.js.map