docs: 增加文档

antvis · Nov 20, 2023 · da75312 · da75312
1 parent 401dd68
commit da75312
Show file tree

Hide file tree

Showing 8 changed files with 121 additions and 18 deletions.
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/s2-site/examples/custom/custom-plugins/API.en.md b/s2-site/examples/custom/custom-plugins/API.en.md
@@ -0,0 +1,6 @@
+---
+title: API
+order: 7
+---
+
+<embed src="@/docs/common/custom/dataCellCallback.en.md"></embed>
diff --git a/s2-site/examples/custom/custom-plugins/API.zh.md b/s2-site/examples/custom/custom-plugins/API.zh.md
@@ -0,0 +1,5 @@
+---
+title: API
+order: 7
+---
+<embed src="@/docs/common/custom/customTreeItem.zh.md"></embed>
diff --git a/s2-site/examples/custom/custom-plugins/demo/custom-plugins.ts b/s2-site/examples/custom/custom-plugins/demo/custom-plugins.ts
@@ -0,0 +1,77 @@
+import { PivotSheet, S2Options } from '@antv/s2';
+import { Plugin as PluginRoughCanvasRenderer } from '@antv/g-plugin-rough-canvas-renderer';
+import { Plugin as PluginA11y } from '@antv/g-plugin-a11y';
+
+fetch(
+  'https://gw.alipayobjects.com/os/bmw-prod/cd9814d0-6dfa-42a6-8455-5a6bd0ff93ca.json',
+)
+  .then((res) => res.json())
+  .then((res) => {
+    const container = document.getElementById('container');
+    const s2DataConfig = {
+      fields: {
+        rows: ['province', 'city'],
+        columns: ['type', 'sub_type'],
+        values: ['number'],
+      },
+      data: res.data,
+      meta: [
+        {
+          field: 'number',
+          name: '数量',
+        },
+        {
+          field: 'province',
+          name: '省份',
+        },
+        {
+          field: 'city',
+          name: '城市',
+        },
+        {
+          field: 'type',
+          name: '类别',
+        },
+        {
+          field: 'sub_type',
+          name: '子类别',
+        },
+      ],
+    };
+
+    const s2Options: S2Options = {
+      width: 800,
+      height: 600,
+      interaction: {
+        brushSelection: {
+          rowCell: true,
+          colCell: true,
+          dataCell: true,
+        },
+      },
+      transformCanvasConfig(renderer) {
+        renderer.registerPlugin(new PluginRoughCanvasRenderer());
+        renderer.registerPlugin(
+          new PluginA11y({
+            enableExtractingText: true,
+          }),
+        );
+
+        console.log(
+          '当前已注册插件:',
+          renderer.getPlugins(),
+          renderer.getConfig(),
+        );
+
+        return {
+          supportsCSSTransform: true,
+          devicePixelRatio: 2,
+          cursor: 'crosshair',
+        };
+      },
+    };
+
+    const s2 = new PivotSheet(container, s2DataConfig, s2Options);
+
+    s2.render();
+  });
diff --git a/s2-site/examples/custom/custom-plugins/demo/meta.json b/s2-site/examples/custom/custom-plugins/demo/meta.json
@@ -0,0 +1,16 @@
+{
+  "title": {
+    "zh": "G 5.0 插件",
+    "en": "G 5.0 plugins"
+  },
+  "demos": [
+    {
+      "filename": "custom-g-plugins.ts",
+      "title": {
+        "zh": "自定义 AntV/G 5.0 插件和配置",
+        "en": "custom AntV/G 5.0 plugins and config"
+      },
+      "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Ag6SSYgDpeYAAAAAAAAAAAAADmJ7AQ/original"
+    }
+  ]
+}
diff --git a/s2-site/examples/custom/custom-plugins/index.en.md b/s2-site/examples/custom/custom-plugins/index.en.md
@@ -0,0 +1,4 @@
+---
+title: custom tree
+order: 7
+---
diff --git a/s2-site/examples/custom/custom-plugins/index.zh.md b/s2-site/examples/custom/custom-plugins/index.zh.md
@@ -0,0 +1,4 @@
+---
+title: 自定义目录树
+order: 7
+---
diff --git a/s2-site/package.json b/s2-site/package.json
@@ -37,7 +37,9 @@
     "dumi": "^2.0.3",
     "gh-pages": "^3.1.0",
     "lodash": "^4.17.21",
-    "react-color": "^2.19.3"
+    "react-color": "^2.19.3",
+    "@antv/g-plugin-a11y": "^0.6.19",
+    "@antv/g-plugin-rough-canvas-renderer": "^1.9.24"
   },
   "devDependencies": {
     "@google-cloud/translate": "^7.0.3",