@visactor/vtable-plugins 1.18.2-alpha.2 → 1.18.2-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/cjs/rotate-table.js
CHANGED
|
@@ -44,6 +44,7 @@ class RotateTablePlugin {
|
|
|
44
44
|
}
|
|
45
45
|
|
|
46
46
|
function rotate90WithTransform(rotateDom) {
|
|
47
|
+
this.rotateDegree = 90;
|
|
47
48
|
const rotateCenter = Math.min(rotateDom.clientWidth, rotateDom.clientHeight) / 2, domRect = this.getElement().getBoundingClientRect(), x1 = domRect.left, y1 = domRect.top, x2 = domRect.right, y2 = domRect.bottom;
|
|
48
49
|
rotateDom.style.transform = "rotate(90deg)", rotateDom.style.transformOrigin = `${rotateCenter}px ${rotateCenter}px`;
|
|
49
50
|
const getRect = () => ({
|
|
@@ -64,7 +65,7 @@ function rotate90WithTransform(rotateDom) {
|
|
|
64
65
|
}
|
|
65
66
|
|
|
66
67
|
function cancelTransform(rotateDom) {
|
|
67
|
-
rotateDom.style.transform = "none", rotateDom.style.transformOrigin = "none";
|
|
68
|
+
this.rotateDegree = 0, rotateDom.style.transform = "none", rotateDom.style.transformOrigin = "none";
|
|
68
69
|
const domRect = this.getElement().getBoundingClientRect(), x1 = domRect.left, y1 = domRect.top, x2 = domRect.right, y2 = domRect.bottom, getRect = () => ({
|
|
69
70
|
x1: x1,
|
|
70
71
|
y1: y1,
|
package/cjs/rotate-table.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["rotate-table.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"sources":["rotate-table.ts"],"names":[],"mappings":"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","file":"rotate-table.js","sourcesContent":["import {\n matrixAllocate,\n transformPointForCanvas,\n mapToCanvasPointForCanvas,\n registerGlobalEventTransformer,\n registerWindowEventTransformer,\n vglobal\n} from '@visactor/vtable/es/vrender';\nimport type { BaseTable } from '@visactor/vtable/src/core/BaseTable';\nimport * as VTable from '@visactor/vtable';\nimport type { TableEvents } from '@visactor/vtable/src/core/TABLE_EVENT_TYPE';\nimport type { EventArg } from './types';\n// export type IRotateTablePluginOptions = {\n// // 旋转角度\n// rotate?: number;\n// };\n/**\n * 旋转表格插件。\n * 业务层旋转功能没有使用收系统接口的话，用的transform:'rotate(90deg)'的设置来达到旋转的目的。vtable及vrender都没有进行坐标处理，这样就会导致交互错乱。\n * 所以需要进行坐标转换，将旋转后的坐标转换后作为VRender及VTable逻辑中用到的坐标。\n * 这里使用transform:'rotate(90deg)'的设置来达到旋转的目的。 其他角度应该也是可以实现的，请自行扩展这个插件并兼容\n */\nexport class RotateTablePlugin implements VTable.plugins.IVTablePlugin {\n id = 'rotate-table';\n runTime = [VTable.TABLE_EVENT_TYPE.INITIALIZED];\n table: VTable.ListTable;\n vglobal_mapToCanvasPoint: any; // 保存vrender中vglobal的mapToCanvasPoint原方法\n // pluginOptions: IRotateTablePluginOptions;\n constructor() {\n // this.pluginOptions = pluginOptions;\n }\n run(...args: [EventArg, TableEvents[keyof TableEvents] | TableEvents[keyof TableEvents][], VTable.BaseTableAPI]) {\n const table: VTable.BaseTableAPI = args[2];\n this.table = table as VTable.ListTable;\n //将函数rotate90WithTransform绑定到table实例上\n this.table.rotate90WithTransform = rotate90WithTransform.bind(this.table);\n this.table.cancelTransform = cancelTransform.bind(this.table);\n }\n\n release() {\n // 移除绑定的事件\n }\n}\n\n/**\n * 业务层旋转功能没有使用收系统接口的话，用的transform:'rotate(90deg)'的设置来达到旋转的目的。vtable及vrender都没有进行坐标处理，这样就会导致交互错乱。\n * 所以需要进行坐标转换，将旋转后的坐标转换后作为VRender及VTable逻辑中用到的坐标。\n */\nexport function rotate90WithTransform(this: BaseTable, rotateDom: HTMLElement) {\n this.rotateDegree = 90;\n const rotateCenter = Math.min(rotateDom.clientWidth, rotateDom.clientHeight) / 2;\n const domRect = this.getElement().getBoundingClientRect();\n const x1 = domRect.left;\n const y1 = domRect.top;\n const x2 = domRect.right;\n const y2 = domRect.bottom;\n\n rotateDom.style.transform = 'rotate(90deg)';\n rotateDom.style.transformOrigin = `${rotateCenter}px ${rotateCenter}px`;\n const getRect = () => {\n return {\n x1,\n y1,\n x2,\n y2\n };\n };\n const getMatrix = () => {\n const containerRect = rotateDom.getBoundingClientRect(); //TODO 这个地方应该获取窗口的宽高 最好能从vglobal上直接获取\n const domRect = this.getElement().getBoundingClientRect();\n const x1 = domRect.top;\n const y1 = containerRect.width - domRect.right;\n\n const matrix = matrixAllocate.allocate(1, 0, 0, 1, 0, 0);\n matrix.translate(x1, y1);\n const centerX = rotateCenter - x1;\n const centerY = rotateCenter - y1;\n matrix.translate(centerX, centerY);\n matrix.rotate(Math.PI / 2);\n matrix.translate(-centerX, -centerY);\n return matrix;\n };\n registerGlobalEventTransformer(vglobal, this.getElement(), getMatrix, getRect, transformPointForCanvas);\n registerWindowEventTransformer(\n this.scenegraph.stage.window,\n this.getElement(),\n getMatrix,\n getRect,\n transformPointForCanvas\n );\n this.vglobal_mapToCanvasPoint = vglobal.mapToCanvasPoint;\n vglobal.mapToCanvasPoint = mapToCanvasPointForCanvas;\n //transformPointForCanvas和mapToCanvasPointForCanvas时相对应的\n //具体逻辑在 VRender/packages/vrender-core/src/common/event-transformer.ts中\n // 可以自定义这两个函数 来修改事件属性，transformPointForCanvas中将坐标转换后存放了_canvasX _canvasY，mapToCanvasPointForCanvas中加以利用\n // 在VTable的touch文件中，利用到了_canvasX _canvasY 所以如果自定义上面两个函数也需提供_canvasX _canvasY\n}\nexport function cancelTransform(this: BaseTable, rotateDom: HTMLElement) {\n this.rotateDegree = 0;\n rotateDom.style.transform = 'none';\n rotateDom.style.transformOrigin = 'none';\n const domRect = this.getElement().getBoundingClientRect();\n const x1 = domRect.left;\n const y1 = domRect.top;\n const x2 = domRect.right;\n const y2 = domRect.bottom;\n\n const getRect = () => {\n return {\n x1,\n y1,\n x2,\n y2\n };\n };\n const getMatrix = () => {\n const matrix = matrixAllocate.allocate(1, 0, 0, 1, 0, 0);\n matrix.translate(x1, y1);\n return matrix;\n };\n registerGlobalEventTransformer(vglobal, this.getElement(), getMatrix, getRect, transformPointForCanvas);\n registerWindowEventTransformer(\n this.scenegraph.stage.window,\n this.getElement(),\n getMatrix,\n getRect,\n transformPointForCanvas\n );\n vglobal.mapToCanvasPoint = this.vglobal_mapToCanvasPoint;\n}\n"]}
|
package/dist/vtable-plugins.js
CHANGED
|
@@ -13041,6 +13041,7 @@
|
|
|
13041
13041
|
}
|
|
13042
13042
|
}
|
|
13043
13043
|
function rotate90WithTransform(rotateDom) {
|
|
13044
|
+
this.rotateDegree = 90;
|
|
13044
13045
|
const rotateCenter = Math.min(rotateDom.clientWidth, rotateDom.clientHeight) / 2;
|
|
13045
13046
|
const domRect = this.getElement().getBoundingClientRect();
|
|
13046
13047
|
const x1 = domRect.left;
|
|
@@ -13077,6 +13078,7 @@
|
|
|
13077
13078
|
vglobal.mapToCanvasPoint = mapToCanvasPointForCanvas;
|
|
13078
13079
|
}
|
|
13079
13080
|
function cancelTransform(rotateDom) {
|
|
13081
|
+
this.rotateDegree = 0;
|
|
13080
13082
|
rotateDom.style.transform = 'none';
|
|
13081
13083
|
rotateDom.style.transformOrigin = 'none';
|
|
13082
13084
|
const domRect = this.getElement().getBoundingClientRect();
|