From d0e512cc4810879bee36b5329ac83aded6e6bb78 Mon Sep 17 00:00:00 2001
From: Jinke Li <a1231236677287@163.com>
Date: Tue, 23 Jan 2024 11:17:25 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=87=AA=E5=AE=9A=E4=B9=89=20icon=20?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E8=B7=A8=E5=9F=9F=20close=20#2513=20(#2524)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: 自定义 icon 支持跨域 close #2513

* docs: 更新序号文档
---
 .../unit/common/icons/gui-icon-spec.ts        | 40 ++++++++++++++++++-
 packages/s2-core/src/common/icons/gui-icon.ts |  2 +
 .../manual/basic/sheet-type/table-mode.zh.md  |  5 +--
 s2-site/examples/basic/table/demo/table.ts    |  1 -
 4 files changed, 43 insertions(+), 5 deletions(-)

diff --git a/packages/s2-core/__tests__/unit/common/icons/gui-icon-spec.ts b/packages/s2-core/__tests__/unit/common/icons/gui-icon-spec.ts
index ff88052f9c..2f377c11e7 100644
--- a/packages/s2-core/__tests__/unit/common/icons/gui-icon-spec.ts
+++ b/packages/s2-core/__tests__/unit/common/icons/gui-icon-spec.ts
@@ -1,6 +1,6 @@
 import { Group, Shape } from '@antv/g-canvas';
 import { registerIcon } from '../../../../src/common/icons';
-import { sleep } from '../../../util/helpers';
+import { createPivotSheet, sleep } from '../../../util/helpers';
 import { GuiIcon } from '@/common/icons/gui-icon';
 import { ArrowDown } from '@/common/icons/svg/svgs';
 
@@ -100,4 +100,42 @@ describe('GuiIcon Tests', () => {
     icon.setImageAttrs({ fill: 'red' });
     expect(spy).toHaveBeenCalled();
   });
+
+  // https://github.com/antvis/S2/issues/2513
+  test('should support cross origin for online url', () => {
+    const s2 = createPivotSheet({
+      width: 200,
+      height: 200,
+      customSVGIcons: [
+        {
+          name: 'Filter',
+          svg: 'https://gw.alipayobjects.com/zos/antfincdn/gu1Fsz3fw0/filter%26sort_filter.svg',
+        },
+      ],
+      headerActionIcons: [
+        {
+          iconNames: ['Filter'],
+          belongsCell: 'colCell',
+          defaultHide: false,
+        },
+        {
+          iconNames: ['Filter'],
+          belongsCell: 'rowCell',
+          defaultHide: false,
+        },
+        {
+          iconNames: ['Filter'],
+          belongsCell: 'cornerCell',
+          defaultHide: false,
+        },
+      ],
+    });
+
+    function render() {
+      s2.render();
+      s2.getCanvasElement().toDataURL();
+    }
+
+    expect(render).not.toThrowError();
+  });
 });
diff --git a/packages/s2-core/src/common/icons/gui-icon.ts b/packages/s2-core/src/common/icons/gui-icon.ts
index 5429ee6b15..b3b7c49bc7 100644
--- a/packages/s2-core/src/common/icons/gui-icon.ts
+++ b/packages/s2-core/src/common/icons/gui-icon.ts
@@ -57,6 +57,8 @@ export class GuiIcon extends Group {
       // 3、线上支持的图片地址
       if (svg.includes(SVG_CONTENT_TYPE) || this.isOnlineLink(svg)) {
         img.src = svg;
+        // https://github.com/antvis/S2/issues/2513
+        img.crossOrigin = 'anonymous';
       } else {
         // 传入 svg 字符串（支持颜色fill）
         if (fill) {
diff --git a/s2-site/docs/manual/basic/sheet-type/table-mode.zh.md b/s2-site/docs/manual/basic/sheet-type/table-mode.zh.md
index 611c394559..c9ac2bca31 100644
--- a/s2-site/docs/manual/basic/sheet-type/table-mode.zh.md
+++ b/s2-site/docs/manual/basic/sheet-type/table-mode.zh.md
@@ -101,12 +101,11 @@ s2.render();
 
 ### 序号
 
-在 `s2Options` 中传入 `showSeriesNumber` 即可展示内置的序号，可以自定义序号列标题。[查看 demo](/examples/basic/table#table)
+在 `s2Options` 中传入 `showSeriesNumber` 即可展示内置的序号。[查看 demo](/examples/basic/table#table)
 
 ```ts
 const s2Options = {
-  showSeriesNumber: true,
-  seriesNumberText: '自定义序号标题' // 默认 "序号"
+  showSeriesNumber: true
 }
 ```
 
diff --git a/s2-site/examples/basic/table/demo/table.ts b/s2-site/examples/basic/table/demo/table.ts
index e522932e47..7347a161a7 100644
--- a/s2-site/examples/basic/table/demo/table.ts
+++ b/s2-site/examples/basic/table/demo/table.ts
@@ -37,7 +37,6 @@ fetch('https://assets.antv.antgroup.com/s2/basic-table-mode.json')
       width: 600,
       height: 480,
       showSeriesNumber: true,
-      // seriesNumberText: '自定义序号标题',
     };
 
     const s2 = new TableSheet(container, s2DataConfig, s2Options);