feat: support pivot vtable

VisActor · Dec 25, 2024 · 2794533 · 2794533
1 parent 67a8772
commit 2794533
Show file tree

Hide file tree

Showing 10 changed files with 68,169 additions and 597 deletions.
diff --git a/packages/vstory-core/src/character/chart/character-chart.ts b/packages/vstory-core/src/character/chart/character-chart.ts
@@ -10,7 +10,7 @@ import type { IChartCharacterConfig } from '../../interface/dsl/chart';
 import { getLayoutFromWidget } from '../../utils/layout';
 import type { IChartCharacterRuntime, IUpdateConfigParams } from './interface/runtime';
 import { CommonSpecRuntimeInstance } from './runtime/common-spec';
-import { CommonLayoutRuntimeInstance } from './runtime/common-layout';
+import { CommonLayoutRuntimeInstance } from '../common/runtime/common-layout';
 import { ChartConfigProcess } from './chart-config-process';
 import type { ICharacterChart } from './interface/character-chart';
 import { mergeChartOption } from '../../utils/chart';

diff --git a/.../character/chart/runtime/common-layout.ts → ...character/common/runtime/common-layout.ts b/.../character/chart/runtime/common-layout.ts → ...character/common/runtime/common-layout.ts
@@ -1,7 +1,7 @@
 import { merge } from '@visactor/vutils';
-import type { IChartCharacterRuntime } from '../interface/runtime';
+import type { IChartCharacterRuntime } from '../../chart/interface/runtime';
 import { getLayoutFromWidget } from '../../../utils/layout';
