fix: 修复在明细表中绘制 G2 图表, 点击单元格报错 close #2843

antvis · Aug 16, 2024 · 0a6fe65 · 0a6fe65
1 parent 3dcf491
commit 0a6fe65
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 6 deletions.
diff --git a/packages/s2-core/__tests__/unit/utils/tooltip-spec.ts b/packages/s2-core/__tests__/unit/utils/tooltip-spec.ts
@@ -1103,6 +1103,43 @@ describe('Tooltip Utils Tests', () => {
         `);
       });
     });
+
+    // https://github.com/antvis/S2/issues/2843
+    test('should get empty cell name for custom chart shape', () => {
+      s2 = createFakeSpreadSheet();
+
+      s2.dataSet = {
+        getFieldFormatter: () => {},
+        getCustomFieldDescription: () => {},
+        getFieldName: () => {
+          return {
+            values: {
+              test: '1',
+            },
+          };
+        },
+      };
+
+      s2.facet = {
+        getRowLeafNodes: () => [],
+        getColLeafNodes: () => [],
+      } as unknown as BaseFacet;
+
+      const cell = createMockCellInfo('test-a');
+
+      const tooltipData = getTooltipData({
+        cellInfos: [],
+        options: {
+          enableFormat: true,
+          hideSummary: true,
+          onlyShowCellText: true,
+        },
+        targetCell: cell.mockCell,
+        spreadsheet: s2,
+      });
+
+      expect(tooltipData.name).toEqual('');
+    });
   });
 
   test('should set container style', () => {

diff --git a/packages/s2-core/src/utils/tooltip.ts b/packages/s2-core/src/utils/tooltip.ts
@@ -19,6 +19,7 @@ import {
   isFunction,
   isNumber,
   isObject,
+  isString,
   last,
   map,
   mapKeys,
@@ -563,15 +564,14 @@ export const getTooltipData = (params: TooltipDataParam): TooltipData => {
   const firstCellInfo = (cellInfos[0] || {}) as unknown as ViewMetaData;
 
   if (!options?.hideSummary) {
-    // 计算多项的sum（默认为sum，可自定义）
+    // 计算多项的 sum（默认为 sum，可自定义）
     summaries = getSummaries({
       spreadsheet,
       options,
       targetCell,
     });
   } else if (options.onlyShowCellText) {
-    // 行列头hover & 明细表所有hover
-
+    // 行列头 hover & 明细表所有 hover
     const value = CellData.getFieldValue(firstCellInfo, 'value') as string;
     const valueField = CellData.getFieldValue(
       firstCellInfo,
@@ -584,7 +584,8 @@ export const getTooltipData = (params: TooltipDataParam): TooltipData => {
       ? spreadsheet.dataSet.getFieldName(value) || formattedValue
       : spreadsheet.dataSet.getFieldName(valueField);
 
-    name = cellText || '';
+    // https://github.com/antvis/S2/issues/2843
+    name = isString(cellText) ? cellText : '';
   } else {
     headInfo = getHeadInfo(spreadsheet, firstCellInfo, options);
     details = getTooltipDetailList(

diff --git a/s2-site/docs/manual/advanced/chart-in-cell.zh.md b/s2-site/docs/manual/advanced/chart-in-cell.zh.md
@@ -332,7 +332,20 @@ import { renderToMountedElement } from '@antv/g2';
 
 #### 2.3 在 `@antv/s2` 中使用
 
-##### 1. 自定义 `DataCell`, 如果是图表数据，则不渲染默认的文本
+##### 1. 自定义 `DataCell/TableDataCell`, 如果是图表数据，则不渲染默认的文本
+
+:::info{title="提示"}
+如果是**明细表**, 需要继承 `TableDataCell`
+
+```diff
+- import { DataCell } from '@antv/s2';
++ import { TableDataCell } from '@antv/s2';
+
+- class ChartSheetDataCell extends DataCell {}
++ class ChartSheetDataCell extends TableDataCell {}
+```
+
+:::
 
 ```ts
 import { PivotSheet, DataCell } from '@antv/s2';
@@ -357,7 +370,7 @@ await s2.render();
 
 ##### 2. 监听数值单元格渲染完成后，使用 `G2` 提供的 `renderToMountedElement` 将图表挂载在 `S2` 单元格实例上
 
-:::warning{title="提示"}
+:::info{title="提示"}
 由于 `G2` 按需加载的特性，请根据你渲染的图表，自行选择适合的 [`library`](https://g2.antv.antgroup.com/manual/extra-topics/bundle#g2stdlib)
 :::