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