-import type { ICharacterChart } from '../interface/character-chart';
+import type { ICharacterChart } from '../../chart/interface/character-chart';
 export class CommonLayoutRuntime implements IChartCharacterRuntime {
   type = 'CommonLayout';
 

diff --git a/packages/vstory-core/src/character/table/character-table.ts b/packages/vstory-core/src/character/table/character-table.ts
@@ -12,7 +12,8 @@ import type { ITableCharacterRuntime, IUpdateConfigParams } from './interface/ru
 import { TableConfigProcess } from './table-config-process';
 import type { ICharacterTable } from './interface/character-table';
 import { CommonSpecRuntimeInstance } from './runtime/common-spec';
-import { CommonLayoutRuntimeInstance } from '../chart/runtime/common-layout';
+import { CommonLayoutRuntimeInstance } from '../common/runtime/common-layout';
+import { TableTypeRuntimeInstance } from './runtime/table-type';
 
 export class CharacterTable<T extends ITableGraphicAttribute>
   extends CharacterBase<ITableGraphicAttribute>
@@ -93,7 +94,7 @@ export class CharacterTable<T extends ITableGraphicAttribute>
   }
 
   protected _initRuntime(): void {
-    this._runtime.push(CommonLayoutRuntimeInstance as any, CommonSpecRuntimeInstance);
+    this._runtime.push(CommonLayoutRuntimeInstance as any, TableTypeRuntimeInstance, CommonSpecRuntimeInstance);
   }
   protected _clearRuntime(): void {
     this._runtime.length = 0;

diff --git a/packages/vstory-core/src/character/table/graphic/vtable-graphic.ts b/packages/vstory-core/src/character/table/graphic/vtable-graphic.ts
@@ -4,7 +4,9 @@ import type { IAABBBounds, IBoundsLike, Bounds } from '@visactor/vutils';
 import { pointInAABB, transformBoundsWithMatrix } from '@visactor/vutils';
 import { isBoundsLikeEqual } from '../../../utils/equal';
 import * as VTable from '@visactor/vtable';
-import type { IInitOption } from '@visactor/vchart';
+import { VChart, type IInitOption } from '@visactor/vchart';
+
+VTable.register.chartModule('vchart', VChart);
 
 export const TableClass: { [key: string]: any } = {
   table: VTable.ListTable,
@@ -18,7 +20,8 @@ export const TableClass: { [key: string]: any } = {
   // 其他都是 PivotChart
 
   ListTable: VTable.ListTable,
-  PivotTable: VTable.PivotTable
+  PivotTable: VTable.PivotTable,
+  PivotChart: VTable.PivotChart
 };
 
 export type IVTable = VTable.ListTable | VTable.PivotTable | VTable.PivotChart;
@@ -30,7 +33,8 @@ export interface ITableConstructor {
 export interface ITableGraphicAttribute {
   renderCanvas: HTMLCanvasElement;
   spec: any;
-  chartType: string;
+  // 表格类型
+  tableType: string;
   // ClassType: any;
   TableConstructor?: ITableConstructor;
   dpr: number;
@@ -105,7 +109,7 @@ export class VTableGraphic extends Rect {
     // 创建table
     this.attribute.viewBox = params.viewBox;
     const filledOption = this._createOption(params);
-    this._vTable = new (TableConstructor ?? TableClass[params.chartType] ?? VTable.PivotChart)(filledOption);
+    this._vTable = new (TableConstructor ?? TableClass[params.tableType] ?? VTable.PivotChart)(filledOption);
 
     // 背景设置为false后，不会擦除画布内容，可以实现元素正常堆叠绘制
     const stage = this._vTable.scenegraph.stage;

diff --git a/packages/vstory-core/src/character/table/runtime/common-spec.ts b/packages/vstory-core/src/character/table/runtime/common-spec.ts
@@ -8,7 +8,6 @@ export class CommonSpecRuntime implements ITableCharacterRuntime {
   applyConfigToAttribute(character: ICharacterTable): void {
     const rawAttribute = character.getRuntimeConfig().getAttribute();
     const { spec } = rawAttribute;
-    rawAttribute.chartType = 'table';
     spec.canvas = character.canvas.getNativeCanvas();
     spec.animation = false;
     // 编辑模式关闭
@@ -17,17 +16,17 @@ export class CommonSpecRuntime implements ITableCharacterRuntime {
     spec.select = Object.assign({}, spec.select ?? {}, {
       makeSelectCellVisible: false
     });
-    spec.hover = spec.hover ?? {};
-    spec.select.disableSelect = true;
-    spec.hover.disableHover = true;
+    // spec.hover = spec.hover ?? {};
+    // // spec.select.disableSelect = true;
+    // // spec.hover.disableHover = true;
     spec.columnResizeMode = 'none';
     spec.rowResizeMode = 'none';
     /** 控制拖拽表头移动位置顺序开关 */
     spec.dragHeaderMode = 'none';
 
     spec.chartOption = {
-      disableInteraction: true,
-      disableTriggerEvent: true
+      // disableInteraction: true,
+      // disableTriggerEvent: true
     };
 
     if (spec.legends) {

diff --git a/packages/vstory-core/src/character/table/runtime/table-type.ts b/packages/vstory-core/src/character/table/runtime/table-type.ts
@@ -0,0 +1,23 @@
+import type { ITableCharacterRuntime } from '../interface/runtime';
+import type { ICharacterTable } from '../interface/character-table';
+
+export class TableTypeRuntime implements ITableCharacterRuntime {
+  type = 'CommonSpec';
+
+  applyConfigToAttribute(character: ICharacterTable): void {
+    const rawAttribute = character.getRuntimeConfig().getAttribute();
+    const { spec } = rawAttribute;
+    if (!spec.indicators) {
+      rawAttribute.tableType = 'ListTable';
+      return;
+    }
+    // 如果有图表
+    if (spec.indicators.some((i: { chartSpec: object }) => !!i.chartSpec)) {
+      rawAttribute.tableType = 'PivotChart';
+      return;
+    }
+    rawAttribute.tableType = 'PivotTable';
+  }
+}
+
+export const TableTypeRuntimeInstance = new TableTypeRuntime();