joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' of https://git.qcloud.com/joylink/jl-nclient

Browse Source 
# Conflicts:
#	src/jmap/transformController.js
#	src/views/jmap/index.vue
This commit is contained in:
ival 2019-07-08 09:40:07 +08:00
commit 2796ef8342
2 changed files with 54 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

98
src/jmap/transformController.js
View File

@ -1,90 +1,78 @@
import * as matrix from 'zrender/src/core/matrix';
function getTransform(zoom) {
function createTransform(zoom) {
let transform = matrix.create();
transform = matrix.scale(matrix.create(), transform, [zoom.scale, zoom.scale]);
transform = matrix.translate(matrix.create(), transform, [zoom.offsetX, zoom.offsetY]);
return transform;
}
function createBoundingRect(view) {
let rect = view.getBoundingRect();
let scale = view.scale[0];
let offsetX = view.position[0];
let offsetY = view.position[1];
rect.width = rect.width * scale;
rect.height = rect.height * scale;
rect.x = rect.x * scale + offsetX;
rect.y = rect.y * scale + offsetY;
return rect;
}
class transformController {
constructor(painter) {
this.$painter = painter;
this.$zr = painter.$zr;
this.parentLevel = painter.parentLevel;
this.zoom = { scale: 1, offsetX: 0, offsetY: 0 };
this.rect = { x: 0, y: 0, width: this.$zr.getWidth(), height: this.$zr.getHeight() };
this.transform = getTransform(this.zoom);
}
this.rect = {x:0, y:0, width: this.$zr.getWidth(), height: this.$zr.getHeight()};
this.transform = createTransform({scale: 1, offsetX: 0, offsetY: 0});
}
checkVisible(view) {
let rect = this.getBoundingRect();
let viewRect = this.getViewBoundingRect(view);
return viewRect.intersect(rect);
return createBoundingRect(view).intersect(this.rect);
}
revisibleView(view) {
if (this.checkVisible(view)) {
view.show();
} else {
view.hide();
if (this.checkVisible(view)) {
view.show();
} else {
view.hide();
}
// view.dirty();
view.dirty();
}
transformView(view) {
if (view) {
view.transform = this.getTransform();
view.decomposeTransform();
this.revisibleView(view);
if (view) {
view.transform = this.transform;
view.decomposeTransform();
this.revisibleView(view);
}
return view;
}
}
transformAll() {
this.parentLevel.eachChild((level) => {
level.eachChild((view) => {
this.transformView(view);
});
});
transformAll () {
this.parentLevel.eachChild((level) => {
level.eachChild((view) => {
this.transformView(view);
});
});
}
revisibleAll() {
this.parentLevel.eachChild((level) => {
level.eachChild((view) => {
this.revisibleView(view);
});
});
level.eachChild((view) => {
this.revisibleView(view);
});
});
}
updateTransform(zoom) {
this.transform = getTransform(zoom);
this.transform = createTransform(zoom);
this.transformAll();
}
getTransform() {
return this.transform;
}
getBoundingRect() {
return this.rect;
}
getViewBoundingRect(view) {
let rect = view.getBoundingRect();
let scale = view.scale[0];
let offsetX = view.position[0];
let offsetY = view.position[1];
rect.width = rect.width * scale;
rect.height = rect.height * scale;
rect.x = rect.x * scale + offsetX;
rect.y = rect.y * scale + offsetY;
return rect;
}
}
export default transformController;

24
src/views/jmap/index.vue
View File

@ -14,26 +14,24 @@
jmaps: null
};
},
created() {
this.jmaps = new Jmaps();
},
mounted() {
this.jmaps = new Jmaps();
this.jmap = this.jmaps.init({
id: this.id,
config: {
renderer: 'canvas',
renderer: 'svg',
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight
}
});
let list = [
{ code: '1', beg: { x: 20, y: 50 }, end: { x: 120, y: 50 } }
{ code: '1', beg: { x: 20 , y: 50}, end: { x: 120, y: 50 } }
];
for (var i = 1; i < 10; i++) {
for (var j = 1; j < 5000; j++) {
list.push({ code: `_00${i}${j}`, beg: { x: i * 120 + 50, y: j * 20 + 50 }, end: { x: i * 120 + 150, y: j * 20 + 50 } });
for (var i = 1; i < 2; i++) {
for (var j = 1; j < 70000; j++) {
list.push({ code: `${i}${j}`, beg: { x: i * 120 + 50, y: j * 20 + 50}, end: { x: i * 120 + 150, y: j * 20 + 50 } });
}
}
@ -44,15 +42,15 @@
);
// this.jmap.render([
// {code: '2', type: 'Link', beg: { x: 20 , y: 100}, end: { x: 120, y: 100 }}
// {code: '11', type: 'Link', beg: { x: 20 , y: 100}, end: { x: 120, y: 100 }}
// ]);
// this.jmap.update([
// {code: '2', type: 'Link', status: '02'}
// ]);
this.jmap.update([
{code: '11', type: 'Link', status: '02'}
]);
// this.jmap.render([
// {code: '2', type: 'Link', beg: { x: 0 , y: 0}, end: { x: 200, y: 200 }}
// {code: '11', type: 'Link', beg: { x: 0 , y: 0}, end: { x: 200, y: 200 }}
// ]);
console.log(this.jmap.mapDevice, this.jmap.proxyData, this.jmap.data);