From 959680258168effb0c03cabee3da86df983627b4 Mon Sep 17 00:00:00 2001 From: pomelo Date: Tue, 7 Jun 2022 16:11:56 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=E6=96=B0=E6=88=90?= =?UTF-8?q?=E5=91=98=20GraphInsight=20(#3720)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: pomelo.lcw --- packages/element/README-zh_CN.md | 2 - packages/pc/README-zh_CN.md | 1 - packages/site/docs/manual/introduction.zh.md | 2 - .../case/graphDemos/demo/graphinsight.js | 23 ++++ .../examples/case/graphDemos/demo/meta.json | 10 +- packages/site/gatsby-config.js | 14 +-- packages/site/site/locale.json | 3 +- packages/site/site/pages/graphmarker.en.tsx | 3 - packages/site/site/pages/graphmarker.zh.tsx | 37 ------ packages/site/site/pages/index.zh.tsx | 26 ++--- packages/site/site/pages/tools.en.tsx | 3 + packages/site/site/pages/tools.zh.tsx | 107 ++++++++++++++++++ 12 files changed, 162 insertions(+), 69 deletions(-) create mode 100644 packages/site/examples/case/graphDemos/demo/graphinsight.js delete mode 100644 packages/site/site/pages/graphmarker.en.tsx delete mode 100644 packages/site/site/pages/graphmarker.zh.tsx create mode 100644 packages/site/site/pages/tools.en.tsx create mode 100644 packages/site/site/pages/tools.zh.tsx diff --git a/packages/element/README-zh_CN.md b/packages/element/README-zh_CN.md index ce5553e27e9..bd8afaf454e 100644 --- a/packages/element/README-zh_CN.md +++ b/packages/element/README-zh_CN.md @@ -139,7 +139,6 @@ DEBUG_MODE=1 npm test -- --watch ./tests/unit/algorithm/find-path-spec - 扩展阅读 - API - ## G6 图可视化交流群 欢迎各界 G6 使用者、图可视化爱好者加入 **G6 图可视化交流群** 及 **G6 图可视化交流二群**（钉钉群，使用钉钉扫一扫加入）讨论与交流。Graphin 的使用者，爱好者请加入 **Graphin's Group Chat** @@ -164,7 +163,6 @@ DEBUG_MODE=1 npm test -- --watch ./tests/unit/algorithm/find-path-spec 请让我们知道您要解决或贡献什么，所以在贡献之前请先提交 [issues](https://github.com/antvis/g6/issues) 描述 bug 或建议。 - ## License [MIT license](./LICENSE). diff --git a/packages/pc/README-zh_CN.md b/packages/pc/README-zh_CN.md index 0b366fabb33..bd8afaf454e 100644 --- a/packages/pc/README-zh_CN.md +++ b/packages/pc/README-zh_CN.md @@ -139,7 +139,6 @@ DEBUG_MODE=1 npm test -- --watch ./tests/unit/algorithm/find-path-spec - 扩展阅读 - API - ## G6 图可视化交流群 欢迎各界 G6 使用者、图可视化爱好者加入 **G6 图可视化交流群** 及 **G6 图可视化交流二群**（钉钉群，使用钉钉扫一扫加入）讨论与交流。Graphin 的使用者，爱好者请加入 **Graphin's Group Chat** diff --git a/packages/site/docs/manual/introduction.zh.md b/packages/site/docs/manual/introduction.zh.md index e74cbd19e80..74b9945437b 100644 --- a/packages/site/docs/manual/introduction.zh.md +++ b/packages/site/docs/manual/introduction.zh.md @@ -119,7 +119,6 @@ Graphin 取名意为 Graph Insight（图的分析洞察），是一个基于 G6 - 基于 G6 和 Angular 实现的编辑器 - 基于 G6 和 Vue 的流程图编辑器 - ## G6 图可视化交流群 欢迎各界 G6 使用者、图可视化爱好者加入 **G6 图可视化交流群** 及 **G6 图可视化交流二群**（钉钉群，使用钉钉扫一扫加入）讨论与交流。Graphin 的使用者，爱好者请加入 **Graphin's Group Chat** @@ -144,7 +143,6 @@ Graphin 取名意为 Graph Insight（图的分析洞察），是一个基于 G6 请让我们知道您要解决或贡献什么，所以在贡献之前请先提交 issues 描述 bug 或建议。 - ## License MIT license。 diff --git a/packages/site/examples/case/graphDemos/demo/graphinsight.js b/packages/site/examples/case/graphDemos/demo/graphinsight.js new file mode 100644 index 00000000000..4d541912f7f --- /dev/null +++ b/packages/site/examples/case/graphDemos/demo/graphinsight.js @@ -0,0 +1,23 @@ +const container = document.getElementById('container'); + +const iframe = document.createElement('iframe'); +iframe.id = 'graphinsight-bank-demo'; + +iframe.src = + 'https://codesandbox.io/embed/condescending-platform-mt37im?fontsize=14&hidenavigation=1&theme=dark'; +iframe.style = + 'width:100%; height:100%; min-height:500px; border:0; border-radius: 4px; overflow:hidden;'; +iframe.allow = + 'accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking'; +iframe.sandbox = + 'allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts'; +iframe.title = 'condescending-graphinsight-bank'; + +const info = document.createElement('div'); +info.innerHTML = ` +

友情提示，如果CodeSandbox打开比较慢，可以访问 「GraphInsight」 在线查看， +它是 AntV 团队基于 G6 研发的一款图分析应用低代码搭建工具与分析洞察产品，它既可以帮助用户在线实现关系数据的可视化，也可帮助开发者一键导出图画布SDK，极大提高研发效率 +

+`; +container.appendChild(info); +container.appendChild(iframe); diff --git a/packages/site/examples/case/graphDemos/demo/meta.json b/packages/site/examples/case/graphDemos/demo/meta.json index a1671ecd0a8..6797564d826 100644 --- a/packages/site/examples/case/graphDemos/demo/meta.json +++ b/packages/site/examples/case/graphDemos/demo/meta.json @@ -4,6 +4,14 @@ "en": "Category" }, "demos": [ + { + "filename": "graphinsight.js", + "title": { + "zh": "GraphInsight 案例", + "en": "GraphInsight Case" + }, + "screenshot": "https://gw.alipayobjects.com/mdn/rms_0d75e8/afts/img/A*eXL9T6xqPlUAAAAAAAAAAAAAARQnAQ" + }, { "filename": "largeGraph.js", "title": { @@ -61,4 +69,4 @@ "screenshot": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*hk1QTqVIHnIAAAAAAAAAAAAAARQnAQ" } ] -} \ No newline at end of file +} diff --git a/packages/site/gatsby-config.js b/packages/site/gatsby-config.js index 1659a70bf74..f346de4d255 100644 --- a/packages/site/gatsby-config.js +++ b/packages/site/gatsby-config.js @@ -29,13 +29,6 @@ module.exports = { en: 'Design System', }, }, - { - slug: 'graphmarker', - title: { - zh: '交互式文档', - en: 'GraphMarker', - }, - }, { slug: 'docs/manual/introduction', title: { @@ -50,6 +43,13 @@ module.exports = { en: 'API', }, }, + { + slug: 'tools', + title: { + zh: '在线工具', + en: 'online tools', + }, + }, { slug: 'examples', title: { diff --git a/packages/site/site/locale.json b/packages/site/site/locale.json index f7e3a6222f3..685a3bb2cd9 100644 --- a/packages/site/site/locale.json +++ b/packages/site/site/locale.json @@ -58,5 +58,6 @@ "绿点标记：新增节点": "Green Dot: Newly Added Node", "相较于上一次结果，右上方小绿点标记了\n本次更新结果中新增的聚合节点或真实节点": "The green dot on the right-top of the node indicates that \nthe node is newly added compared to last result", "Graphin 是一款基于 G6 封装的 React 分析组件库，专注在关系可视分析领域，简单高效，开箱即用。": "Graphin stands for Graph Insight. It's a toolkit based on G6 and React, that focuses on relational visual analysis. It's simple, efficient, out of the box.", - "Graphin 图可视分析组件": "Graphin: Graph Insight" + "Graphin 图可视分析组件": "Graphin: Graph Insight", + "G6 家族新成员：GraphInsight": "New to the G6 family: GraphInsight" } diff --git a/packages/site/site/pages/graphmarker.en.tsx b/packages/site/site/pages/graphmarker.en.tsx deleted file mode 100644 index a6e026d0518..00000000000 --- a/packages/site/site/pages/graphmarker.en.tsx +++ /dev/null @@ -1,3 +0,0 @@ -import GraphMarker from './graphmarker.zh'; - -export default GraphMarker; diff --git a/packages/site/site/pages/graphmarker.zh.tsx b/packages/site/site/pages/graphmarker.zh.tsx deleted file mode 100644 index 72978456016..00000000000 --- a/packages/site/site/pages/graphmarker.zh.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import React from 'react'; -import { useTranslation } from 'react-i18next'; -import SEO from '@antv/gatsby-theme-antv/site/components/Seo'; - -const GraphMarker = () => { - const { t, i18n } = useTranslation(); - return ( - <> - -
- */} + {/*