rt-sim-training-client/src/jmap/transformHandle.js

92 lines
2.0 KiB
JavaScript
Raw Normal View History

2019-07-19 15:17:58 +08:00
// import Group from 'zrender/src/container/Group';
2019-07-05 00:40:53 +08:00
import * as matrix from 'zrender/src/core/matrix';
2019-07-19 15:15:51 +08:00
function createTransform(opts) {
2019-07-11 17:58:58 +08:00
let transform = matrix.create();
2019-07-19 15:15:51 +08:00
transform = matrix.scale(matrix.create(), transform, [opts.scaleRate, opts.scaleRate]);
transform = matrix.translate(matrix.create(), transform, [-opts.offsetX, -opts.offsetY]);
2019-07-11 17:58:58 +08:00
return transform;
2019-07-05 00:40:53 +08:00
}
2019-07-09 09:24:54 +08:00
function createBoundingRect(view) {
2019-07-11 17:58:58 +08:00
const rect = view.getBoundingRect();
const scale = view.scale[0];
const offsetX = view.position[0];
const offsetY = view.position[1];
rect.x = rect.x * scale + offsetX;
rect.y = rect.y * scale + offsetY;
2019-07-21 18:59:42 +08:00
rect.width = rect.width * scale;
rect.height = rect.height * scale;
2019-07-11 17:58:58 +08:00
return rect;
2019-07-07 22:56:09 +08:00
}
2019-07-18 17:21:18 +08:00
class TransformHandle {
2019-07-19 18:05:43 +08:00
constructor(painter) {
2019-07-11 17:58:58 +08:00
this.$painter = painter;
2019-07-05 00:40:53 +08:00
2019-07-21 18:59:42 +08:00
this.parentLevel = painter.getParentLevel();
2019-07-19 15:17:58 +08:00
2019-07-19 18:32:19 +08:00
this.rect = { x: 0, y: 0, width: 0, height: 0 };
2019-07-19 13:54:23 +08:00
this.transform = createTransform({ scaleRate: 1, offsetX: 0, offsetY: 0 });
2019-07-11 17:58:58 +08:00
}
2019-07-09 09:24:54 +08:00
2019-07-11 17:58:58 +08:00
checkVisible(view) {
return createBoundingRect(view).intersect(this.rect);
}
2019-07-05 00:40:53 +08:00
2019-07-11 17:58:58 +08:00
revisibleView(view) {
if (this.checkVisible(view)) {
view.show();
} else {
view.hide();
}
2019-07-19 13:54:23 +08:00
2019-07-11 17:58:58 +08:00
view.dirty();
}
2019-07-09 09:24:54 +08:00
2019-07-11 17:58:58 +08:00
// 视图进行缩放/平移
transformView(view) {
if (view) {
view.transform = this.transform;
view.decomposeTransform();
this.revisibleView(view);
}
2019-07-05 00:40:53 +08:00
2019-07-11 17:58:58 +08:00
return view;
}
2019-07-09 09:24:54 +08:00
2019-07-11 17:58:58 +08:00
// 处理所有视图缩放/平移
transformAll() {
2019-07-21 20:20:41 +08:00
this.traverse(this.transformView, this);
2019-07-11 17:58:58 +08:00
}
2019-07-05 00:40:53 +08:00
2019-07-11 17:58:58 +08:00
// 重新计算显示图形
revisibleAll() {
2019-07-21 20:20:41 +08:00
this.traverse(this.revisibleView, this);
2019-07-11 17:58:58 +08:00
}
2019-07-09 09:24:54 +08:00
2019-07-11 17:58:58 +08:00
// 更新偏移量
2019-07-19 13:54:23 +08:00
updateTransform(opts) {
this.transform = createTransform(opts);
2019-07-19 11:11:34 +08:00
this.transformAll();
}
// 更新画布尺寸
2019-07-19 13:54:23 +08:00
updateZrSize(opts) {
this.rect = { x: 0, y: 0, width: opts.width, height: opts.height };
this.revisibleAll();
2019-07-11 17:58:58 +08:00
}
2019-07-21 20:20:41 +08:00
// 遍历group执行回调
traverse(cb, context) {
this.parentLevel.eachChild(level => {
level.eachChild((view) => {
cb.call(context, view);
}, context);
}, context);
}
2019-07-05 00:40:53 +08:00
}
2019-07-18 17:21:18 +08:00
export default TransformHandle;