|
@@ -94,10 +94,13 @@ export class SGraphItem extends SObject {
|
|
|
|
|
|
/** 缩放比例 */
|
|
|
scale: number = 1;
|
|
|
+ /** */
|
|
|
+ private _inverseScale: number = 1;
|
|
|
+ /** 旋转角度 */
|
|
|
rolate: number = 0;
|
|
|
|
|
|
/** 是否可见 */
|
|
|
- _visible: boolean = true;
|
|
|
+ private _visible: boolean = true;
|
|
|
get visible(): boolean {
|
|
|
return this._visible;
|
|
|
} // Get visible
|
|
@@ -178,10 +181,12 @@ export class SGraphItem extends SObject {
|
|
|
// 如果不进行变形处理,则取消painter的变型操作
|
|
|
if (!item.isTransform) {
|
|
|
let matrix = painter.worldTransform;
|
|
|
- let x0 = matrix.e;
|
|
|
- let y0 = matrix.f;
|
|
|
- painter.resetTransform();
|
|
|
- painter.translate(x0, y0);
|
|
|
+ // let x0 = matrix.e;
|
|
|
+ // let y0 = matrix.f;
|
|
|
+ // painter.resetTransform();
|
|
|
+ // painter.translate(x0, y0);
|
|
|
+ item._inverseScale = 1 / matrix.a;
|
|
|
+ painter.scale(item._inverseScale, item._inverseScale);
|
|
|
}
|
|
|
// 设置绘制区域
|
|
|
// canvas.clip(item.boundingRect())
|
|
@@ -283,13 +288,7 @@ export class SGraphItem extends SObject {
|
|
|
* @return 在item中的坐标
|
|
|
*/
|
|
|
mapFromScene(x: number, y: number): SPoint {
|
|
|
- const m = new DOMMatrix();
|
|
|
- let list = this.itemPath();
|
|
|
- for (let item of list) {
|
|
|
- m.translateSelf(item.x, item.y);
|
|
|
- m.scaleSelf(item.scale, item.scale);
|
|
|
- m.rotateSelf(item.rolate);
|
|
|
- }
|
|
|
+ const m = this.scene2itemMattrix();
|
|
|
|
|
|
const mp = new DOMPoint(x, y).matrixTransform(m.inverse());
|
|
|
return new SPoint(mp.x, mp.y);
|
|
@@ -308,17 +307,44 @@ export class SGraphItem extends SObject {
|
|
|
return new SPoint(x, y);
|
|
|
}
|
|
|
|
|
|
- const m = new DOMMatrix();
|
|
|
+ const m = this.scene2itemMattrix();
|
|
|
+
|
|
|
+ const mp = new DOMPoint(x, y).matrixTransform(m);
|
|
|
+ return new SPoint(mp.x, mp.y);
|
|
|
+ } // Function mapToScene()
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 场景对象到item对象的转换矩阵
|
|
|
+ *
|
|
|
+ * @return 转换矩阵
|
|
|
+ */
|
|
|
+ scene2itemMattrix(): DOMMatrix {
|
|
|
+ let m = new DOMMatrix();
|
|
|
let list = this.itemPath();
|
|
|
for (let item of list) {
|
|
|
m.translateSelf(item.x, item.y);
|
|
|
m.scaleSelf(item.scale, item.scale);
|
|
|
m.rotateSelf(item.rolate);
|
|
|
+
|
|
|
+ // 如果不进行变形处理,则取消painter的变型操作
|
|
|
+ if (!item.isTransform) {
|
|
|
+ // const vm = new DOMMatrix();
|
|
|
+ // // vm.translateSelf(
|
|
|
+ // // this.scene?.view?.origin.x,
|
|
|
+ // // this.scene?.view?.origin.x
|
|
|
+ // // );
|
|
|
+ // vm.scaleSelf(this.scene?.view?.scale, this.scene?.view?.scale);
|
|
|
+ // vm.multiplySelf(m);
|
|
|
+ // let x0 = vm.e;
|
|
|
+ // let y0 = vm.f;
|
|
|
+ // m = new DOMMatrix();
|
|
|
+ // m.translate(x0, y0);
|
|
|
+ m.scaleSelf(item._inverseScale, item._inverseScale);
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- const mp = new DOMPoint(x, y).matrixTransform(m);
|
|
|
- return new SPoint(mp.x, mp.y);
|
|
|
- } // Function mapToScene()
|
|
|
+ return m;
|
|
|
+ }
|
|
|
|
|
|
// =================================================================================================================
|
|
|
// 事件
|
|
@@ -590,10 +616,11 @@ export class SGraphItem extends SObject {
|
|
|
ce.matrix.rotateSelf(0, 0, child.rolate);
|
|
|
|
|
|
if (!child.isTransform) {
|
|
|
- let x0 = ce.matrix.e;
|
|
|
- let y0 = ce.matrix.f;
|
|
|
- ce.matrix = new DOMMatrix();
|
|
|
- ce.matrix.translateSelf(x0, y0);
|
|
|
+ // let x0 = ce.matrix.e;
|
|
|
+ // let y0 = ce.matrix.f;
|
|
|
+ // ce.matrix = new DOMMatrix();
|
|
|
+ // ce.matrix.translateSelf(x0, y0);
|
|
|
+ ce.matrix.scaleSelf(child._inverseScale, child._inverseScale);
|
|
|
}
|
|
|
|
|
|
const mp = new DOMPoint(event.offsetX, event.offsetY).matrixTransform(
|
|
@@ -637,6 +664,9 @@ export class SGraphItem extends SObject {
|
|
|
const m = new DOMMatrix();
|
|
|
m.scaleSelf(this.scale, this.scale);
|
|
|
m.rotateSelf(this.rolate);
|
|
|
+ if (!this.isTransform) {
|
|
|
+ m.rotateSelf(this._inverseScale, this._inverseScale);
|
|
|
+ }
|
|
|
|
|
|
const mp = new DOMPoint(x, y).matrixTransform(m);
|
|
|
return new SPoint(mp.x, mp.y);
|