├── .changeset
└── config.json
├── .commitlintrc.js
├── .cursor
└── rules
│ └── translation.mdc
├── .editorconfig
├── .eslintignore
├── .eslintrc.js
├── .github
├── ISSUE_TEMPLATE
│ ├── 1.bug_report.yml
│ ├── 2.feature_request.yml
│ ├── 3.docs_feedback.yml
│ ├── 4.oscp.yml
│ ├── config.yml
│ └── oscp.yml
└── workflows
│ ├── build.yml
│ ├── deploy.yml
│ ├── ensure-triage-label.yml
│ ├── issue_translate.yml
│ ├── manage-labeled.yml
│ ├── mark-duplicate.yml
│ ├── no-response.yml
│ ├── publish.yml
│ ├── resolved-pending-release.yml
│ ├── scripts
│ ├── closeOnRelease.js
│ └── updateYuque.js
│ └── update-yuque.yml
├── .gitignore
├── .husky
├── commit-msg
└── pre-commit
├── .prettierignore
├── .prettierrc.js
├── .vscode
└── settings.json
├── CHANGELOG.md
├── LICENSE
├── PUBLISH.md
├── README.md
├── README.zh-CN.md
├── SECURITY.md
├── package.json
├── packages
├── bundle
│ ├── index.html
│ ├── package.json
│ ├── rollup.config.mjs
│ ├── src
│ │ └── index.ts
│ ├── tsconfig.json
│ ├── vite.config.js
│ └── webpack.config.js
├── cli
│ ├── CHANGELOG.md
│ ├── README.md
│ ├── build.config.ts
│ ├── index.js
│ ├── package.json
│ ├── src
│ │ └── index.ts
│ ├── template-extension
│ │ ├── .commitlintrc.js
│ │ ├── .editorconfig
│ │ ├── .eslintignore
│ │ ├── .eslintrc.js
│ │ ├── .gitignore
│ │ ├── .prettierignore
│ │ ├── .prettierrc.js
│ │ ├── __tests__
│ │ │ ├── demos
│ │ │ │ ├── element-node-extend.ts
│ │ │ │ └── index.ts
│ │ │ ├── index.html
│ │ │ ├── main.ts
│ │ │ ├── setup.ts
│ │ │ ├── snapshots
│ │ │ │ └── elements
│ │ │ │ │ └── nodes
│ │ │ │ │ └── extend
│ │ │ │ │ └── default.svg
│ │ │ ├── types.d.ts
│ │ │ ├── unit
│ │ │ │ ├── default.spec.ts
│ │ │ │ └── elements
│ │ │ │ │ └── nodes
│ │ │ │ │ └── extend.spec.ts
│ │ │ └── utils
│ │ │ │ ├── create.ts
│ │ │ │ ├── dir.ts
│ │ │ │ ├── index.ts
│ │ │ │ ├── offscreen-canvas-context.ts
│ │ │ │ ├── sleep.ts
│ │ │ │ ├── svg-transformer.js
│ │ │ │ ├── to-match-svg-snapshot.ts
│ │ │ │ └── use-snapshot-matchers.ts
│ │ ├── jest.config.js
│ │ ├── package.json
│ │ ├── rollup.config.mjs
│ │ ├── src
│ │ │ ├── elements
│ │ │ │ ├── index.ts
│ │ │ │ └── nodes
│ │ │ │ │ ├── extend-node.ts
│ │ │ │ │ └── index.ts
│ │ │ ├── exports.ts
│ │ │ └── index.ts
│ │ ├── tsconfig.build.json
│ │ ├── tsconfig.json
│ │ └── vite.config.js
│ └── tsconfig.json
├── g6-extension-3d
│ ├── README.md
│ ├── __tests__
│ │ ├── .eslintrc
│ │ ├── dataset
│ │ │ ├── cubic.json
│ │ │ └── force-3d.json
│ │ ├── demos
│ │ │ ├── behavior-drag-canvas.ts
│ │ │ ├── behavior-observe-canvas.ts
│ │ │ ├── behavior-roll-canvas.ts
│ │ │ ├── behavior-zoom-canvas.ts
│ │ │ ├── index.ts
│ │ │ ├── layer-top.ts
│ │ │ ├── layout-d3-force-3d.ts
│ │ │ ├── massive-elements.ts
│ │ │ ├── position.ts
│ │ │ ├── shapes.ts
│ │ │ ├── solar-system.ts
│ │ │ └── switch-renderer.ts
│ │ ├── index.html
│ │ ├── main.ts
│ │ ├── types.d.ts
│ │ └── unit
│ │ │ ├── default.spec.ts
│ │ │ └── utils
│ │ │ ├── cache.spec.ts
│ │ │ ├── geometry.spec.ts
│ │ │ ├── map.spec.ts
│ │ │ ├── material.spec.ts
│ │ │ └── texture.spec.ts
│ ├── jest.config.js
│ ├── package.json
│ ├── rollup.config.mjs
│ ├── src
│ │ ├── behaviors
│ │ │ ├── drag-canvas-3d.ts
│ │ │ ├── index.ts
│ │ │ ├── observe-canvas-3d.ts
│ │ │ ├── roll-canvas-3d.ts
│ │ │ └── zoom-canvas-3d.ts
│ │ ├── elements
│ │ │ ├── base-node-3d.ts
│ │ │ ├── capsule.ts
│ │ │ ├── cone.ts
│ │ │ ├── cube.ts
│ │ │ ├── cylinder.ts
│ │ │ ├── index.ts
│ │ │ ├── line-3d.ts
│ │ │ ├── plane.ts
│ │ │ ├── sphere.ts
│ │ │ └── torus.ts
│ │ ├── exports.ts
│ │ ├── index.ts
│ │ ├── plugins
│ │ │ ├── index.ts
│ │ │ └── light.ts
│ │ ├── renderer.ts
│ │ ├── types
│ │ │ ├── index.ts
│ │ │ └── material.ts
│ │ └── utils
│ │ │ ├── cache.ts
│ │ │ ├── geometry.ts
│ │ │ ├── map.ts
│ │ │ ├── material.ts
│ │ │ └── texture.ts
│ ├── tsconfig.build.json
│ ├── tsconfig.json
│ ├── tsconfig.test.json
│ └── vite.config.js
├── g6-extension-react
│ ├── README.md
│ ├── __tests__
│ │ ├── .eslintrc
│ │ ├── dataset
│ │ │ └── euro-cup.json
│ │ ├── demos
│ │ │ ├── euro-cup.tsx
│ │ │ ├── graph.tsx
│ │ │ ├── index.tsx
│ │ │ ├── performance-diagnosis.tsx
│ │ │ └── react-node.tsx
│ │ ├── graph.tsx
│ │ ├── index.html
│ │ ├── main.tsx
│ │ └── unit
│ │ │ ├── attribute-changed-callback.spec.tsx
│ │ │ └── default.spec.ts
│ ├── jest.config.js
│ ├── package.json
│ ├── rollup.config.mjs
│ ├── src
│ │ ├── index.ts
│ │ └── react-node
│ │ │ ├── index.ts
│ │ │ ├── node.tsx
│ │ │ └── render.ts
│ ├── tsconfig.build.json
│ ├── tsconfig.json
│ ├── tsconfig.test.json
│ └── vite.config.js
├── g6-ssr
│ ├── .gitignore
│ ├── README.md
│ ├── __tests__
│ │ ├── assets
│ │ │ ├── bin.png
│ │ │ ├── file.pdf
│ │ │ ├── file.svg
│ │ │ ├── image-rough.png
│ │ │ ├── image.jpeg
│ │ │ ├── image.png
│ │ │ ├── image_x1.jpeg
│ │ │ └── node-image.jpeg
│ │ ├── graph-options.json
│ │ └── graph.spec.ts
│ ├── bin
│ │ └── g6-ssr.js
│ ├── jest.config.js
│ ├── package.json
│ ├── rollup.config.mjs
│ ├── src
│ │ ├── canvas.ts
│ │ ├── graph.ts
│ │ ├── index.ts
│ │ └── types.ts
│ ├── tsconfig.build.json
│ ├── tsconfig.json
│ └── tsconfig.test.json
├── g6
│ ├── .gitignore
│ ├── __tests__
│ │ ├── .eslintrc
│ │ ├── assets
│ │ │ ├── comment.svg
│ │ │ ├── factory.svg
│ │ │ ├── store.svg
│ │ │ ├── user.svg
│ │ │ └── warehouse.svg
│ │ ├── bugs
│ │ │ ├── api-expand-element-z-index.spec.ts
│ │ │ ├── api-focus-element-edge.spec.ts
│ │ │ ├── behaviors-click-select-drag-node.spec.ts
│ │ │ ├── behaviors-click-select.spec.ts
│ │ │ ├── behaviors-collapse-expand.spec.ts
│ │ │ ├── behaviors-drag-element-combo.spec.ts
│ │ │ ├── behaviors-multiple-conflict.spec.ts
│ │ │ ├── brush-select.spec.ts
│ │ │ ├── continuous-invoke.spec.ts
│ │ │ ├── element-combo-drag.spec.ts
│ │ │ ├── element-custom-state-switch.spec.ts
│ │ │ ├── element-edge-update-arrow.spec.ts
│ │ │ ├── element-node-collapse.spec.ts
│ │ │ ├── element-node-icon-switch.spec.ts
│ │ │ ├── element-node-update-badge.spec.ts
│ │ │ ├── element-orth-router.spec.ts
│ │ │ ├── element-port-rotate.spec.ts
│ │ │ ├── element-remove-combo.spec.ts
│ │ │ ├── element-set-position-to-origin.spec.ts
│ │ │ ├── fit-view.spec.ts
│ │ │ ├── focus-element.spec.ts
│ │ │ ├── graph-draw-after-clear.spec.ts
│ │ │ ├── model-add-edge-in-combo.spec.ts
│ │ │ ├── model-remove-parent.spec.ts
│ │ │ ├── plugin-history-align-fields.spec.ts
│ │ │ ├── plugin-hull-three-collinear-dots.spec.ts
│ │ │ ├── plugin-minimap-combo-collapsed.spec.ts
│ │ │ ├── render-change-combo.spec.ts
│ │ │ ├── render-deleted-data.spec.ts
│ │ │ ├── tree-update-collapsed-node.spec.ts
│ │ │ └── utils-set-visibility.spec.ts
│ │ ├── dataset
│ │ │ ├── algorithm-category.json
│ │ │ ├── circular.json
│ │ │ ├── cluster.json
│ │ │ ├── combo.json
│ │ │ ├── dagre-combo.json
│ │ │ ├── dagre.json
│ │ │ ├── decision-tree.json
│ │ │ ├── element-edges.json
│ │ │ ├── element-nodes.json
│ │ │ ├── file-system.json
│ │ │ ├── flare.json
│ │ │ ├── force.json
│ │ │ ├── gene.json
│ │ │ ├── language-tree.json
│ │ │ ├── organization-chart.json
│ │ │ ├── parallel-edges.json
│ │ │ ├── radial.json
│ │ │ ├── relations.json
│ │ │ └── soccer.json
│ │ ├── demos
│ │ │ ├── animation-element-edge-cubic.ts
│ │ │ ├── animation-element-edge-line.ts
│ │ │ ├── animation-element-edge-quadratic.ts
│ │ │ ├── animation-element-position.ts
│ │ │ ├── animation-element-state-switch.ts
│ │ │ ├── animation-element-state.ts
│ │ │ ├── animation-element-style-position.ts
│ │ │ ├── behavior-auto-adapt-label.ts
│ │ │ ├── behavior-brush-select.ts
│ │ │ ├── behavior-click-select.ts
│ │ │ ├── behavior-create-edge.ts
│ │ │ ├── behavior-drag-canvas.ts
│ │ │ ├── behavior-drag-element.ts
│ │ │ ├── behavior-expand-collapse-combo.ts
│ │ │ ├── behavior-expand-collapse-node.ts
│ │ │ ├── behavior-fix-element-size.ts
│ │ │ ├── behavior-focus-element.ts
│ │ │ ├── behavior-hover-activate.ts
│ │ │ ├── behavior-lasso-select.ts
│ │ │ ├── behavior-optimize-viewport-transform.ts
│ │ │ ├── behavior-scroll-canvas.ts
│ │ │ ├── behavior-zoom-canvas.ts
│ │ │ ├── bug-tooltip-resize.ts
│ │ │ ├── canvas-cursor.ts
│ │ │ ├── case-fishbone.ts
│ │ │ ├── case-fund-flow.ts
│ │ │ ├── case-indented-tree.ts
│ │ │ ├── case-language-tree.ts
│ │ │ ├── case-mindmap.ts
│ │ │ ├── case-org-chart.ts
│ │ │ ├── case-radial-dendrogram.ts
│ │ │ ├── case-unicorns-investors.ts
│ │ │ ├── case-why-do-cats.ts
│ │ │ ├── common-graph.ts
│ │ │ ├── controller-viewport.ts
│ │ │ ├── demo-autosize-element-label.ts
│ │ │ ├── demo-supply-chains.ts
│ │ │ ├── element-change-type.ts
│ │ │ ├── element-combo.ts
│ │ │ ├── element-edge-arrow.ts
│ │ │ ├── element-edge-cubic-horizontal.ts
│ │ │ ├── element-edge-cubic-radial.ts
│ │ │ ├── element-edge-cubic-vertical.ts
│ │ │ ├── element-edge-cubic.ts
│ │ │ ├── element-edge-custom-arrow.ts
│ │ │ ├── element-edge-line.ts
│ │ │ ├── element-edge-loop-curve.ts
│ │ │ ├── element-edge-loop-polyline.ts
│ │ │ ├── element-edge-polyline-animation.ts
│ │ │ ├── element-edge-polyline-astar.ts
│ │ │ ├── element-edge-polyline-orth.ts
│ │ │ ├── element-edge-polyline.ts
│ │ │ ├── element-edge-port.ts
│ │ │ ├── element-edge-quadratic.ts
│ │ │ ├── element-edge-size.ts
│ │ │ ├── element-html-sub-graph.ts
│ │ │ ├── element-label-background.ts
│ │ │ ├── element-label-oversized.ts
│ │ │ ├── element-node-avatar.ts
│ │ │ ├── element-node-badges.ts
│ │ │ ├── element-node-circle.ts
│ │ │ ├── element-node-diamond.ts
│ │ │ ├── element-node-donut.ts
│ │ │ ├── element-node-ellipse.ts
│ │ │ ├── element-node-hexagon.ts
│ │ │ ├── element-node-html-2.ts
│ │ │ ├── element-node-html.ts
│ │ │ ├── element-node-image.ts
│ │ │ ├── element-node-rect.ts
│ │ │ ├── element-node-star.ts
│ │ │ ├── element-node-svg-icon.ts
│ │ │ ├── element-node-triangle.ts
│ │ │ ├── element-port.ts
│ │ │ ├── element-position-combo.ts
│ │ │ ├── element-position.ts
│ │ │ ├── element-state.ts
│ │ │ ├── element-visibility-part.ts
│ │ │ ├── element-visibility.ts
│ │ │ ├── element-z-index.ts
│ │ │ ├── graph-to-data-url.ts
│ │ │ ├── image-node-halo-test.ts
│ │ │ ├── index.ts
│ │ │ ├── layout-antv-dagre-flow-combo.ts
│ │ │ ├── layout-antv-dagre-flow.ts
│ │ │ ├── layout-circular-basic.ts
│ │ │ ├── layout-circular-configuration-translate.ts
│ │ │ ├── layout-circular-degree.ts
│ │ │ ├── layout-circular-division.ts
│ │ │ ├── layout-circular-spiral.ts
│ │ │ ├── layout-combo-combined.ts
│ │ │ ├── layout-compact-box-basic.ts
│ │ │ ├── layout-compact-box-left-align.ts
│ │ │ ├── layout-compact-box-top-to-bottom.ts
│ │ │ ├── layout-concentric.ts
│ │ │ ├── layout-custom-dagre.ts
│ │ │ ├── layout-custom-horizontal.ts
│ │ │ ├── layout-custom-iterative.ts
│ │ │ ├── layout-d3-force.ts
│ │ │ ├── layout-dagre.ts
│ │ │ ├── layout-dendrogram-basic.ts
│ │ │ ├── layout-dendrogram-radial.ts
│ │ │ ├── layout-dendrogram-tb.ts
│ │ │ ├── layout-fishbone.ts
│ │ │ ├── layout-force-collision.ts
│ │ │ ├── layout-force-lattice.ts
│ │ │ ├── layout-force.ts
│ │ │ ├── layout-forceatlas2-wasm.ts
│ │ │ ├── layout-fruchterman-basic.ts
│ │ │ ├── layout-fruchterman-cluster.ts
│ │ │ ├── layout-fruchterman-fix.ts
│ │ │ ├── layout-fruchterman-gpu.ts
│ │ │ ├── layout-fruchterman-wasm.ts
│ │ │ ├── layout-grid.ts
│ │ │ ├── layout-indented.ts
│ │ │ ├── layout-mds.ts
│ │ │ ├── layout-mindmap-h-custom-side.ts
│ │ │ ├── layout-mindmap-h-left.ts
│ │ │ ├── layout-mindmap-h-right.ts
│ │ │ ├── layout-mindmap-h.ts
│ │ │ ├── layout-pipeline-mds-force.ts
│ │ │ ├── layout-radial-basic.ts
│ │ │ ├── layout-radial-configuration-translate.ts
│ │ │ ├── layout-radial-prevent-overlap-unstrict.ts
│ │ │ ├── layout-radial-prevent-overlap.ts
│ │ │ ├── layout-radial-sort.ts
│ │ │ ├── layout-snake.ts
│ │ │ ├── perf-20000-elements.ts
│ │ │ ├── perf-fcp.ts
│ │ │ ├── plugin-background.ts
│ │ │ ├── plugin-bubble-sets.ts
│ │ │ ├── plugin-camera-setting.ts
│ │ │ ├── plugin-contextmenu.ts
│ │ │ ├── plugin-edge-bundling.ts
│ │ │ ├── plugin-edge-filter-lens.ts
│ │ │ ├── plugin-fisheye.ts
│ │ │ ├── plugin-fullscreen.ts
│ │ │ ├── plugin-grid-line.ts
│ │ │ ├── plugin-history.ts
│ │ │ ├── plugin-hull.ts
│ │ │ ├── plugin-legend.ts
│ │ │ ├── plugin-minimap.ts
│ │ │ ├── plugin-snapline.ts
│ │ │ ├── plugin-timebar.ts
│ │ │ ├── plugin-toolbar-build-in.ts
│ │ │ ├── plugin-toolbar-iconfont.ts
│ │ │ ├── plugin-tooltip-async.ts
│ │ │ ├── plugin-tooltip-dual.ts
│ │ │ ├── plugin-tooltip-enable.ts
│ │ │ ├── plugin-tooltip.ts
│ │ │ ├── plugin-watermark-image.ts
│ │ │ ├── plugin-watermark.ts
│ │ │ ├── theme.ts
│ │ │ ├── transform-map-node-size.ts
│ │ │ ├── transform-place-radial-labels.ts
│ │ │ ├── transform-process-parallel-edges.ts
│ │ │ └── viewport-fit.ts
│ │ ├── index.html
│ │ ├── main.ts
│ │ ├── perf-report
│ │ │ ├── 9821ed36_2024-08-22_20-39-12.json
│ │ │ ├── 9821ed36_2024-08-29_11-11-17.json
│ │ │ ├── 9821ed36_2024-08-29_13-24-51.json
│ │ │ ├── 9821ed36_2024-09-03_10-33-27.json
│ │ │ └── 9821ed36_2024-09-03_11-28-42.json
│ │ ├── perf
│ │ │ ├── data.perf.ts
│ │ │ ├── draw.perf.ts
│ │ │ ├── massive-element.perf.ts
│ │ │ └── update-state.perf.ts
│ │ ├── setup.ts
│ │ ├── snapshots
│ │ │ ├── animations
│ │ │ │ ├── element-position
│ │ │ │ │ ├── default-0.svg
│ │ │ │ │ ├── default-1000.svg
│ │ │ │ │ └── default-200.svg
│ │ │ │ ├── element-state-switch
│ │ │ │ │ ├── default-0.svg
│ │ │ │ │ ├── default-1000.svg
│ │ │ │ │ └── default-200.svg
│ │ │ │ └── element-style-position
│ │ │ │ │ ├── default-0.svg
│ │ │ │ │ ├── default-1000.svg
│ │ │ │ │ └── default-200.svg
│ │ │ ├── behaviors
│ │ │ │ ├── auto-adapt-label
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── disable.svg
│ │ │ │ │ ├── padding-60.svg
│ │ │ │ │ └── zoom-3.svg
│ │ │ │ ├── behavior-create-edge-click
│ │ │ │ │ ├── click-custom-edge4.svg
│ │ │ │ │ ├── click-edge1-move.svg
│ │ │ │ │ ├── click-edge1.svg
│ │ │ │ │ ├── click-edge2.svg
│ │ │ │ │ ├── click-edge3.svg
│ │ │ │ │ ├── click-edge4-combo.svg
│ │ │ │ │ └── default.svg
│ │ │ │ ├── behavior-create-edge-drag
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-custom-edge4.svg
│ │ │ │ │ ├── drag-edge1-move.svg
│ │ │ │ │ ├── drag-edge1.svg
│ │ │ │ │ ├── drag-edge2.svg
│ │ │ │ │ ├── drag-edge3.svg
│ │ │ │ │ └── drag-edge4-combo.svg
│ │ │ │ ├── brush-select
│ │ │ │ │ ├── brush-clear-1.svg
│ │ │ │ │ ├── brush-clear-2.svg
│ │ │ │ │ ├── brush-clear-3.svg
│ │ │ │ │ ├── brush-clear-4.svg
│ │ │ │ │ ├── brush-clear-5.svg
│ │ │ │ │ ├── brush-clear-mode-diff.svg
│ │ │ │ │ ├── brush-clear-mode-intersect.svg
│ │ │ │ │ ├── brush-clear-mode-union.svg
│ │ │ │ │ ├── brush-select-clear.svg
│ │ │ │ │ ├── brush-selected-1.svg
│ │ │ │ │ ├── brush-selected-2.svg
│ │ │ │ │ ├── brush-selected-3.svg
│ │ │ │ │ ├── brush-selected-4.svg
│ │ │ │ │ ├── brush-selected-5.svg
│ │ │ │ │ ├── brush-selected-mode-diff.svg
│ │ │ │ │ ├── brush-selected-mode-intersect.svg
│ │ │ │ │ ├── brush-selected-mode-union.svg
│ │ │ │ │ ├── brush-selecting-1.svg
│ │ │ │ │ ├── brush-selecting-2.svg
│ │ │ │ │ ├── brush-selecting-3.svg
│ │ │ │ │ ├── brush-selecting-4.svg
│ │ │ │ │ ├── brush-selecting-5.svg
│ │ │ │ │ ├── brush-selecting-mode-diff.svg
│ │ │ │ │ ├── brush-selecting-mode-intersect.svg
│ │ │ │ │ ├── brush-selecting-mode-union.svg
│ │ │ │ │ ├── brush-selecting-zoom.svg
│ │ │ │ │ └── default.svg
│ │ │ │ ├── click-select-catch
│ │ │ │ │ ├── clear.svg
│ │ │ │ │ ├── deleted.svg
│ │ │ │ │ └── selected.svg
│ │ │ │ ├── click-select
│ │ │ │ │ ├── after-deselect.svg
│ │ │ │ │ ├── after-select.svg
│ │ │ │ │ ├── custom-neighborState.svg
│ │ │ │ │ ├── custom-state.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── edge-1-degree.svg
│ │ │ │ │ ├── multiple-meta.svg
│ │ │ │ │ ├── multiple-shift.svg
│ │ │ │ │ └── node-1-degree.svg
│ │ │ │ ├── collapse-expand-combo
│ │ │ │ │ ├── collapse-combo-1-expand-combo-2-0.svg
│ │ │ │ │ ├── collapse-combo-1-expand-combo-2-1000.svg
│ │ │ │ │ ├── collapse-combo-1-expand-combo-2-500.svg
│ │ │ │ │ ├── collapse-combo-2-0.svg
│ │ │ │ │ ├── collapse-combo-2-1000.svg
│ │ │ │ │ ├── collapse-combo-2-500.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── expand-combo-1-0.svg
│ │ │ │ │ ├── expand-combo-1-1000.svg
│ │ │ │ │ └── expand-combo-1-500.svg
│ │ │ │ ├── collapse-expand-node
│ │ │ │ │ ├── collapse-A-0.svg
│ │ │ │ │ ├── collapse-A-1000.svg
│ │ │ │ │ ├── collapse-A-500.svg
│ │ │ │ │ ├── collapse-B-0.svg
│ │ │ │ │ ├── collapse-B-1000.svg
│ │ │ │ │ ├── collapse-B-500.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── expand-A-0.svg
│ │ │ │ │ ├── expand-A-1000.svg
│ │ │ │ │ ├── expand-A-500.svg
│ │ │ │ │ ├── expand-B-again-0.svg
│ │ │ │ │ ├── expand-B-again-1000.svg
│ │ │ │ │ ├── expand-B-again-500.svg
│ │ │ │ │ ├── expand-C-0.svg
│ │ │ │ │ ├── expand-C-1000.svg
│ │ │ │ │ └── expand-C-500.svg
│ │ │ │ ├── collapse-expand
│ │ │ │ │ ├── collapse-combo-2.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── expand-combo-1.svg
│ │ │ │ ├── drag-canvas
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-on-element-default.svg
│ │ │ │ │ └── drag-on-element.svg
│ │ │ │ ├── drag-element-combo
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-combo-1-after-drop-move.svg
│ │ │ │ │ ├── drag-combo-1-after-drop-out.svg
│ │ │ │ │ ├── drag-combo-1-before-drop-move.svg
│ │ │ │ │ ├── drag-combo-1-before-drop-out.svg
│ │ │ │ │ ├── drag-combo-2-after-drop-into.svg
│ │ │ │ │ ├── drag-combo-2-before-drop-into.svg
│ │ │ │ │ ├── drag-node-1-after-drop-into.svg
│ │ │ │ │ ├── drag-node-1-after-drop-move.svg
│ │ │ │ │ ├── drag-node-1-after-drop-out.svg
│ │ │ │ │ ├── drag-node-1-before-drop-into.svg
│ │ │ │ │ ├── drag-node-1-before-drop-move.svg
│ │ │ │ │ ├── drag-node-1-before-drop-out.svg
│ │ │ │ │ ├── drag-node-2-after-drop-out.svg
│ │ │ │ │ └── drag-node-2-before-drop-out.svg
│ │ │ │ ├── drag-element
│ │ │ │ │ ├── after-drag.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-combo-shadow-after-drag.svg
│ │ │ │ │ ├── drag-combo-shadow.svg
│ │ │ │ │ ├── drag-combo.svg
│ │ │ │ │ ├── hideEdge-both.svg
│ │ │ │ │ ├── hideEdge-in.svg
│ │ │ │ │ ├── hideEdge-out.svg
│ │ │ │ │ ├── shadow-after-drag.svg
│ │ │ │ │ └── shadow.svg
│ │ │ │ ├── fix-element-size
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── entire-size-0.6.svg
│ │ │ │ │ ├── entire-size-1.svg
│ │ │ │ │ ├── fontSize-0.6.svg
│ │ │ │ │ ├── fontSize-1.svg
│ │ │ │ │ ├── lineWidth-0.6.svg
│ │ │ │ │ ├── lineWidth-1.svg
│ │ │ │ │ ├── lineWidth-fontSize-0.6.svg
│ │ │ │ │ └── lineWidth-fontSize-1.svg
│ │ │ │ ├── focus-element
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── focus-combo.svg
│ │ │ │ │ ├── focus-node-1.svg
│ │ │ │ │ ├── focus-node-2.svg
│ │ │ │ │ ├── focus-node-3.svg
│ │ │ │ │ └── focus-node-4.svg
│ │ │ │ ├── hover-activate
│ │ │ │ │ ├── 1-degree-edge.svg
│ │ │ │ │ ├── 1-degree-node.svg
│ │ │ │ │ ├── 2-degree-edge.svg
│ │ │ │ │ ├── 2-degree-node.svg
│ │ │ │ │ ├── after-hover-out.svg
│ │ │ │ │ ├── after-hover.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── state.svg
│ │ │ │ ├── lasso-select
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── lasso-clear-1.svg
│ │ │ │ │ ├── lasso-clear-2.svg
│ │ │ │ │ ├── lasso-clear-3.svg
│ │ │ │ │ ├── lasso-clear-4.svg
│ │ │ │ │ ├── lasso-clear-5.svg
│ │ │ │ │ ├── lasso-clear-mode-diff.svg
│ │ │ │ │ ├── lasso-clear-mode-intersect.svg
│ │ │ │ │ ├── lasso-clear-mode-union.svg
│ │ │ │ │ ├── lasso-select-clear.svg
│ │ │ │ │ ├── lasso-selected-1.svg
│ │ │ │ │ ├── lasso-selected-2.svg
│ │ │ │ │ ├── lasso-selected-3.svg
│ │ │ │ │ ├── lasso-selected-4.svg
│ │ │ │ │ ├── lasso-selected-5.svg
│ │ │ │ │ ├── lasso-selected-mode-diff.svg
│ │ │ │ │ ├── lasso-selected-mode-intersect.svg
│ │ │ │ │ ├── lasso-selected-mode-union.svg
│ │ │ │ │ ├── lasso-selecting-1.svg
│ │ │ │ │ ├── lasso-selecting-2.svg
│ │ │ │ │ ├── lasso-selecting-3.svg
│ │ │ │ │ ├── lasso-selecting-4.svg
│ │ │ │ │ ├── lasso-selecting-5.svg
│ │ │ │ │ ├── lasso-selecting-mode-diff.svg
│ │ │ │ │ ├── lasso-selecting-mode-intersect.svg
│ │ │ │ │ └── lasso-selecting-mode-union.svg
│ │ │ │ ├── optimize-viewport-transform
│ │ │ │ │ ├── after-viewport-change.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── viewport-change-key-text.svg
│ │ │ │ │ ├── viewport-change-key.svg
│ │ │ │ │ └── viewport-change-keys.svg
│ │ │ │ ├── scroll-canvas
│ │ │ │ │ └── default.svg
│ │ │ │ └── zoom-canvas
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── mobile-final.svg
│ │ │ │ │ ├── mobile-initial.svg
│ │ │ │ │ └── zoom-to-canvas-center.svg
│ │ │ ├── bugs
│ │ │ │ ├── api-focus-element-edge
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── focusElement edge.svg
│ │ │ │ ├── behaviors-click-select-drag-node
│ │ │ │ │ ├── click-node-1-node-2.svg
│ │ │ │ │ ├── click-node-1.svg
│ │ │ │ │ ├── drag-node-1-node-2.svg
│ │ │ │ │ └── drag-node-2.svg
│ │ │ │ ├── behaviors-click-select
│ │ │ │ │ ├── add-node-2.svg
│ │ │ │ │ ├── click-node-2.svg
│ │ │ │ │ ├── multiple-shift-degree-1.svg
│ │ │ │ │ └── state-selected.svg
│ │ │ │ ├── behaviors-drag-element-combo
│ │ │ │ │ ├── drag-combo-A-over-C.svg
│ │ │ │ │ └── drag-combo-C-over-A.svg
│ │ │ │ ├── behaviors-multiple-conflict
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-canvas.svg
│ │ │ │ │ └── drag-element.svg
│ │ │ │ ├── element-combo-drag
│ │ │ │ │ ├── collapse-combo-0.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-combo-0.svg
│ │ │ │ │ └── drag-node-2.svg
│ │ │ │ ├── element-custom-state-switch
│ │ │ │ │ ├── multiple-select.svg
│ │ │ │ │ ├── multiple-unselect.svg
│ │ │ │ │ ├── multiple.svg
│ │ │ │ │ ├── single-select.svg
│ │ │ │ │ └── single.svg
│ │ │ │ ├── element-edge-update-arrow
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── update-arrow.svg
│ │ │ │ ├── element-node-icon-switch
│ │ │ │ │ ├── image-icon.svg
│ │ │ │ │ └── text-icon.svg
│ │ │ │ ├── element-node-update-badge
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── update-node-badge.svg
│ │ │ │ ├── element-orth-router
│ │ │ │ │ └── default.svg
│ │ │ │ ├── element-port-rotate
│ │ │ │ │ └── default.svg
│ │ │ │ ├── fit-view
│ │ │ │ │ ├── after-fit-center-again.svg
│ │ │ │ │ ├── after-fit-center.svg
│ │ │ │ │ ├── after-fit-view.svg
│ │ │ │ │ ├── after-wheel.svg
│ │ │ │ │ └── default.svg
│ │ │ │ ├── focus-element
│ │ │ │ │ ├── focus-after-drag.svg
│ │ │ │ │ ├── focus-before-drag.svg
│ │ │ │ │ ├── hover-after-focus.svg
│ │ │ │ │ └── hover-before-focus.svg
│ │ │ │ ├── graph-draw-after-clear
│ │ │ │ │ ├── blank.svg
│ │ │ │ │ └── default.svg
│ │ │ │ ├── model-remove-parent
│ │ │ │ │ └── default.svg
│ │ │ │ ├── plugin-hull-three-collinear-dots
│ │ │ │ │ └── default.svg
│ │ │ │ ├── plugin-minimap-combo-collapsed
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── update-collapsed-combo.svg
│ │ │ │ ├── remove-parent.svg
│ │ │ │ ├── tree-update-collapsed-node
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── update collapsed node.svg
│ │ │ │ └── utils-set-visibility
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── hidden.svg
│ │ │ │ │ └── visible.svg
│ │ │ ├── elements
│ │ │ │ ├── change-type
│ │ │ │ │ ├── change-type.svg
│ │ │ │ │ └── default.svg
│ │ │ │ ├── combo
│ │ │ │ │ ├── circle-collapse-center.svg
│ │ │ │ │ ├── circle-marker-childCount.svg
│ │ │ │ │ ├── circle-marker-custom.svg
│ │ │ │ │ ├── circle-marker-descendantCount.svg
│ │ │ │ │ ├── circle-marker-nodeCount.svg
│ │ │ │ │ ├── combo-with-position.svg
│ │ │ │ │ ├── combo-zIndex.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ └── rect-collapse-center.svg
│ │ │ │ ├── edges
│ │ │ │ │ ├── arrow
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── cubic-horizontal
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── cubic-radial
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── cubic-vertical
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── cubic
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── custom-arrow
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── line
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── loop-curve
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── loop-polyline
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── polyline-animation
│ │ │ │ │ │ ├── controlPoints.svg
│ │ │ │ │ │ ├── edge-polyline-router-has-controlPoints.svg
│ │ │ │ │ │ ├── edge-polyline-router-no-controlPoints.svg
│ │ │ │ │ │ └── radius.svg
│ │ │ │ │ ├── polyline-astar
│ │ │ │ │ │ ├── default.svg
│ │ │ │ │ │ ├── left-left.svg
│ │ │ │ │ │ ├── obstacle-move-node-1.svg
│ │ │ │ │ │ ├── obstacle-move-node-2.svg
│ │ │ │ │ │ ├── obstacle-move-node-3.svg
│ │ │ │ │ │ └── obstacle-move-node-4.svg
│ │ │ │ │ ├── polyline-orth
│ │ │ │ │ │ ├── dagre-RL.svg
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── polyline
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── port
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── quadratic
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ └── size
│ │ │ │ │ │ └── default.svg
│ │ │ │ ├── label-background
│ │ │ │ │ └── default.svg
│ │ │ │ ├── label-oversized
│ │ │ │ │ └── default.svg
│ │ │ │ ├── nodes
│ │ │ │ │ ├── avatar
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── circle
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── diamond
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── donut
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── ellipse
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── hexagon
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── image
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── rect
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ ├── star
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ └── triangle
│ │ │ │ │ │ └── default.svg
│ │ │ │ ├── port
│ │ │ │ │ ├── port_hidden.svg
│ │ │ │ │ ├── port_linkToCenter.svg
│ │ │ │ │ └── port_show.svg
│ │ │ │ ├── position-combo
│ │ │ │ │ └── default.svg
│ │ │ │ ├── position
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── translateElementBy-single.svg
│ │ │ │ │ ├── translateElementBy.svg
│ │ │ │ │ ├── translateElementTo-single.svg
│ │ │ │ │ └── translateElementTo.svg
│ │ │ │ ├── state
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── setState-single-default.svg
│ │ │ │ │ ├── setState-single.svg
│ │ │ │ │ └── setState.svg
│ │ │ │ ├── visibility
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── hide-single.svg
│ │ │ │ │ ├── hide.svg
│ │ │ │ │ ├── show-and-hide.svg
│ │ │ │ │ ├── show-single.svg
│ │ │ │ │ └── show.svg
│ │ │ │ └── z-index
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-combo-1.svg
│ │ │ │ │ ├── drag-combo-2.svg
│ │ │ │ │ ├── drag-combo-3.svg
│ │ │ │ │ ├── drag-overlap-combo-3.svg
│ │ │ │ │ ├── drag-overlap-combo-4(1).svg
│ │ │ │ │ ├── drag-overlap-combo-4(2).svg
│ │ │ │ │ ├── drag-overlap-combo-4(3).svg
│ │ │ │ │ ├── drag-overlap-node-1.svg
│ │ │ │ │ ├── drag-overlap-node-2.svg
│ │ │ │ │ └── drag-overlap-node-3.svg
│ │ │ ├── layouts
│ │ │ │ ├── circular
│ │ │ │ │ ├── basic.svg
│ │ │ │ │ ├── configuration-translate-division.svg
│ │ │ │ │ ├── configuration-translate.svg
│ │ │ │ │ ├── degree.svg
│ │ │ │ │ ├── division.svg
│ │ │ │ │ └── spiral.svg
│ │ │ │ ├── combo-layout
│ │ │ │ │ └── combined.svg
│ │ │ │ ├── compact-box
│ │ │ │ │ ├── basic.svg
│ │ │ │ │ ├── left-align.svg
│ │ │ │ │ └── top-to-bottom.svg
│ │ │ │ ├── concentric
│ │ │ │ │ └── default.svg
│ │ │ │ ├── custom-dagre
│ │ │ │ │ └── default.svg
│ │ │ │ ├── custom-layout-horizontal
│ │ │ │ │ └── default.svg
│ │ │ │ ├── d3-force-collision
│ │ │ │ │ └── default.svg
│ │ │ │ ├── d3-force-lattice
│ │ │ │ │ └── default.svg
│ │ │ │ ├── d3-force
│ │ │ │ │ └── default.svg
│ │ │ │ ├── dagre
│ │ │ │ │ ├── antv-flow-combo.svg
│ │ │ │ │ ├── antv-flow.svg
│ │ │ │ │ └── dagre.svg
│ │ │ │ ├── dendrogram
│ │ │ │ │ ├── basic.svg
│ │ │ │ │ └── tb.svg
│ │ │ │ ├── fishbone
│ │ │ │ │ ├── direction-LR.svg
│ │ │ │ │ ├── direction-RL.svg
│ │ │ │ │ └── vGap-32-hGap-32.svg
│ │ │ │ ├── fruchterman
│ │ │ │ │ ├── basic.svg
│ │ │ │ │ └── cluster.svg
│ │ │ │ ├── grid
│ │ │ │ │ ├── sortby-default.svg
│ │ │ │ │ └── sortby-id.svg
│ │ │ │ ├── indented
│ │ │ │ │ └── default.svg
│ │ │ │ ├── mds
│ │ │ │ │ └── ld100.svg
│ │ │ │ ├── mindmap
│ │ │ │ │ ├── h-custom-side.svg
│ │ │ │ │ ├── h-left.svg
│ │ │ │ │ ├── h-right.svg
│ │ │ │ │ └── h.svg
│ │ │ │ ├── pipeline
│ │ │ │ │ └── layout-pipeline-mds-force.svg
│ │ │ │ ├── radial-layout
│ │ │ │ │ ├── basic.svg
│ │ │ │ │ ├── configuration-translate.svg
│ │ │ │ │ ├── prevent-overlap-unstrict.svg
│ │ │ │ │ ├── prevent-overlap.svg
│ │ │ │ │ └── sort.svg
│ │ │ │ └── snake
│ │ │ │ │ ├── anti-clockwise.svg
│ │ │ │ │ ├── cols-1.svg
│ │ │ │ │ ├── cols-20.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── gap-50.svg
│ │ │ │ │ └── padding-20.svg
│ │ │ ├── plugins
│ │ │ │ ├── bubble-sets
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── element-position-update.svg
│ │ │ │ │ ├── member-add.svg
│ │ │ │ │ ├── member-remove.svg
│ │ │ │ │ ├── member-update.svg
│ │ │ │ │ ├── non-member-add.svg
│ │ │ │ │ ├── non-member-remove.svg
│ │ │ │ │ ├── non-member-update.svg
│ │ │ │ │ └── options-update.svg
│ │ │ │ ├── edge-bundling
│ │ │ │ │ └── default.svg
│ │ │ │ ├── edge-filter-lens
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── lens-style.svg
│ │ │ │ │ ├── move-lens-click-1.svg
│ │ │ │ │ ├── move-lens-click-2.svg
│ │ │ │ │ ├── move-lens-drag.svg
│ │ │ │ │ ├── move-lens-pointermove.svg
│ │ │ │ │ ├── node-type-either.svg
│ │ │ │ │ ├── node-type-source.svg
│ │ │ │ │ ├── node-type-target.svg
│ │ │ │ │ ├── scale-larger.svg
│ │ │ │ │ └── scale-smaller.svg
│ │ │ │ ├── fisheye
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── hide-D-percent.svg
│ │ │ │ │ ├── lens-style.svg
│ │ │ │ │ ├── move-lens-click-1.svg
│ │ │ │ │ ├── move-lens-click-2.svg
│ │ │ │ │ ├── move-lens-drag.svg
│ │ │ │ │ ├── move-lens-pointermove.svg
│ │ │ │ │ ├── node-style.svg
│ │ │ │ │ ├── scale-D-drag-larger.svg
│ │ │ │ │ ├── scale-D-drag-smaller.svg
│ │ │ │ │ ├── scale-D-wheel-larger.svg
│ │ │ │ │ ├── scale-D-wheel-smaller.svg
│ │ │ │ │ ├── scale-R-drag-larger.svg
│ │ │ │ │ ├── scale-R-drag-smaller.svg
│ │ │ │ │ ├── scale-R-wheel-larger.svg
│ │ │ │ │ └── scale-R-wheel-smaller.svg
│ │ │ │ ├── history
│ │ │ │ │ └── plugin-history
│ │ │ │ │ │ ├── addData-redo.svg
│ │ │ │ │ │ ├── addData-undo.svg
│ │ │ │ │ │ ├── addData.svg
│ │ │ │ │ │ ├── collapse-redo.svg
│ │ │ │ │ │ ├── collapse-undo.svg
│ │ │ │ │ │ ├── collapse.svg
│ │ │ │ │ │ ├── create-edge-redo.svg
│ │ │ │ │ │ ├── create-edge-undo.svg
│ │ │ │ │ │ ├── create-edge.svg
│ │ │ │ │ │ ├── deleteData-redo.svg
│ │ │ │ │ │ ├── deleteData-undo.svg
│ │ │ │ │ │ ├── deleteData.svg
│ │ │ │ │ │ ├── expand-redo.svg
│ │ │ │ │ │ ├── expand-undo.svg
│ │ │ │ │ │ ├── expand.svg
│ │ │ │ │ │ ├── hideElement-redo.svg
│ │ │ │ │ │ ├── hideElement-undo.svg
│ │ │ │ │ │ ├── hideElement.svg
│ │ │ │ │ │ ├── setElementZIndex-redo.svg
│ │ │ │ │ │ ├── setElementZIndex-undo.svg
│ │ │ │ │ │ ├── setElementZIndex.svg
│ │ │ │ │ │ ├── setElementsState-redo.svg
│ │ │ │ │ │ ├── setElementsState-undo.svg
│ │ │ │ │ │ ├── setElementsState.svg
│ │ │ │ │ │ ├── updateData-redo.svg
│ │ │ │ │ │ ├── updateData-undo.svg
│ │ │ │ │ │ └── updateData.svg
│ │ │ │ ├── hull
│ │ │ │ │ └── plugin-hull
│ │ │ │ │ │ ├── addMember__node3.svg
│ │ │ │ │ │ ├── corner__rounded.svg
│ │ │ │ │ │ ├── corner__sharp.svg
│ │ │ │ │ │ ├── corner__smooth.svg
│ │ │ │ │ │ ├── default.svg
│ │ │ │ │ │ ├── emptyMembers.svg
│ │ │ │ │ │ ├── labelAutoRotate__false.svg
│ │ │ │ │ │ ├── labelAutoRotate__true.svg
│ │ │ │ │ │ ├── labelCloseToHull__false.svg
│ │ │ │ │ │ ├── labelCloseToHull__true.svg
│ │ │ │ │ │ ├── labelPlacement__bottom.svg
│ │ │ │ │ │ ├── labelPlacement__left.svg
│ │ │ │ │ │ ├── labelPlacement__right.svg
│ │ │ │ │ │ ├── labelPlacement__top.svg
│ │ │ │ │ │ ├── padding__0.svg
│ │ │ │ │ │ ├── padding__20.svg
│ │ │ │ │ │ ├── removeMember__node1.svg
│ │ │ │ │ │ ├── updateMember.svg
│ │ │ │ │ │ └── updateMember__position.svg
│ │ │ │ ├── legend
│ │ │ │ │ ├── click-again.svg
│ │ │ │ │ ├── click.svg
│ │ │ │ │ ├── mouseenter.svg
│ │ │ │ │ ├── mouseleave.svg
│ │ │ │ │ └── normal.svg
│ │ │ │ ├── snapline
│ │ │ │ │ ├── auto-snap.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── drag-node3-horizontal-0.svg
│ │ │ │ │ ├── drag-node3-horizontal-1.svg
│ │ │ │ │ ├── drag-node3-horizontal-10.svg
│ │ │ │ │ ├── drag-node3-horizontal-2.svg
│ │ │ │ │ ├── drag-node3-horizontal-3.svg
│ │ │ │ │ ├── drag-node3-horizontal-4.svg
│ │ │ │ │ ├── drag-node3-horizontal-5.svg
│ │ │ │ │ ├── drag-node3-horizontal-6.svg
│ │ │ │ │ ├── drag-node3-horizontal-7.svg
│ │ │ │ │ ├── drag-node3-horizontal-8.svg
│ │ │ │ │ ├── drag-node3-horizontal-9.svg
│ │ │ │ │ ├── drag-node3-vertical-0.svg
│ │ │ │ │ ├── drag-node3-vertical-1.svg
│ │ │ │ │ ├── drag-node3-vertical-10.svg
│ │ │ │ │ ├── drag-node3-vertical-11.svg
│ │ │ │ │ ├── drag-node3-vertical-2.svg
│ │ │ │ │ ├── drag-node3-vertical-3.svg
│ │ │ │ │ ├── drag-node3-vertical-4.svg
│ │ │ │ │ ├── drag-node3-vertical-5.svg
│ │ │ │ │ ├── drag-node3-vertical-6.svg
│ │ │ │ │ ├── drag-node3-vertical-7.svg
│ │ │ │ │ ├── drag-node3-vertical-8.svg
│ │ │ │ │ ├── drag-node3-vertical-9.svg
│ │ │ │ │ ├── filter-node2.svg
│ │ │ │ │ ├── offset-infinity.svg
│ │ │ │ │ └── zoom-5.svg
│ │ │ │ ├── timebar
│ │ │ │ │ ├── backward-1-time-modify.svg
│ │ │ │ │ ├── backward-1-time-visibility.svg
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── forward-1-time-modify.svg
│ │ │ │ │ ├── forward-1-time-visibility.svg
│ │ │ │ │ ├── forward-2-time-modify.svg
│ │ │ │ │ ├── play-1-time-modify.svg
│ │ │ │ │ ├── play-2-time-modify.svg
│ │ │ │ │ ├── reset-modify.svg
│ │ │ │ │ └── reset-visibility.svg
│ │ │ │ └── tooltip
│ │ │ │ │ ├── combo.svg
│ │ │ │ │ ├── edge.svg
│ │ │ │ │ ├── hover.svg
│ │ │ │ │ ├── node.svg
│ │ │ │ │ └── show-tooltip-by-id.svg
│ │ │ ├── runtime
│ │ │ │ ├── element
│ │ │ │ │ ├── default.svg
│ │ │ │ │ ├── visibility
│ │ │ │ │ │ ├── hidden.svg
│ │ │ │ │ │ └── visible.svg
│ │ │ │ │ └── z-index
│ │ │ │ │ │ ├── default.svg
│ │ │ │ │ │ └── front.svg
│ │ │ │ ├── graph
│ │ │ │ │ ├── add-children-data
│ │ │ │ │ │ ├── add-children-data.svg
│ │ │ │ │ │ └── default.svg
│ │ │ │ │ └── graph
│ │ │ │ │ │ ├── after-draw.svg
│ │ │ │ │ │ ├── after-layout.svg
│ │ │ │ │ │ ├── after-rotate-90.svg
│ │ │ │ │ │ ├── after-translate-node-1.svg
│ │ │ │ │ │ ├── after-translate.svg
│ │ │ │ │ │ ├── after-zoom-2.svg
│ │ │ │ │ │ ├── before-draw.svg
│ │ │ │ │ │ └── before-layout.svg
│ │ │ │ ├── layout
│ │ │ │ │ ├── empty.svg
│ │ │ │ │ ├── extra.svg
│ │ │ │ │ ├── layout-array.svg
│ │ │ │ │ ├── other-type.svg
│ │ │ │ │ └── recover.svg
│ │ │ │ └── viewport
│ │ │ │ │ ├── auto-fit-with-padding-animation.svg
│ │ │ │ │ ├── auto-fit-with-padding.svg
│ │ │ │ │ ├── before-fit-animation.svg
│ │ │ │ │ ├── before-fit.svg
│ │ │ │ │ ├── fitCenter-animation.svg
│ │ │ │ │ ├── fitCenter.svg
│ │ │ │ │ ├── fitView-animation.svg
│ │ │ │ │ ├── fitView.svg
│ │ │ │ │ ├── focusElement-animation.svg
│ │ │ │ │ ├── focusElement.svg
│ │ │ │ │ ├── re-fitCenter-animation.svg
│ │ │ │ │ ├── re-fitCenter.svg
│ │ │ │ │ ├── re-focusElement-animation.svg
│ │ │ │ │ ├── re-focusElement.svg
│ │ │ │ │ ├── rotate-135.svg
│ │ │ │ │ ├── rotate-90.svg
│ │ │ │ │ ├── translate.svg
│ │ │ │ │ ├── with-lineWidth.svg
│ │ │ │ │ ├── zoom-0.5.svg
│ │ │ │ │ └── zoom-2.svg
│ │ │ ├── spec
│ │ │ │ └── theme
│ │ │ │ │ └── theme_node_palette_spectral.svg
│ │ │ └── transforms
│ │ │ │ ├── transform-map-node-size
│ │ │ │ ├── default.svg
│ │ │ │ └── label-size.svg
│ │ │ │ ├── transform-position-radial-labels
│ │ │ │ └── default.svg
│ │ │ │ └── transform-process-parallel-edges
│ │ │ │ ├── bundle-add-orange-edge__after.svg
│ │ │ │ ├── bundle-add-orange-edge__before.svg
│ │ │ │ ├── bundle-mode.svg
│ │ │ │ ├── bundle-remove-purple-edge__after.svg
│ │ │ │ ├── bundle-remove-purple-edge__before.svg
│ │ │ │ ├── bundle-update-orange-edge__after.svg
│ │ │ │ ├── bundle-update-orange-edge__before.svg
│ │ │ │ └── merge-mode.svg
│ │ ├── types.d.ts
│ │ ├── unit
│ │ │ ├── animations
│ │ │ │ ├── element-position.spec.ts
│ │ │ │ ├── element-state-switch.spec.ts
│ │ │ │ └── element-style-position.spec.ts
│ │ │ ├── behaviors
│ │ │ │ ├── auto-adapt-label.spec.ts
│ │ │ │ ├── behavior-create-edge-click.spec.ts
│ │ │ │ ├── behavior-create-edge-drag.spec.ts
│ │ │ │ ├── brush-select.spec.ts
│ │ │ │ ├── click-select-catch.spec.ts
│ │ │ │ ├── click-select.spec.ts
│ │ │ │ ├── collapse-expand-combo.spec.ts
│ │ │ │ ├── collapse-expand-node.spec.ts
│ │ │ │ ├── collapse-expand.spec.ts
│ │ │ │ ├── drag-canvas.spec.ts
│ │ │ │ ├── drag-element-bug.spec.ts
│ │ │ │ ├── drag-element-combo.spec.ts
│ │ │ │ ├── drag-element.spec.ts
│ │ │ │ ├── fix-element-size.spec.ts
│ │ │ │ ├── focus-element.spec.ts
│ │ │ │ ├── hover-activate.spec.ts
│ │ │ │ ├── lasso-select.spec.ts
│ │ │ │ ├── optimize-viewport-transform.spec.ts
│ │ │ │ ├── scroll-canvas.spec.ts
│ │ │ │ └── zoom-canvas.spec.ts
│ │ │ ├── default.spec.ts
│ │ │ ├── elements
│ │ │ │ ├── change-type.spec.ts
│ │ │ │ ├── combo.spec.ts
│ │ │ │ ├── edges
│ │ │ │ │ ├── arrow.spec.ts
│ │ │ │ │ ├── cubic-horizontal.spec.ts
│ │ │ │ │ ├── cubic-radial.spec.ts
│ │ │ │ │ ├── cubic-vertical.spec.ts
│ │ │ │ │ ├── cubic.spec.ts
│ │ │ │ │ ├── custom-arrow.spec.ts
│ │ │ │ │ ├── line.spec.ts
│ │ │ │ │ ├── loop-curve.spec.ts
│ │ │ │ │ ├── loop-polyline.spec.ts
│ │ │ │ │ ├── polyline-animation.spec.ts
│ │ │ │ │ ├── polyline-astar.spec.ts
│ │ │ │ │ ├── polyline-orth.spec.ts
│ │ │ │ │ ├── polyline.spec.ts
│ │ │ │ │ ├── port.spec.ts
│ │ │ │ │ ├── quadratic.spec.ts
│ │ │ │ │ └── size.spec.ts
│ │ │ │ ├── label-background.spec.ts
│ │ │ │ ├── label-oversized.spec.ts
│ │ │ │ ├── nodes
│ │ │ │ │ ├── avatar.spec.ts
│ │ │ │ │ ├── circle.spec.ts
│ │ │ │ │ ├── diamond.spec.ts
│ │ │ │ │ ├── donut.spec.ts
│ │ │ │ │ ├── ellipse.spec.ts
│ │ │ │ │ ├── hexagon.spec.ts
│ │ │ │ │ ├── image.spec.ts
│ │ │ │ │ ├── rect.spec.ts
│ │ │ │ │ ├── star.spec.ts
│ │ │ │ │ └── triangle.spec.ts
│ │ │ │ ├── override-methods.spec.ts
│ │ │ │ ├── port.spec.ts
│ │ │ │ ├── position-combo.spec.ts
│ │ │ │ ├── position.spec.ts
│ │ │ │ ├── shape.spec.ts
│ │ │ │ ├── state.spec.ts
│ │ │ │ ├── visibility.spec.ts
│ │ │ │ └── z-index.spec.ts
│ │ │ ├── import.spec.ts
│ │ │ ├── layouts
│ │ │ │ ├── circular.spec.ts
│ │ │ │ ├── combo-layout.spec.ts
│ │ │ │ ├── compact-box.spec.ts
│ │ │ │ ├── concentric.spec.ts
│ │ │ │ ├── custom-dagre.spec.ts
│ │ │ │ ├── custom-layout-horizontal.spec.ts
│ │ │ │ ├── d3-force-collision.spec.ts
│ │ │ │ ├── d3-force-lattice.spec.ts
│ │ │ │ ├── d3-force.spec.ts
│ │ │ │ ├── dagre.spec.ts
│ │ │ │ ├── dendrogram.spec.ts
│ │ │ │ ├── fishbone.spec.ts
│ │ │ │ ├── fruchterman.spec.ts
│ │ │ │ ├── grid.spec.ts
│ │ │ │ ├── indented.spec.ts
│ │ │ │ ├── mds.spec.ts
│ │ │ │ ├── mindmap.spec.ts
│ │ │ │ ├── pipeline.spec.ts
│ │ │ │ ├── radial-layout.spec.ts
│ │ │ │ └── snake.spec.ts
│ │ │ ├── plugins
│ │ │ │ ├── background.spec.ts
│ │ │ │ ├── bubble-sets.spec.ts
│ │ │ │ ├── camera-setting.spec.ts
│ │ │ │ ├── contextmenu.spec.ts
│ │ │ │ ├── edge-bundling.spec.ts
│ │ │ │ ├── edge-filter-lens.spec.ts
│ │ │ │ ├── fisheye.spec.ts
│ │ │ │ ├── grid-line.spec.ts
│ │ │ │ ├── history
│ │ │ │ │ ├── plugin-history.spec.ts
│ │ │ │ │ └── utils.spec.ts
│ │ │ │ ├── hull
│ │ │ │ │ ├── plugin-hull.spec.ts
│ │ │ │ │ └── util.spec.ts
│ │ │ │ ├── legend.spec.ts
│ │ │ │ ├── snapline.spec.ts
│ │ │ │ ├── timebar.spec.ts
│ │ │ │ ├── toolbar
│ │ │ │ │ ├── plugin-toolbar.spec.ts
│ │ │ │ │ └── util.spec.ts
│ │ │ │ ├── tooltip.spec.ts
│ │ │ │ ├── utils
│ │ │ │ │ └── dom.spec.ts
│ │ │ │ └── watermark.spec.ts
│ │ │ ├── registry.spec.ts
│ │ │ ├── runtime
│ │ │ │ ├── canvas.spec.ts
│ │ │ │ ├── data.spec.ts
│ │ │ │ ├── element.spec.ts
│ │ │ │ ├── element
│ │ │ │ │ ├── event.spec.ts
│ │ │ │ │ ├── state.spec.ts
│ │ │ │ │ ├── visibility.spec.ts
│ │ │ │ │ └── z-index.spec.ts
│ │ │ │ ├── graph
│ │ │ │ │ ├── add-children-data.spec.ts
│ │ │ │ │ ├── auto-resize.spec.ts
│ │ │ │ │ ├── event.spec.ts
│ │ │ │ │ ├── get-plugin-instantce.spec.ts
│ │ │ │ │ ├── graph.spec.ts
│ │ │ │ │ └── this.spec.ts
│ │ │ │ ├── layout.spec.ts
│ │ │ │ └── viewport.spec.ts
│ │ │ ├── spec
│ │ │ │ ├── behavior.spec.ts
│ │ │ │ ├── canvas.spec.ts
│ │ │ │ ├── data.spec.ts
│ │ │ │ ├── element
│ │ │ │ │ ├── combo.spec.ts
│ │ │ │ │ ├── edge.spec.ts
│ │ │ │ │ └── node.spec.ts
│ │ │ │ ├── index.spec.ts
│ │ │ │ ├── layout.spec.ts
│ │ │ │ ├── optimize.spec.ts
│ │ │ │ ├── plugin.spec.ts
│ │ │ │ ├── theme.spec.ts
│ │ │ │ └── viewport.spec.ts
│ │ │ ├── themes
│ │ │ │ └── base.spec.ts
│ │ │ ├── transforms
│ │ │ │ ├── base-transform.spec.ts
│ │ │ │ ├── transform-map-node-size.spec.ts
│ │ │ │ ├── transform-position-radial-labels.spec.ts
│ │ │ │ └── transform-process-parallel-edges.spec.ts
│ │ │ ├── utils
│ │ │ │ ├── anchor.spec.ts
│ │ │ │ ├── animation.spec.ts
│ │ │ │ ├── array.spec.ts
│ │ │ │ ├── bbox.spec.ts
│ │ │ │ ├── cache.spec.ts
│ │ │ │ ├── change.spec.ts
│ │ │ │ ├── collapsibility.spec.ts
│ │ │ │ ├── contextmenu.spec.ts
│ │ │ │ ├── data.spec.ts
│ │ │ │ ├── diff.spec.ts
│ │ │ │ ├── dom.spec.ts
│ │ │ │ ├── edge.spec.ts
│ │ │ │ ├── element.spec.ts
│ │ │ │ ├── event.spec.ts
│ │ │ │ ├── extension.spec.ts
│ │ │ │ ├── graphlib.spec.ts
│ │ │ │ ├── id.spec.ts
│ │ │ │ ├── is.spec.ts
│ │ │ │ ├── layout.spec.ts
│ │ │ │ ├── line.spec.ts
│ │ │ │ ├── math.spec.ts
│ │ │ │ ├── padding.spec.ts
│ │ │ │ ├── palette.spec.ts
│ │ │ │ ├── path.spec.ts
│ │ │ │ ├── placement.spec.ts
│ │ │ │ ├── point.spec.ts
│ │ │ │ ├── polygon.spec.ts
│ │ │ │ ├── position.spec.ts
│ │ │ │ ├── prefix.spec.ts
│ │ │ │ ├── print.spec.ts
│ │ │ │ ├── random.spec.ts
│ │ │ │ ├── relation.spec.ts
│ │ │ │ ├── router.spec.ts
│ │ │ │ ├── scale.spec.ts
│ │ │ │ ├── shape.spec.ts
│ │ │ │ ├── shortcut.spec.ts
│ │ │ │ ├── size.spec.ts
│ │ │ │ ├── state.spec.ts
│ │ │ │ ├── style.spec.ts
│ │ │ │ ├── symbol.spec.ts
│ │ │ │ ├── text.spec.ts
│ │ │ │ ├── theme.spec.ts
│ │ │ │ ├── traverse.spec.ts
│ │ │ │ ├── tree.spec.ts
│ │ │ │ ├── vector.spec.ts
│ │ │ │ ├── visibility.spec.ts
│ │ │ │ └── z-index.spec.ts
│ │ │ └── version.spec.ts
│ │ └── utils
│ │ │ ├── canvas.ts
│ │ │ ├── create.ts
│ │ │ ├── dir.ts
│ │ │ ├── dom.ts
│ │ │ ├── index.ts
│ │ │ ├── offscreen-canvas-context.ts
│ │ │ ├── random.ts
│ │ │ ├── sleep.ts
│ │ │ ├── svg-transformer.js
│ │ │ ├── to-be-close-to.ts
│ │ │ ├── to-match-svg-snapshot.ts
│ │ │ └── use-snapshot-matchers.ts
│ ├── jest.config.js
│ ├── package.json
│ ├── perf.config.js
│ ├── rollup.config.mjs
│ ├── scripts
│ │ ├── tag.mjs
│ │ └── version.mjs
│ ├── src
│ │ ├── animations
│ │ │ ├── executor.ts
│ │ │ ├── index.ts
│ │ │ └── types.ts
│ │ ├── behaviors
│ │ │ ├── auto-adapt-label.ts
│ │ │ ├── base-behavior.ts
│ │ │ ├── brush-select.ts
│ │ │ ├── click-select.ts
│ │ │ ├── collapse-expand.ts
│ │ │ ├── create-edge.ts
│ │ │ ├── drag-canvas.ts
│ │ │ ├── drag-element-force.ts
│ │ │ ├── drag-element.ts
│ │ │ ├── fix-element-size.ts
│ │ │ ├── focus-element.ts
│ │ │ ├── hover-activate.ts
│ │ │ ├── index.ts
│ │ │ ├── lasso-select.ts
│ │ │ ├── optimize-viewport-transform.ts
│ │ │ ├── scroll-canvas.ts
│ │ │ ├── types.ts
│ │ │ └── zoom-canvas.ts
│ │ ├── constants
│ │ │ ├── animation.ts
│ │ │ ├── change.ts
│ │ │ ├── element.ts
│ │ │ ├── events
│ │ │ │ ├── animation.ts
│ │ │ │ ├── canvas.ts
│ │ │ │ ├── combo.ts
│ │ │ │ ├── common.ts
│ │ │ │ ├── container.ts
│ │ │ │ ├── edge.ts
│ │ │ │ ├── graph.ts
│ │ │ │ ├── history.ts
│ │ │ │ ├── index.ts
│ │ │ │ └── node.ts
│ │ │ ├── graphlib.ts
│ │ │ ├── index.ts
│ │ │ └── registry.ts
│ │ ├── elements
│ │ │ ├── base-element.ts
│ │ │ ├── combos
│ │ │ │ ├── base-combo.ts
│ │ │ │ ├── circle.ts
│ │ │ │ ├── index.ts
│ │ │ │ └── rect.ts
│ │ │ ├── edges
│ │ │ │ ├── base-edge.ts
│ │ │ │ ├── cubic-horizontal.ts
│ │ │ │ ├── cubic-radial.ts
│ │ │ │ ├── cubic-vertical.ts
│ │ │ │ ├── cubic.ts
│ │ │ │ ├── index.ts
│ │ │ │ ├── line.ts
│ │ │ │ ├── polyline.ts
│ │ │ │ └── quadratic.ts
│ │ │ ├── effect.ts
│ │ │ ├── index.ts
│ │ │ ├── nodes
│ │ │ │ ├── base-node.ts
│ │ │ │ ├── circle.ts
│ │ │ │ ├── diamond.ts
│ │ │ │ ├── donut.ts
│ │ │ │ ├── ellipse.ts
│ │ │ │ ├── hexagon.ts
│ │ │ │ ├── html.ts
│ │ │ │ ├── image.ts
│ │ │ │ ├── index.ts
│ │ │ │ ├── rect.ts
│ │ │ │ ├── star.ts
│ │ │ │ └── triangle.ts
│ │ │ └── shapes
│ │ │ │ ├── badge.ts
│ │ │ │ ├── base-shape.ts
│ │ │ │ ├── contour.ts
│ │ │ │ ├── icon.ts
│ │ │ │ ├── image.ts
│ │ │ │ ├── index.ts
│ │ │ │ ├── label.ts
│ │ │ │ └── polygon.ts
│ │ ├── exports.ts
│ │ ├── global.d.ts
│ │ ├── index.ts
│ │ ├── layouts
│ │ │ ├── base-layout.ts
│ │ │ ├── fishbone.ts
│ │ │ ├── hierarchy.d.ts
│ │ │ ├── index.ts
│ │ │ ├── snake.ts
│ │ │ └── types.ts
│ │ ├── palettes
│ │ │ ├── index.ts
│ │ │ └── types.ts
│ │ ├── plugins
│ │ │ ├── background
│ │ │ │ └── index.ts
│ │ │ ├── base-plugin.ts
│ │ │ ├── bubble-sets.ts
│ │ │ ├── camera-setting.ts
│ │ │ ├── contextmenu
│ │ │ │ ├── index.ts
│ │ │ │ └── util.ts
│ │ │ ├── edge-bundling
│ │ │ │ └── index.ts
│ │ │ ├── edge-filter-lens
│ │ │ │ └── index.ts
│ │ │ ├── fisheye
│ │ │ │ └── index.ts
│ │ │ ├── fullscreen
│ │ │ │ └── index.ts
│ │ │ ├── grid-line.ts
│ │ │ ├── history
│ │ │ │ ├── index.ts
│ │ │ │ └── util.ts
│ │ │ ├── hull
│ │ │ │ ├── hull
│ │ │ │ │ ├── README.md
│ │ │ │ │ ├── format.ts
│ │ │ │ │ ├── grid_handle.ts
│ │ │ │ │ ├── index.ts
│ │ │ │ │ ├── monotone-convex-hull-2d.ts
│ │ │ │ │ ├── robust-orientation.ts
│ │ │ │ │ ├── robust-scale.ts
│ │ │ │ │ ├── robust-segment-intersect.ts
│ │ │ │ │ ├── robust-subtract.ts
│ │ │ │ │ ├── robust-sum.ts
│ │ │ │ │ ├── two-product.ts
│ │ │ │ │ └── two-sum.ts
│ │ │ │ ├── index.ts
│ │ │ │ └── util.ts
│ │ │ ├── index.ts
│ │ │ ├── legend.ts
│ │ │ ├── minimap
│ │ │ │ └── index.ts
│ │ │ ├── snapline
│ │ │ │ └── index.ts
│ │ │ ├── timebar.ts
│ │ │ ├── toolbar
│ │ │ │ ├── index.ts
│ │ │ │ └── util.ts
│ │ │ ├── tooltip.ts
│ │ │ ├── types.ts
│ │ │ ├── utils
│ │ │ │ ├── canvas.ts
│ │ │ │ └── dom.ts
│ │ │ └── watermark
│ │ │ │ ├── index.ts
│ │ │ │ └── util.ts
│ │ ├── preset.ts
│ │ ├── registry
│ │ │ ├── build-in.ts
│ │ │ ├── extension
│ │ │ │ ├── index.ts
│ │ │ │ └── types.ts
│ │ │ ├── get.ts
│ │ │ ├── register.ts
│ │ │ ├── store.ts
│ │ │ └── types.ts
│ │ ├── runtime
│ │ │ ├── animation.ts
│ │ │ ├── batch.ts
│ │ │ ├── behavior.ts
│ │ │ ├── canvas.ts
│ │ │ ├── data.ts
│ │ │ ├── element.ts
│ │ │ ├── graph.ts
│ │ │ ├── layout.ts
│ │ │ ├── options.ts
│ │ │ ├── plugin.ts
│ │ │ ├── transform.ts
│ │ │ ├── types.ts
│ │ │ └── viewport.ts
│ │ ├── spec
│ │ │ ├── behavior.ts
│ │ │ ├── canvas.ts
│ │ │ ├── data.ts
│ │ │ ├── element
│ │ │ │ ├── animation.ts
│ │ │ │ ├── combo.ts
│ │ │ │ ├── edge.ts
│ │ │ │ ├── node.ts
│ │ │ │ └── palette.ts
│ │ │ ├── graph.ts
│ │ │ ├── index.ts
│ │ │ ├── layout.ts
│ │ │ ├── plugin.ts
│ │ │ ├── theme.ts
│ │ │ ├── transform.ts
│ │ │ └── viewport.ts
│ │ ├── themes
│ │ │ ├── base.ts
│ │ │ ├── dark.ts
│ │ │ ├── index.ts
│ │ │ ├── light.ts
│ │ │ └── types.ts
│ │ ├── transforms
│ │ │ ├── arrange-draw-order.ts
│ │ │ ├── base-transform.ts
│ │ │ ├── collapse-expand-combo.ts
│ │ │ ├── collapse-expand-node.ts
│ │ │ ├── get-edge-actual-ends.ts
│ │ │ ├── index.ts
│ │ │ ├── map-node-size.ts
│ │ │ ├── place-radial-labels.ts
│ │ │ ├── process-parallel-edges.ts
│ │ │ ├── types.ts
│ │ │ ├── update-related-edge.ts
│ │ │ └── utils.ts
│ │ ├── types
│ │ │ ├── anchor.ts
│ │ │ ├── animation.ts
│ │ │ ├── canvas.ts
│ │ │ ├── centrality.ts
│ │ │ ├── change.ts
│ │ │ ├── combo.ts
│ │ │ ├── data.ts
│ │ │ ├── edge.ts
│ │ │ ├── element.ts
│ │ │ ├── enum.ts
│ │ │ ├── event.ts
│ │ │ ├── graphlib.ts
│ │ │ ├── history.ts
│ │ │ ├── id.ts
│ │ │ ├── index.ts
│ │ │ ├── layout.ts
│ │ │ ├── node.ts
│ │ │ ├── padding.ts
│ │ │ ├── placement.ts
│ │ │ ├── plugin.ts
│ │ │ ├── point.ts
│ │ │ ├── prefix.ts
│ │ │ ├── router.ts
│ │ │ ├── size.ts
│ │ │ ├── state.ts
│ │ │ ├── style.ts
│ │ │ ├── tree.ts
│ │ │ ├── vector.ts
│ │ │ └── viewport.ts
│ │ ├── utils
│ │ │ ├── anchor.ts
│ │ │ ├── animation.ts
│ │ │ ├── array.ts
│ │ │ ├── bbox.ts
│ │ │ ├── cache.ts
│ │ │ ├── centrality.ts
│ │ │ ├── change.ts
│ │ │ ├── collapsibility.ts
│ │ │ ├── data.ts
│ │ │ ├── diff.ts
│ │ │ ├── dom.ts
│ │ │ ├── edge.ts
│ │ │ ├── element.ts
│ │ │ ├── event
│ │ │ │ ├── events.ts
│ │ │ │ └── index.ts
│ │ │ ├── extension.ts
│ │ │ ├── graphlib.ts
│ │ │ ├── id.ts
│ │ │ ├── is.ts
│ │ │ ├── layout.ts
│ │ │ ├── line.ts
│ │ │ ├── math.ts
│ │ │ ├── node.ts
│ │ │ ├── padding.ts
│ │ │ ├── palette.ts
│ │ │ ├── path.ts
│ │ │ ├── pinch.ts
│ │ │ ├── placement.ts
│ │ │ ├── point.ts
│ │ │ ├── polygon.ts
│ │ │ ├── position.ts
│ │ │ ├── prefix.ts
│ │ │ ├── print.ts
│ │ │ ├── relation.ts
│ │ │ ├── router
│ │ │ │ ├── orth.ts
│ │ │ │ └── shortest-path.ts
│ │ │ ├── scale.ts
│ │ │ ├── shape.ts
│ │ │ ├── shortcut.ts
│ │ │ ├── size.ts
│ │ │ ├── state.ts
│ │ │ ├── style.ts
│ │ │ ├── symbol.ts
│ │ │ ├── text.ts
│ │ │ ├── theme.ts
│ │ │ ├── transform.ts
│ │ │ ├── traverse.ts
│ │ │ ├── tree.ts
│ │ │ ├── vector.ts
│ │ │ ├── visibility.ts
│ │ │ └── z-index.ts
│ │ └── version.ts
│ ├── tsconfig.build.json
│ ├── tsconfig.json
│ ├── tsdoc.json
│ └── vite.config.js
└── site
│ ├── .dumi
│ ├── app.tsx
│ ├── global.less
│ ├── global.ts
│ └── tsconfig.json
│ ├── .dumirc.ts
│ ├── .github
│ └── workflows
│ │ └── mirror.yml
│ ├── .gitignore
│ ├── CNAME
│ ├── api-extractor.json
│ ├── common
│ ├── angular-snippet.md
│ ├── api
│ │ ├── behaviors
│ │ │ ├── auto-adapt-label.md
│ │ │ ├── brush-select.md
│ │ │ ├── click-element.md
│ │ │ ├── collapse-expand.md
│ │ │ ├── create-edge.md
│ │ │ ├── drag-canvas.md
│ │ │ ├── drag-element.md
│ │ │ ├── fix-element-size.md
│ │ │ ├── focus-element.md
│ │ │ ├── hover-activate.md
│ │ │ ├── hover-element.md
│ │ │ ├── lasso-select.md
│ │ │ ├── scroll-canvas.md
│ │ │ └── zoom-canvas.md
│ │ ├── elements
│ │ │ ├── combos
│ │ │ │ ├── base-combo.md
│ │ │ │ ├── circle-combo-interest.md
│ │ │ │ ├── circle-combo.md
│ │ │ │ ├── rect-combo-architecture.md
│ │ │ │ └── rect-combo.md
│ │ │ ├── edges
│ │ │ │ ├── base-edge.md
│ │ │ │ ├── cubic-horizontal.md
│ │ │ │ ├── cubic-vertical.md
│ │ │ │ ├── cubic.md
│ │ │ │ ├── line.md
│ │ │ │ ├── polyline.md
│ │ │ │ └── quadratic.md
│ │ │ └── nodes
│ │ │ │ ├── base-node.md
│ │ │ │ ├── circle.md
│ │ │ │ ├── diamond.md
│ │ │ │ ├── donut.md
│ │ │ │ ├── ellipse.md
│ │ │ │ ├── hexagon.md
│ │ │ │ ├── html.md
│ │ │ │ ├── image.md
│ │ │ │ ├── rect.md
│ │ │ │ ├── star.md
│ │ │ │ └── triangle.md
│ │ ├── layout
│ │ │ ├── fishbone.md
│ │ │ └── force-atlas2.md
│ │ ├── layouts
│ │ │ ├── radial.md
│ │ │ └── snake.md
│ │ ├── plugins
│ │ │ ├── background.md
│ │ │ ├── bubble-sets.md
│ │ │ ├── contextmenu.md
│ │ │ ├── edge-bundling.md
│ │ │ ├── edge-filter-lens.md
│ │ │ ├── fisheye.md
│ │ │ ├── fullscreen.md
│ │ │ ├── grid-line.md
│ │ │ ├── history.md
│ │ │ ├── hull.md
│ │ │ ├── legend.md
│ │ │ ├── minimap.md
│ │ │ ├── snapline.md
│ │ │ ├── timebar.md
│ │ │ ├── toolbar.md
│ │ │ ├── tooltip.md
│ │ │ └── watermark.md
│ │ └── transforms
│ │ │ ├── map-node-size-centrality.md
│ │ │ └── map-node-size-scale.md
│ ├── manual
│ │ ├── core-concept
│ │ │ ├── animation
│ │ │ │ ├── ant-line.md
│ │ │ │ └── breathing-circle.md
│ │ │ └── palette
│ │ │ │ ├── continuous-palette.md
│ │ │ │ ├── default-config.md
│ │ │ │ └── standard-config.md
│ │ ├── custom-extension
│ │ │ ├── animation
│ │ │ │ ├── composite-animation-1.md
│ │ │ │ ├── composite-animation-2.md
│ │ │ │ └── implement-animation.md
│ │ │ ├── behavior
│ │ │ │ └── implement-behaviors.md
│ │ │ ├── layout
│ │ │ │ ├── iterative-layout.md
│ │ │ │ └── non-iterative-layout.md
│ │ │ ├── plugin
│ │ │ │ └── implement-plugin.md
│ │ │ └── transform
│ │ │ │ ├── circular-radial-labels.md
│ │ │ │ └── hide-free-node.md
│ │ ├── feature
│ │ │ ├── treeToGraphData.md
│ │ │ └── webpack4.md
│ │ └── getting-started
│ │ │ ├── extensions
│ │ │ └── palettes.md
│ │ │ ├── quick-start
│ │ │ └── simple-graph.md
│ │ │ └── step-by-step
│ │ │ ├── behaviors.md
│ │ │ ├── create-chart.md
│ │ │ ├── elements-1.md
│ │ │ ├── elements-2.md
│ │ │ ├── layout.md
│ │ │ ├── palette.md
│ │ │ ├── plugins-1.md
│ │ │ └── plugins-2.md
│ ├── react-snippet-strict.md
│ ├── react-snippet.md
│ └── vue-snippet.md
│ ├── docs
│ ├── api
│ │ ├── behavior.en.md
│ │ ├── behavior.zh.md
│ │ ├── canvas.en.md
│ │ ├── canvas.zh.md
│ │ ├── coordinate.en.md
│ │ ├── coordinate.zh.md
│ │ ├── data.en.md
│ │ ├── data.zh.md
│ │ ├── element.en.md
│ │ ├── element.zh.md
│ │ ├── event.en.md
│ │ ├── event.zh.md
│ │ ├── export-image.en.md
│ │ ├── export-image.zh.md
│ │ ├── graph.en.md
│ │ ├── graph.zh.md
│ │ ├── layout.en.md
│ │ ├── layout.zh.md
│ │ ├── option.en.md
│ │ ├── option.zh.md
│ │ ├── plugin.en.md
│ │ ├── plugin.zh.md
│ │ ├── render.en.md
│ │ ├── render.zh.md
│ │ ├── theme.en.md
│ │ ├── theme.zh.md
│ │ ├── transform.en.md
│ │ ├── transform.zh.md
│ │ ├── viewport.en.md
│ │ └── viewport.zh.md
│ ├── backup
│ │ ├── CameraSetting.en.md
│ │ └── CameraSetting.zh.md
│ └── manual
│ │ ├── animation
│ │ ├── animation.en.md
│ │ ├── animation.zh.md
│ │ ├── custom-animation.en.md
│ │ └── custom-animation.zh.md
│ │ ├── behavior
│ │ ├── build-in
│ │ │ ├── AutoAdaptLabel.en.md
│ │ │ ├── AutoAdaptLabel.zh.md
│ │ │ ├── BrushSelect.en.md
│ │ │ ├── BrushSelect.zh.md
│ │ │ ├── ClickSelect.en.md
│ │ │ ├── ClickSelect.zh.md
│ │ │ ├── CollapseExpand.en.md
│ │ │ ├── CollapseExpand.zh.md
│ │ │ ├── CreateEdge.en.md
│ │ │ ├── CreateEdge.zh.md
│ │ │ ├── DragCanvas.en.md
│ │ │ ├── DragCanvas.zh.md
│ │ │ ├── DragElement.en.md
│ │ │ ├── DragElement.zh.md
│ │ │ ├── DragElementForce.en.md
│ │ │ ├── DragElementForce.zh.md
│ │ │ ├── FixElementSize.en.md
│ │ │ ├── FixElementSize.zh.md
│ │ │ ├── FocusElement.en.md
│ │ │ ├── FocusElement.zh.md
│ │ │ ├── HoverActivate.en.md
│ │ │ ├── HoverActivate.zh.md
│ │ │ ├── LassoSelect.en.md
│ │ │ ├── LassoSelect.zh.md
│ │ │ ├── OptimizeViewportTransform.en.md
│ │ │ ├── OptimizeViewportTransform.zh.md
│ │ │ ├── ScrollCanvas.en.md
│ │ │ ├── ScrollCanvas.zh.md
│ │ │ ├── ZoomCanvas.en.md
│ │ │ └── ZoomCanvas.zh.md
│ │ ├── custom-behavior.en.md
│ │ ├── custom-behavior.zh.md
│ │ ├── overview.en.md
│ │ └── overview.zh.md
│ │ ├── contribute.en.md
│ │ ├── contribute.zh.md
│ │ ├── data.en.md
│ │ ├── data.zh.md
│ │ ├── element
│ │ ├── combo
│ │ │ ├── build-in
│ │ │ │ ├── BaseCombo.en.md
│ │ │ │ ├── BaseCombo.zh.md
│ │ │ │ ├── CircleCombo.en.md
│ │ │ │ ├── CircleCombo.zh.md
│ │ │ │ ├── RectCombo.en.md
│ │ │ │ └── RectCombo.zh.md
│ │ │ ├── custom-combo.en.md
│ │ │ ├── custom-combo.zh.md
│ │ │ ├── overview.en.md
│ │ │ └── overview.zh.md
│ │ ├── edge
│ │ │ ├── build-in
│ │ │ │ ├── BaseEdge.en.md
│ │ │ │ ├── BaseEdge.zh.md
│ │ │ │ ├── Cubic.en.md
│ │ │ │ ├── Cubic.zh.md
│ │ │ │ ├── CubicHorizontal.en.md
│ │ │ │ ├── CubicHorizontal.zh.md
│ │ │ │ ├── CubicVertical.en.md
│ │ │ │ ├── CubicVertical.zh.md
│ │ │ │ ├── Line.en.md
│ │ │ │ ├── Line.zh.md
│ │ │ │ ├── Polyline.en.md
│ │ │ │ ├── Polyline.zh.md
│ │ │ │ ├── Quadratic.en.md
│ │ │ │ └── Quadratic.zh.md
│ │ │ ├── custom-edge.en.md
│ │ │ ├── custom-edge.zh.md
│ │ │ ├── overview.en.md
│ │ │ └── overview.zh.md
│ │ ├── node
│ │ │ ├── build-in
│ │ │ │ ├── BaseNode.en.md
│ │ │ │ ├── BaseNode.zh.md
│ │ │ │ ├── Circle.en.md
│ │ │ │ ├── Circle.zh.md
│ │ │ │ ├── Diamond.en.md
│ │ │ │ ├── Diamond.zh.md
│ │ │ │ ├── Donut.en.md
│ │ │ │ ├── Donut.zh.md
│ │ │ │ ├── Ellipse.en.md
│ │ │ │ ├── Ellipse.zh.md
│ │ │ │ ├── Hexagon.en.md
│ │ │ │ ├── Hexagon.zh.md
│ │ │ │ ├── Html.en.md
│ │ │ │ ├── Html.zh.md
│ │ │ │ ├── Image.en.md
│ │ │ │ ├── Image.zh.md
│ │ │ │ ├── Rect.en.md
│ │ │ │ ├── Rect.zh.md
│ │ │ │ ├── Star.en.md
│ │ │ │ ├── Star.zh.md
│ │ │ │ ├── Triangle.en.md
│ │ │ │ └── Triangle.zh.md
│ │ │ ├── custom-node.en.md
│ │ │ ├── custom-node.zh.md
│ │ │ ├── overview.en.md
│ │ │ ├── overview.zh.md
│ │ │ ├── react-node.en.md
│ │ │ └── react-node.zh.md
│ │ ├── overview.en.md
│ │ ├── overview.zh.md
│ │ ├── shape
│ │ │ ├── label-shape.en.md
│ │ │ ├── label-shape.zh.md
│ │ │ ├── overview.en.md
│ │ │ ├── overview.zh.md
│ │ │ ├── properties.en.md
│ │ │ └── properties.zh.md
│ │ ├── state.en.md
│ │ └── state.zh.md
│ │ ├── extension
│ │ ├── 3d.en.md
│ │ └── 3d.zh.md
│ │ ├── faq.en.md
│ │ ├── faq.zh.md
│ │ ├── further-reading
│ │ ├── 3d.en.md
│ │ ├── 3d.zh.md
│ │ ├── bundle.en.md
│ │ ├── bundle.zh.md
│ │ ├── coordinate.en.md
│ │ ├── coordinate.zh.md
│ │ ├── download-image.en.md
│ │ ├── download-image.zh.md
│ │ ├── event.en.md
│ │ ├── event.zh.md
│ │ ├── iconfont.en.md
│ │ ├── iconfont.zh.md
│ │ ├── renderer.en.md
│ │ └── renderer.zh.md
│ │ ├── getting-started
│ │ ├── installation.en.md
│ │ ├── installation.zh.md
│ │ ├── integration
│ │ │ ├── angular.en.md
│ │ │ ├── angular.zh.md
│ │ │ ├── react.en.md
│ │ │ ├── react.zh.md
│ │ │ ├── vue.en.md
│ │ │ └── vue.zh.md
│ │ ├── quick-start.en.md
│ │ ├── quick-start.zh.md
│ │ ├── step-by-step.en.md
│ │ └── step-by-step.zh.md
│ │ ├── graph
│ │ ├── extension.en.md
│ │ ├── extension.zh.md
│ │ ├── extensions.en.md
│ │ ├── extensions.zh.md
│ │ ├── graph.en.md
│ │ ├── graph.zh.md
│ │ ├── option.en.md
│ │ └── option.zh.md
│ │ ├── introduction.en.md
│ │ ├── introduction.zh.md
│ │ ├── layout
│ │ ├── build-in
│ │ │ ├── AntvDagreLayout.en.md
│ │ │ ├── AntvDagreLayout.zh.md
│ │ │ ├── BaseLayout.en.md
│ │ │ ├── BaseLayout.zh.md
│ │ │ ├── CircularLayout.en.md
│ │ │ ├── CircularLayout.zh.md
│ │ │ ├── ComboCombinedLayout.en.md
│ │ │ ├── ComboCombinedLayout.zh.md
│ │ │ ├── CompactBoxLayout.en.md
│ │ │ ├── CompactBoxLayout.zh.md
│ │ │ ├── ConcentricLayout.en.md
│ │ │ ├── ConcentricLayout.zh.md
│ │ │ ├── D3Force3DLayout.en.md
│ │ │ ├── D3Force3DLayout.zh.md
│ │ │ ├── D3ForceLayout.en.md
│ │ │ ├── D3ForceLayout.zh.md
│ │ │ ├── DagreLayout.en.md
│ │ │ ├── DagreLayout.zh.md
│ │ │ ├── DendrogramLayout.en.md
│ │ │ ├── DendrogramLayout.zh.md
│ │ │ ├── Fishbone.en.md
│ │ │ ├── Fishbone.zh.md
│ │ │ ├── ForceAtlas2Layout.en.md
│ │ │ ├── ForceAtlas2Layout.zh.md
│ │ │ ├── ForceLayout.en.md
│ │ │ ├── ForceLayout.zh.md
│ │ │ ├── FruchtermanLayout.en.md
│ │ │ ├── FruchtermanLayout.zh.md
│ │ │ ├── GridLayout.en.md
│ │ │ ├── GridLayout.zh.md
│ │ │ ├── IndentedLayout.en.md
│ │ │ ├── IndentedLayout.zh.md
│ │ │ ├── MdsLayout.en.md
│ │ │ ├── MdsLayout.zh.md
│ │ │ ├── MindmapLayout.en.md
│ │ │ ├── MindmapLayout.zh.md
│ │ │ ├── RadialLayout.en.md
│ │ │ ├── RadialLayout.zh.md
│ │ │ ├── RandomLayout.en.md
│ │ │ ├── RandomLayout.zh.md
│ │ │ ├── Snake.en.md
│ │ │ └── Snake.zh.md
│ │ ├── custom-layout.en.md
│ │ ├── custom-layout.zh.md
│ │ ├── overview.en.md
│ │ └── overview.zh.md
│ │ ├── plugin
│ │ ├── build-in
│ │ │ ├── Background.en.md
│ │ │ ├── Background.zh.md
│ │ │ ├── BubbleSets.en.md
│ │ │ ├── BubbleSets.zh.md
│ │ │ ├── Contextmenu.en.md
│ │ │ ├── Contextmenu.zh.md
│ │ │ ├── EdgeBundling.en.md
│ │ │ ├── EdgeBundling.zh.md
│ │ │ ├── EdgeFilterLens.en.md
│ │ │ ├── EdgeFilterLens.zh.md
│ │ │ ├── Fisheye.en.md
│ │ │ ├── Fisheye.zh.md
│ │ │ ├── Fullscreen.en.md
│ │ │ ├── Fullscreen.zh.md
│ │ │ ├── GridLine.en.md
│ │ │ ├── GridLine.zh.md
│ │ │ ├── History.en.md
│ │ │ ├── History.zh.md
│ │ │ ├── Hull.en.md
│ │ │ ├── Hull.zh.md
│ │ │ ├── Legend.en.md
│ │ │ ├── Legend.zh.md
│ │ │ ├── Minimap.en.md
│ │ │ ├── Minimap.zh.md
│ │ │ ├── Snapline.en.md
│ │ │ ├── Snapline.zh.md
│ │ │ ├── Timebar.en.md
│ │ │ ├── Timebar.zh.md
│ │ │ ├── Toolbar.en.md
│ │ │ ├── Toolbar.zh.md
│ │ │ ├── Tooltip.en.md
│ │ │ ├── Tooltip.zh.md
│ │ │ ├── Watermark.en.md
│ │ │ └── Watermark.zh.md
│ │ ├── custom-plugin.en.md
│ │ ├── custom-plugin.zh.md
│ │ ├── overview.en.md
│ │ └── overview.zh.md
│ │ ├── theme
│ │ ├── custom-palette.en.md
│ │ ├── custom-palette.zh.md
│ │ ├── custom-theme.en.md
│ │ ├── custom-theme.zh.md
│ │ ├── overview.en.md
│ │ ├── overview.zh.md
│ │ ├── palette.en.md
│ │ └── palette.zh.md
│ │ ├── transform
│ │ ├── build-in
│ │ │ ├── MapNodeSize.en.md
│ │ │ ├── MapNodeSize.zh.md
│ │ │ ├── PlaceRadialLabels.en.md
│ │ │ ├── PlaceRadialLabels.zh.md
│ │ │ ├── ProcessParallelEdges.en.md
│ │ │ └── ProcessParallelEdges.zh.md
│ │ ├── custom-transform.en.md
│ │ ├── custom-transform.zh.md
│ │ ├── overview.en.md
│ │ └── overview.zh.md
│ │ └── whats-new
│ │ ├── feature.en.md
│ │ ├── feature.zh.md
│ │ ├── upgrade.en.md
│ │ └── upgrade.zh.md
│ ├── examples
│ ├── algorithm
│ │ └── case
│ │ │ ├── demo
│ │ │ ├── label-propagation.js
│ │ │ ├── louvain.js
│ │ │ ├── meta.json
│ │ │ ├── pattern-matching.js
│ │ │ └── shortest-path.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── animation
│ │ ├── basic
│ │ │ ├── demo
│ │ │ │ ├── combo-collapse-expand.js
│ │ │ │ ├── enter-edge-path-in.js
│ │ │ │ ├── enter.js
│ │ │ │ ├── exit.js
│ │ │ │ ├── meta.json
│ │ │ │ └── update.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── persistence
│ │ │ ├── demo
│ │ │ │ ├── ant-line.js
│ │ │ │ ├── breathing-circle.js
│ │ │ │ ├── fly-marker.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── path-in.js
│ │ │ │ └── ripple-circle.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ └── viewport
│ │ │ ├── demo
│ │ │ ├── meta.json
│ │ │ ├── rotate.js
│ │ │ ├── translate.js
│ │ │ └── zoom.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── behavior
│ │ ├── auto-adapt-label
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── canvas
│ │ │ ├── demo
│ │ │ │ ├── drag.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── optimize.js
│ │ │ │ ├── scroll-xy.js
│ │ │ │ ├── scroll-y.js
│ │ │ │ └── zoom.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── combo
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── collapse-expand.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── create-edge
│ │ │ ├── demo
│ │ │ │ ├── between-combos.js
│ │ │ │ ├── by-click.js
│ │ │ │ ├── by-drag.js
│ │ │ │ ├── custom-edge-style.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── fix-element-size
│ │ │ ├── demo
│ │ │ │ ├── autosize-label.js
│ │ │ │ ├── fix-font-size.js
│ │ │ │ ├── fix-size.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── focus
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── highlight-element
│ │ │ ├── demo
│ │ │ │ ├── activate-relations.js
│ │ │ │ ├── basic.js
│ │ │ │ ├── config-params.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── inner-event
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── select
│ │ │ ├── demo
│ │ │ │ ├── brush-combo.js
│ │ │ │ ├── brush.js
│ │ │ │ ├── click.js
│ │ │ │ ├── lasso.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ └── update-label
│ │ │ ├── demo
│ │ │ ├── meta.json
│ │ │ └── update.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── element
│ │ ├── combo
│ │ │ ├── demo
│ │ │ │ ├── circle.js
│ │ │ │ ├── meta.json
│ │ │ │ └── rect.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── custom-combo
│ │ │ ├── demo
│ │ │ │ ├── extra-button.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── custom-edge
│ │ │ ├── demo
│ │ │ │ ├── custom-arrow.js
│ │ │ │ ├── custom-path.js
│ │ │ │ ├── extra-label.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── custom-node
│ │ │ ├── demo
│ │ │ │ ├── g2-activity-chart.js
│ │ │ │ ├── g2-bar-chart.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── react-node.jsx
│ │ │ │ └── reactnode-idcard.jsx
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── edge
│ │ │ ├── demo
│ │ │ │ ├── arrows.js
│ │ │ │ ├── cubic.js
│ │ │ │ ├── horizontal-cubic.js
│ │ │ │ ├── line.js
│ │ │ │ ├── loop-curve.js
│ │ │ │ ├── loop-polyline.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── polyline-orth-with-cps.js
│ │ │ │ ├── polyline-orth.js
│ │ │ │ ├── polyline.js
│ │ │ │ ├── quadratic.js
│ │ │ │ └── vertical-cubic.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── label
│ │ │ ├── demo
│ │ │ │ ├── background.js
│ │ │ │ ├── copy.js
│ │ │ │ ├── ellipsis.js
│ │ │ │ ├── meta.json
│ │ │ │ └── word-wrap.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ └── node
│ │ │ ├── demo
│ │ │ ├── 3d-node.js
│ │ │ ├── circle.js
│ │ │ ├── diamond.js
│ │ │ ├── donut.js
│ │ │ ├── ellipse.js
│ │ │ ├── hexagon.js
│ │ │ ├── html.js
│ │ │ ├── image.js
│ │ │ ├── meta.json
│ │ │ ├── port.js
│ │ │ ├── rect.js
│ │ │ ├── rounded-rect.js
│ │ │ ├── star.js
│ │ │ └── triangle.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── feature
│ │ └── default
│ │ │ ├── demo
│ │ │ ├── 3d-massive.js
│ │ │ ├── lite-solar-system.js
│ │ │ ├── meta.json
│ │ │ ├── theme.js
│ │ │ └── unicorns-investors.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── layout
│ │ ├── circular
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── degree.js
│ │ │ │ ├── division.js
│ │ │ │ ├── meta.json
│ │ │ │ └── spiral.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── combo-layout
│ │ │ ├── demo
│ │ │ │ ├── combo-combined.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── compact-box
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── radial.js
│ │ │ │ └── vertical.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── concentric
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── custom
│ │ │ ├── demo
│ │ │ │ ├── arc.js
│ │ │ │ ├── bi-graph.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── dagre
│ │ │ ├── demo
│ │ │ │ ├── antv-dagre-combo.js
│ │ │ │ ├── antv-dagre.js
│ │ │ │ ├── dagre.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── dendrogram
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── radial.js
│ │ │ │ └── vertical.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── fishbone
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── force-directed
│ │ │ ├── demo
│ │ │ │ ├── 3d-force.js
│ │ │ │ ├── atlas2.js
│ │ │ │ ├── bubbles.js
│ │ │ │ ├── collision.js
│ │ │ │ ├── d3-force.js
│ │ │ │ ├── drag-fixed.js
│ │ │ │ ├── force.js
│ │ │ │ ├── functional-params.js
│ │ │ │ ├── mesh.js
│ │ │ │ ├── meta.json
│ │ │ │ └── prevent-overlap.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── fruchterman
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── cluster.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── run-in-gpu.js
│ │ │ │ └── run-in-web-worker.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── grid
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── indented
│ │ │ ├── demo
│ │ │ │ ├── auto-side.js
│ │ │ │ ├── custom-side.js
│ │ │ │ ├── left-side.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── no-drop-cap.js
│ │ │ │ └── right-side.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── mds
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── mechanism
│ │ │ ├── demo
│ │ │ │ ├── change-data.js
│ │ │ │ ├── meta.json
│ │ │ │ └── switch.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── mindmap
│ │ │ ├── demo
│ │ │ │ ├── auto-side.js
│ │ │ │ ├── custom-side.js
│ │ │ │ ├── left-side.js
│ │ │ │ ├── meta.json
│ │ │ │ └── right-side.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── radial
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── cluster-sort.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── non-strict-prevent-overlap.js
│ │ │ │ └── strict-prevent-overlap.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── snake
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── gutter.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ └── sub-graph
│ │ │ ├── demo
│ │ │ ├── basic.js
│ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── performance
│ │ └── massive-data
│ │ │ ├── demo
│ │ │ ├── 20000.js
│ │ │ ├── 5000.js
│ │ │ ├── 60000.js
│ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── plugin
│ │ ├── background
│ │ │ ├── demo
│ │ │ │ ├── background.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── bubble-sets
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── contextMenu
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── edge-bundling
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── edge-filter-lens
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── fisheye
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── custom.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── fullscreen
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── grid-line
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── history
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── hull
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── legend
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── click.js
│ │ │ │ ├── meta.json
│ │ │ │ └── style.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── minimap
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── snapline
│ │ │ ├── demo
│ │ │ │ ├── autoSnap.js
│ │ │ │ ├── basic.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── timebar
│ │ │ ├── demo
│ │ │ │ ├── chart.js
│ │ │ │ ├── meta.json
│ │ │ │ └── time.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── toolbar
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── custom.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ ├── tooltip
│ │ │ ├── demo
│ │ │ │ ├── basic.js
│ │ │ │ ├── click.js
│ │ │ │ ├── dual.js
│ │ │ │ └── meta.json
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ └── watermark
│ │ │ ├── demo
│ │ │ ├── meta.json
│ │ │ ├── repeat.js
│ │ │ └── text.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ ├── scene-case
│ │ ├── default
│ │ │ ├── demo
│ │ │ │ ├── battle-array.jsx
│ │ │ │ ├── fund-flow.js
│ │ │ │ ├── meta.json
│ │ │ │ ├── music-festival.js
│ │ │ │ ├── organization-chart.js
│ │ │ │ ├── performance-diagnosis-flowchart.js
│ │ │ │ ├── snake-flow-diagram.js
│ │ │ │ ├── sub-graph.js
│ │ │ │ └── why-do-cats.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ │ └── tree-graph
│ │ │ ├── demo
│ │ │ ├── anti-procrastination-fishbone.js
│ │ │ ├── indented-tree.js
│ │ │ ├── meta.json
│ │ │ ├── mindmap.js
│ │ │ ├── product-fishbone.js
│ │ │ ├── radial-compact-tree.js
│ │ │ └── radial-dendrogram.js
│ │ │ ├── index.en.md
│ │ │ └── index.zh.md
│ └── transform
│ │ └── process-parallel-edges
│ │ ├── demo
│ │ ├── bundle.js
│ │ ├── merge.js
│ │ └── meta.json
│ │ ├── index.en.md
│ │ └── index.zh.md
│ ├── mako.config.json
│ ├── package.json
│ ├── scripts
│ ├── clear-doc.ts
│ ├── doc-template.mjs
│ ├── generate-api.ts
│ ├── generate-doc.ts
│ ├── rewrite-ob.ts
│ └── sort-doc.ts
│ ├── src
│ ├── MarkdownDocumenter.ts
│ ├── constants
│ │ ├── index.ts
│ │ ├── link.ts
│ │ └── locales
│ │ │ ├── api-category.json
│ │ │ ├── element.json
│ │ │ ├── enum.ts
│ │ │ ├── helper.json
│ │ │ ├── index.ts
│ │ │ ├── keyword.json
│ │ │ └── page-name.json
│ ├── markdown
│ │ ├── CustomMarkdownEmitter.ts
│ │ └── MarkdownEmitter.ts
│ ├── nodes
│ │ ├── CustomDocNodeKind.ts
│ │ ├── DocContainer.ts
│ │ ├── DocDetails.ts
│ │ ├── DocEmphasisSpan.ts
│ │ ├── DocHeading.ts
│ │ ├── DocNoteBox.ts
│ │ ├── DocPageTitle.ts
│ │ ├── DocTable.ts
│ │ ├── DocTableCell.ts
│ │ ├── DocTableRow.ts
│ │ ├── DocText.ts
│ │ └── DocUnorderedList.ts
│ └── utils
│ │ ├── IndentedWriter.ts
│ │ ├── Utilities.ts
│ │ ├── excerpt-token.ts
│ │ ├── gitignore.ts
│ │ └── parser.ts
│ └── tsconfig.json
├── playwright.config.ts
├── pnpm-workspace.yaml
├── scripts
├── contribute.mjs
├── demo-to-test
│ ├── core
│ │ ├── global.js
│ │ ├── index.js
│ │ ├── parser.js
│ │ └── utils.js
│ ├── index.js
│ └── template
│ │ ├── it.js
│ │ ├── spec.js
│ │ └── test.js
└── version.sh
├── tests
└── g6
│ ├── elements
│ ├── node-element.spec.ts
│ └── node-element.spec.ts-snapshots
│ │ └── element-node-html-html-1-chromium-darwin.png
│ └── plugins
│ ├── plugins-minimap.spec.ts
│ ├── plugins-minimap.spec.ts-snapshots
│ ├── plugin-minimap-default-1-chromium-darwin.png
│ ├── plugin-minimap-default-2-chromium-darwin.png
│ ├── plugin-minimap-default-3-chromium-darwin.png
│ ├── plugin-minimap-default-4-chromium-darwin.png
│ ├── plugin-minimap-default-5-chromium-darwin.png
│ └── plugin-minimap-default-6-chromium-darwin.png
│ ├── plugins-tooltip.spec.ts
│ └── plugins-tooltip.spec.ts-snapshots
│ ├── plugin-tooltip-bug-tooltip-should-has-correct-position-after-graph-resize-1-chromium-darwin.png
│ └── plugin-tooltip-bug-tooltip-should-has-correct-position-after-graph-resize-2-chromium-darwin.png
├── tsconfig.json
└── turbo.json
/.changeset/config.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://unpkg.com/@changesets/config@3.0.1/schema.json",
3 | "changelog": false,
4 | "commit": false,
5 | "fixed": [],
6 | "linked": [],
7 | "access": "restricted",
8 | "baseBranch": "v5",
9 | "updateInternalDependencies": "patch",
10 | "ignore": ["@antv/g6-site", "bundle"]
11 | }
12 |
--------------------------------------------------------------------------------
/.commitlintrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | extends: ['@commitlint/config-conventional'],
3 | rules: {
4 | 'type-enum': [
5 | 2,
6 | 'always',
7 | ['build', 'chore', 'ci', 'docs', 'feat', 'fix', 'perf', 'refactor', 'revert', 'style', 'test', 'wip'],
8 | ],
9 | },
10 | };
11 |
--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
1 | # http://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | indent_style = space
6 | indent_size = 2
7 | end_of_line = lf
8 | charset = utf-8
9 | trim_trailing_whitespace = true
10 | insert_final_newline = true
11 |
12 | [*.md]
13 | trim_trailing_whitespace = false
14 |
15 | [Makefile]
16 | indent_style = tab
--------------------------------------------------------------------------------
/.eslintignore:
--------------------------------------------------------------------------------
1 | dist
2 | es
3 | lib
4 | node_modules
--------------------------------------------------------------------------------
/.github/ISSUE_TEMPLATE/config.yml:
--------------------------------------------------------------------------------
1 | # Ref: https://docs.github.com/en/communities/using-templates-to-encourage-useful-issues-and-pull-requests/configuring-issue-templates-for-your-repository#configuring-the-template-chooser
2 | blank_issues_enabled: false
3 | contact_links:
4 | - name: 📝 Question / 问题咨询
5 | url: https://github.com/antvis/g6/discussions/new?category=q-a
6 | about: Discuss G6 usage / 讨论 G6 使用问题
7 | - name: 💬 Join Discussion Group / 加入讨论群
8 | url: https://qr.dingtalk.com/action/joingroup?code=v1,k1,rQHsK/OOTPX8ixM/DaXcL3goIYpnpKr/AFIonmA1SOM=&_dt_no_comment=1&origin=11?
9 | about: Join DingTalk discussion group / 加入钉钉讨论群
10 |
--------------------------------------------------------------------------------
/.github/workflows/mark-duplicate.yml:
--------------------------------------------------------------------------------
1 | name: Mark Duplicate Issue
2 |
3 | on:
4 | issue_comment:
5 | types: [created, edited]
6 |
7 | permissions: {}
8 |
9 | jobs:
10 | mark-duplicate:
11 | runs-on: ubuntu-latest
12 | permissions:
13 | contents: read
14 | issues: write
15 | steps:
16 | - name: Mark duplicate issue
17 | uses: actions-cool/issues-helper@v3.6.0
18 | with:
19 | actions: "mark-duplicate"
20 | token: ${{ secrets.GITHUB_TOKEN }}
21 | duplicate-labels: "duplicate"
22 | remove-labels: "waiting for maintainer"
23 | close-issue: true
24 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | lerna-debug.log*
8 | yarn.lock
9 | package-lock.json
10 | pnpm-lock.yaml
11 |
12 | # Sys
13 | .DS_Store
14 | .idea
15 |
16 | # Node
17 | node_modules/
18 | .npmrc
19 |
20 | # Build
21 | dist
22 | lib
23 | esm
24 |
25 | # Test
26 | coverage
27 |
28 | # Bundle visualizer
29 | stats.html
30 |
31 | # Tools
32 | .turbo
33 | **/tmp/
34 | /test-results/
35 | /playwright-report/
36 | /blob-report/
37 | /playwright/.cache/
38 |
39 | # IDE
40 | .history/
41 | .lh/
42 |
--------------------------------------------------------------------------------
/.husky/commit-msg:
--------------------------------------------------------------------------------
1 | #!/bin/sh
2 | . "$(dirname "$0")/_/husky.sh"
3 |
4 | npx --no-install commitlint --edit "$1"
5 |
--------------------------------------------------------------------------------
/.husky/pre-commit:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env sh
2 | . "$(dirname -- "$0")/_/husky.sh"
3 |
4 | protected_branches="master v5"
5 | current_branch=$(git rev-parse --abbrev-ref HEAD)
6 | for branch in $protected_branches; do
7 | if [ "$current_branch" == "$branch" ]; then
8 | echo "\033[31mDirect commit to '$branch' branch are not allowed!\033[0m"
9 | exit 1
10 | fi
11 | done
12 |
13 | npx lint-staged
14 |
--------------------------------------------------------------------------------
/.prettierignore:
--------------------------------------------------------------------------------
1 | dist
2 | es
3 | lib
4 | node_modules
--------------------------------------------------------------------------------
/.prettierrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: [
3 | require.resolve('prettier-plugin-organize-imports'),
4 | require.resolve('prettier-plugin-packagejson'),
5 | ],
6 | printWidth: 120,
7 | proseWrap: 'never',
8 | singleQuote: true,
9 | trailingComma: 'all',
10 | overrides: [
11 | {
12 | files: '*.md',
13 | options: {
14 | proseWrap: 'preserve',
15 | },
16 | },
17 | ],
18 | };
19 |
--------------------------------------------------------------------------------
/packages/bundle/rollup.config.mjs:
--------------------------------------------------------------------------------
1 | import commonjs from '@rollup/plugin-commonjs';
2 | import resolve from '@rollup/plugin-node-resolve';
3 | import terser from '@rollup/plugin-terser';
4 | import typescript from '@rollup/plugin-typescript';
5 | import nodePolyfills from 'rollup-plugin-polyfill-node';
6 |
7 | export default {
8 | input: 'src/index.ts',
9 | output: {
10 | file: 'dist/rollup/g6.umd.js',
11 | name: 'g6',
12 | format: 'umd',
13 | sourcemap: false,
14 | },
15 | plugins: [nodePolyfills(), resolve(), commonjs(), typescript(), terser()],
16 | };
17 |
--------------------------------------------------------------------------------
/packages/bundle/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "strict": true,
4 | "outDir": "lib",
5 | "paths": {
6 | "@antv/g6": ["../g6/src/index.ts"]
7 | }
8 | },
9 | "extends": "../../tsconfig.json",
10 | "include": ["src/**/*"]
11 | }
12 |
--------------------------------------------------------------------------------
/packages/bundle/vite.config.js:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vite';
2 |
3 | export default defineConfig({
4 | build: {
5 | lib: {
6 | entry: 'src/index.ts',
7 | name: 'g6',
8 | fileName: 'g6',
9 | formats: ['umd'],
10 | },
11 | outDir: 'dist/vite',
12 | },
13 | });
14 |
--------------------------------------------------------------------------------
/packages/bundle/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 |
3 | module.exports = {
4 | entry: './src/index.ts',
5 | output: {
6 | filename: 'g6.umd.js',
7 | path: path.resolve(__dirname, 'dist/webpack'),
8 | },
9 | };
10 |
--------------------------------------------------------------------------------
/packages/cli/CHANGELOG.md:
--------------------------------------------------------------------------------
1 | # @antv/g6-cli
2 |
3 | ## 0.0.2
4 |
5 | ### Patch Changes
6 |
7 | - chore, feat, bugfix
8 |
--------------------------------------------------------------------------------
/packages/cli/build.config.ts:
--------------------------------------------------------------------------------
1 | import { defineBuildConfig } from 'unbuild';
2 |
3 | export default defineBuildConfig({
4 | entries: ['src/index'],
5 | clean: true,
6 | rollup: {
7 | inlineDependencies: true,
8 | esbuild: {
9 | target: 'node18',
10 | minify: true,
11 | },
12 | },
13 | });
14 |
--------------------------------------------------------------------------------
/packages/cli/index.js:
--------------------------------------------------------------------------------
1 | #!/usr/bin/env node
2 |
3 | import './dist/index.mjs';
4 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/.commitlintrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | extends: ['@commitlint/config-conventional'],
3 | rules: {
4 | 'type-enum': [
5 | 2,
6 | 'always',
7 | ['build', 'chore', 'ci', 'docs', 'feat', 'fix', 'perf', 'refactor', 'revert', 'style', 'test', 'wip'],
8 | ],
9 | },
10 | };
11 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/.editorconfig:
--------------------------------------------------------------------------------
1 | # http://editorconfig.org
2 | root = true
3 |
4 | [*]
5 | indent_style = space
6 | indent_size = 2
7 | end_of_line = lf
8 | charset = utf-8
9 | trim_trailing_whitespace = true
10 | insert_final_newline = true
11 |
12 | [*.md]
13 | trim_trailing_whitespace = false
14 |
15 | [Makefile]
16 | indent_style = tab
17 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/.eslintignore:
--------------------------------------------------------------------------------
1 | dist
2 | es
3 | lib
4 | node_modules
--------------------------------------------------------------------------------
/packages/cli/template-extension/.gitignore:
--------------------------------------------------------------------------------
1 | # Node
2 | node_modules/
3 |
4 | # Build
5 | dist
6 | lib
7 | esm
8 |
9 |
10 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/.prettierignore:
--------------------------------------------------------------------------------
1 | dist
2 | es
3 | lib
4 | node_modules
5 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/.prettierrc.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: [require.resolve('prettier-plugin-organize-imports'), require.resolve('prettier-plugin-packagejson')],
3 | printWidth: 120,
4 | proseWrap: 'never',
5 | singleQuote: true,
6 | trailingComma: 'all',
7 | };
8 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/demos/element-node-extend.ts:
--------------------------------------------------------------------------------
1 | import { ExtendNode } from '@/src';
2 | import { ExtensionCategory, Graph, register } from '@antv/g6';
3 |
4 | export const elementNodeExtend: TestCase = async (context) => {
5 | register(ExtensionCategory.NODE, 'extend-node', ExtendNode);
6 |
7 | const graph = new Graph({
8 | ...context,
9 | data: {
10 | nodes: [{ id: 'node1', style: { x: 100, y: 100 } }],
11 | },
12 | node: { type: 'extend-node' },
13 | });
14 |
15 | await graph.render();
16 |
17 | return graph;
18 | };
19 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/demos/index.ts:
--------------------------------------------------------------------------------
1 | export * from './element-node-extend';
2 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | {{projectName}}
7 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/setup.ts:
--------------------------------------------------------------------------------
1 | import './utils/use-snapshot-matchers';
2 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/snapshots/elements/nodes/extend/default.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/types.d.ts:
--------------------------------------------------------------------------------
1 | import type { Graph, GraphOptions } from '@antv/g6';
2 | import type { Controller, GUI } from 'lil-gui';
3 |
4 | declare global {
5 | export interface TestCase {
6 | (context: GraphOptions): Promise;
7 | form?: (gui: GUI) => Controller[];
8 | }
9 |
10 | export type TestContext = GraphOptions;
11 | }
12 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/unit/default.spec.ts:
--------------------------------------------------------------------------------
1 | describe('suite', () => {
2 | it('case', () => {
3 | expect(1).toBe(1);
4 | });
5 | });
6 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/unit/elements/nodes/extend.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeExtend } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils/index';
3 | import type { Graph } from '@antv/g6';
4 |
5 | describe('element node circle', () => {
6 | let graph: Graph;
7 |
8 | beforeAll(async () => {
9 | graph = await createDemoGraph(elementNodeExtend);
10 | });
11 |
12 | afterAll(() => {
13 | graph.destroy();
14 | });
15 |
16 | it('should render an extended node', async () => {
17 | await expect(graph).toMatchSnapshot(__filename);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/utils/dir.ts:
--------------------------------------------------------------------------------
1 | import path from 'path';
2 |
3 | /**
4 | * 获取快照目录
5 | *
6 | * Get snapshot directory
7 | * @param dir - __filename
8 | * @param detail - 快照详情 | snapshot detail
9 | * @returns 快照目录 | snapshot directory
10 | */
11 | export function getSnapshotDir(dir: string, detail: string = 'default'): [string, string] {
12 | const root = process.cwd();
13 | const subDir = dir.replace(root, '').replace('__tests__/unit/', '').replace('.spec.ts', '');
14 | const outputDir = path.join(root, '__tests__', 'snapshots', subDir);
15 | return [outputDir, detail];
16 | }
17 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/utils/index.ts:
--------------------------------------------------------------------------------
1 | export { createDemoGraph } from './create';
2 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/utils/sleep.ts:
--------------------------------------------------------------------------------
1 | export function sleep(n: number) {
2 | return new Promise((resolve) => {
3 | setTimeout(resolve, n);
4 | });
5 | }
6 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/__tests__/utils/svg-transformer.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | process() {
3 | return {
4 | code: `module.exports = {};`,
5 | };
6 | },
7 | };
8 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/src/elements/index.ts:
--------------------------------------------------------------------------------
1 | export * from './nodes';
2 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/src/elements/nodes/extend-node.ts:
--------------------------------------------------------------------------------
1 | import type { CircleStyleProps } from '@antv/g6';
2 | import { Circle } from '@antv/g6';
3 |
4 | export interface ExtendNodeStyleProps extends CircleStyleProps {}
5 |
6 | export class ExtendNode extends Circle {}
7 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/src/elements/nodes/index.ts:
--------------------------------------------------------------------------------
1 | export { ExtendNode } from './extend-node';
2 |
3 | export type { ExtendNodeStyleProps } from './extend-node';
4 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/src/exports.ts:
--------------------------------------------------------------------------------
1 | export { ExtendNode } from './elements';
2 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/src/index.ts:
--------------------------------------------------------------------------------
1 | export * from './exports';
2 |
--------------------------------------------------------------------------------
/packages/cli/template-extension/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/cli/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "include": ["build.config.ts", "src"],
4 | "compilerOptions": {}
5 | }
6 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "rules": {
3 | "no-console": "off"
4 | }
5 | }
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/demos/index.ts:
--------------------------------------------------------------------------------
1 | export * from './behavior-drag-canvas';
2 | export * from './behavior-observe-canvas';
3 | export * from './behavior-roll-canvas';
4 | export * from './behavior-zoom-canvas';
5 | export * from './layer-top';
6 | export * from './layout-d3-force-3d';
7 | export { massiveElements } from './massive-elements';
8 | export * from './position';
9 | export * from './shapes';
10 | export * from './solar-system';
11 | export { switchRenderer } from './switch-renderer';
12 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | @antv/g6-extension-3d
7 |
17 |
18 |
19 |
20 |
21 |
22 |
23 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/types.d.ts:
--------------------------------------------------------------------------------
1 | import type { G6Spec, Graph } from '@antv/g6';
2 | import type { Controller, GUI } from 'lil-gui';
3 |
4 | declare global {
5 | export interface TestCase {
6 | (context: G6Spec): Promise;
7 | form?: (gui: GUI) => Controller[];
8 | }
9 |
10 | export type TestContext = G6Spec;
11 | }
12 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/unit/default.spec.ts:
--------------------------------------------------------------------------------
1 | describe('suite', () => {
2 | it('case', () => {
3 | expect(1).toBe(1);
4 | });
5 | });
6 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/unit/utils/geometry.spec.ts:
--------------------------------------------------------------------------------
1 | import { CubeGeometry } from '@antv/g-plugin-3d';
2 | import { createGeometry } from '../../../src/utils/geometry';
3 |
4 | describe('geometry', () => {
5 | it('createGeometry', () => {
6 | const device: any = {};
7 | const geometry1 = createGeometry('cube', device, CubeGeometry, { width: 1, height: 1, depth: 1 });
8 | const geometry2 = createGeometry('cube', device, CubeGeometry, { depth: 1, height: 1, width: 1 });
9 | const geometry3 = createGeometry('cube', device, CubeGeometry, { width: 2, height: 2, depth: 2 });
10 |
11 | expect(geometry1).toBe(geometry2);
12 | expect(geometry1).not.toBe(geometry3);
13 | });
14 | });
15 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/unit/utils/map.spec.ts:
--------------------------------------------------------------------------------
1 | import { TupleMap } from '../../../src/utils/map';
2 |
3 | describe('map', () => {
4 | it('TupleMap', () => {
5 | const map = new TupleMap();
6 |
7 | const key1 = new Date();
8 | const key2 = 'key2';
9 | map.set(key1, key2, 1);
10 |
11 | expect(map.has(key1, key2)).toBe(true);
12 | expect(map.get(key1, key2)).toBe(1);
13 |
14 | map.set(key1, key2, 2);
15 | expect(map.get(key1, key2)).toBe(2);
16 |
17 | const key3 = 'key3';
18 | expect(map.has(key1, key3)).toBe(false);
19 | expect(map.get(key1, key3)).toBe(undefined);
20 | });
21 | });
22 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/__tests__/unit/utils/texture.spec.ts:
--------------------------------------------------------------------------------
1 | import { createTexture } from '../../../src/utils/texture';
2 |
3 | describe('texture', () => {
4 | it('createTexture', () => {
5 | const img1 = 'texture1';
6 | const img2 = 'texture2';
7 |
8 | const plugin: any = {
9 | loadTexture: () => new Object(),
10 | };
11 |
12 | const texture1 = createTexture(plugin, img1);
13 | const texture2 = createTexture(plugin, img2);
14 |
15 | expect(texture1).toBe(createTexture(plugin, img1));
16 | expect(texture2).not.toBe(texture1);
17 | });
18 | });
19 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | transform: {
3 | '^.+\\.[tj]s$': ['@swc/jest'],
4 | },
5 | testRegex: '(/__tests__/.*\\.(test|spec))\\.(ts|tsx|js)$',
6 | collectCoverageFrom: ['src/**/*.ts'],
7 | moduleFileExtensions: ['ts', 'js', 'json'],
8 | transformIgnorePatterns: [`/node_modules/.pnpm/(?!(d3-*))`],
9 | };
10 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/behaviors/drag-canvas-3d.ts:
--------------------------------------------------------------------------------
1 | import type { DragCanvasOptions, Vector2, ViewportAnimationEffectTiming } from '@antv/g6';
2 | import { DragCanvas } from '@antv/g6';
3 |
4 | /**
5 | * 拖拽 3D 画布交互
6 | *
7 | * Drag 3D canvas behavior
8 | */
9 | export interface DragCanvas3DOptions extends DragCanvasOptions {}
10 |
11 | /**
12 | * 平移画布
13 | *
14 | * Pan canvas
15 | */
16 | export class DragCanvas3D extends DragCanvas {
17 | protected async translate(offset: Vector2, animation?: ViewportAnimationEffectTiming | undefined) {
18 | this.context.canvas.getCamera().pan(-offset[0], -offset[1]);
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/behaviors/index.ts:
--------------------------------------------------------------------------------
1 | export { DragCanvas3D } from './drag-canvas-3d';
2 | export { ObserveCanvas3D } from './observe-canvas-3d';
3 | export { RollCanvas3D } from './roll-canvas-3d';
4 | export { ZoomCanvas3D } from './zoom-canvas-3d';
5 |
6 | export type { DragCanvas3DOptions } from './drag-canvas-3d';
7 | export type { ObserveCanvas3DOptions } from './observe-canvas-3d';
8 | export type { RollCanvas3DOptions } from './roll-canvas-3d';
9 | export type { ZoomCanvas3DOptions } from './zoom-canvas-3d';
10 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/index.ts:
--------------------------------------------------------------------------------
1 | export * from './exports';
2 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/plugins/index.ts:
--------------------------------------------------------------------------------
1 | export { Light } from './light';
2 |
3 | export type { LightOptions } from './light';
4 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/types/index.ts:
--------------------------------------------------------------------------------
1 | export * from './material';
2 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/utils/cache.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 生成对象配置的缓存键
3 | *
4 | * Generate cache key of geometry configuration
5 | * @param props - 对象配置 geometry configuration
6 | * @returns 缓存键 cache key
7 | */
8 | export function getCacheKey(props: Record): symbol {
9 | const entries = Object.entries(props);
10 |
11 | if (entries.some(([, value]) => typeof value === 'object')) {
12 | return Symbol();
13 | }
14 |
15 | const str = entries
16 | .sort((a, b) => a[0].localeCompare(b[0]))
17 | .map(([key, value]) => {
18 | return `${key}:${value}`;
19 | })
20 | .join(' ');
21 |
22 | return Symbol.for(str);
23 | }
24 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/src/utils/map.ts:
--------------------------------------------------------------------------------
1 | export class TupleMap {
2 | private map = new Map>();
3 |
4 | has(key1: K1, key2: K2) {
5 | return this.map.has(key1) && this.map.get(key1)!.has(key2);
6 | }
7 |
8 | get(key1: K1, key2: K2) {
9 | return this.map.get(key1)?.get(key2);
10 | }
11 |
12 | set(key1: K1, key2: K2, value: V) {
13 | if (!this.map.has(key1)) {
14 | this.map.set(key1, new Map());
15 | }
16 | this.map.get(key1)!.set(key2, value);
17 | }
18 |
19 | clear() {
20 | this.map.clear();
21 | }
22 | }
23 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "strict": true,
4 | "outDir": "lib",
5 | "paths": {
6 | "@antv/g6": ["../g6/src/index.ts"]
7 | }
8 | },
9 | "extends": "../../tsconfig.json",
10 | "include": ["src/**/*", "__tests__/**/*"]
11 | }
12 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/tsconfig.test.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*", "__tests__/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/g6-extension-3d/vite.config.js:
--------------------------------------------------------------------------------
1 | import path from 'path';
2 | import { defineConfig } from 'vite';
3 |
4 | export default defineConfig({
5 | root: './__tests__',
6 | server: {
7 | port: 8081,
8 | open: '/',
9 | },
10 | plugins: [{ name: 'isolation' }],
11 | resolve: {
12 | alias: {
13 | '@antv/g6': path.resolve(__dirname, '../g6/src'),
14 | },
15 | },
16 | });
17 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/__tests__/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "rules": {
3 | "no-console": "off"
4 | }
5 | }
--------------------------------------------------------------------------------
/packages/g6-extension-react/__tests__/demos/graph.tsx:
--------------------------------------------------------------------------------
1 | import { Graph } from '../graph';
2 |
3 | export const G6Graph = () => {
4 | return (
5 | {
17 | console.log('render');
18 | }}
19 | onDestroy={() => {
20 | console.log('destroy');
21 | }}
22 | />
23 | );
24 | };
25 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/__tests__/demos/index.tsx:
--------------------------------------------------------------------------------
1 | export * from './euro-cup';
2 | export * from './graph';
3 | export * from './performance-diagnosis';
4 | export * from './react-node';
5 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/__tests__/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | @antv/g6-extension-react
7 |
12 |
13 |
14 |
15 |
16 |
17 |
18 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/__tests__/unit/default.spec.ts:
--------------------------------------------------------------------------------
1 | describe('default', () => {
2 | it('expect', () => {
3 | expect(1).toBe(1);
4 | });
5 | });
6 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/src/index.ts:
--------------------------------------------------------------------------------
1 | export { ReactNode, render, unmount } from './react-node';
2 |
3 | export type { ReactNodeStyleProps } from './react-node';
4 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/src/react-node/index.ts:
--------------------------------------------------------------------------------
1 | export { ReactNode } from './node';
2 | export { render, unmount } from './render';
3 |
4 | export type { ReactNodeStyleProps } from './node';
5 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "strict": true,
4 | "jsx": "react-jsx",
5 | "outDir": "lib",
6 | "paths": {
7 | "@antv/g6": ["../g6/src/index.ts"],
8 | "@antv/g6-extension-react": ["./src/index.ts"]
9 | }
10 | },
11 | "extends": "../../tsconfig.json",
12 | "include": ["src/**/*", "__tests__/**/*"]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/tsconfig.test.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {
4 | "@antv/g6": ["../g6/src/index.ts"],
5 | "@antv/g6-extension-react": ["./src/index.ts"]
6 | },
7 | "skipLibCheck": true
8 | },
9 | "include": ["src/**/*", "__tests__/**/*", "../g6/src/layouts/hierarchy.d.ts"],
10 | "extends": "./tsconfig.json"
11 | }
12 |
--------------------------------------------------------------------------------
/packages/g6-extension-react/vite.config.js:
--------------------------------------------------------------------------------
1 | import path from 'path';
2 | import { defineConfig } from 'vite';
3 |
4 | export default defineConfig({
5 | root: './__tests__',
6 | server: {
7 | port: 8082,
8 | open: '/',
9 | },
10 | plugins: [{ name: 'isolation' }],
11 | resolve: {
12 | alias: {
13 | '@antv/g6': path.resolve(__dirname, '../g6/src'),
14 | '@antv/g6-extension-react': path.resolve(__dirname, './src'),
15 | },
16 | },
17 | });
18 |
--------------------------------------------------------------------------------
/packages/g6-ssr/.gitignore:
--------------------------------------------------------------------------------
1 | **/*-actual.*
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/bin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/bin.png
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/file.pdf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/file.pdf
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/image-rough.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/image-rough.png
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/image.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/image.jpeg
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/image.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/image.png
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/image_x1.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/image_x1.jpeg
--------------------------------------------------------------------------------
/packages/g6-ssr/__tests__/assets/node-image.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/g6-ssr/__tests__/assets/node-image.jpeg
--------------------------------------------------------------------------------
/packages/g6-ssr/jest.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | forceExit: true,
3 | transform: {
4 | '^.+\\.[tj]s$': ['@swc/jest'],
5 | },
6 | collectCoverageFrom: ['src/**/*.ts'],
7 | moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
8 | transformIgnorePatterns: [`/node_modules/.pnpm/(?!(d3-*))`],
9 | moduleNameMapper: {
10 | '@antv/g6': '/../g6/src',
11 | },
12 | };
13 |
--------------------------------------------------------------------------------
/packages/g6-ssr/src/index.ts:
--------------------------------------------------------------------------------
1 | import * as G6 from '@antv/g6';
2 |
3 | export { getExtension, getExtensions, register } from '@antv/g6';
4 | export { createCanvas } from './canvas';
5 | export { createGraph } from './graph';
6 | export type { Graph, MetaData, Options } from './types';
7 | export { G6 };
8 |
--------------------------------------------------------------------------------
/packages/g6-ssr/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/g6-ssr/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "strict": true,
4 | "outDir": "lib",
5 | "target": "ESNext",
6 | "module": "CommonJS",
7 | "lib": ["ESNext"],
8 | "paths": {
9 | "@antv/g6": ["../g6/src/index.ts"]
10 | }
11 | },
12 | "extends": "../../tsconfig.json",
13 | "include": ["src/**/*", "__tests__/**/*"]
14 | }
15 |
--------------------------------------------------------------------------------
/packages/g6-ssr/tsconfig.test.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*", "__tests__/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/g6/.gitignore:
--------------------------------------------------------------------------------
1 | __tests__/**/*-actual.*
2 |
3 | README.*
--------------------------------------------------------------------------------
/packages/g6/__tests__/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 | "rules": {
3 | "no-console": "off"
4 | }
5 | }
--------------------------------------------------------------------------------
/packages/g6/__tests__/assets/factory.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/bugs/api-focus-element-edge.spec.ts:
--------------------------------------------------------------------------------
1 | import { behaviorDragNode } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | it('api focusElement edge', async () => {
5 | const graph = await createDemoGraph(behaviorDragNode, { animation: false });
6 |
7 | graph.translateBy([100, 100]);
8 | graph.zoomBy(2);
9 |
10 | graph.focusElement('node-3');
11 |
12 | await expect(graph).toMatchSnapshot(__filename);
13 |
14 | graph.focusElement('node-3-node-4');
15 |
16 | await expect(graph).toMatchSnapshot(__filename, 'focusElement edge');
17 | });
18 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/bugs/continuous-invoke.spec.ts:
--------------------------------------------------------------------------------
1 | import { createGraph } from '@@/utils';
2 |
3 | describe('bugs:continuous-invoke', () => {
4 | it('continuous invoke', () => {
5 | const graph = createGraph({});
6 | const fn = jest.fn(async () => {
7 | graph.destroy();
8 | await graph.render();
9 | });
10 |
11 | expect(fn).rejects.toThrow();
12 | });
13 | });
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/bugs/graph-draw-after-clear.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeLine } from '@@/demos';
2 | import { createDemoGraph, sleep } from '@@/utils';
3 |
4 | it('graph draw after clear', async () => {
5 | const graph = await createDemoGraph(elementEdgeLine);
6 |
7 | const data = graph.getData();
8 |
9 | await graph.clear();
10 |
11 | await expect(graph).toMatchSnapshot(__filename, 'blank');
12 |
13 | await sleep(200);
14 |
15 | graph.addData(data);
16 | await graph.draw();
17 |
18 | await expect(graph).toMatchSnapshot(__filename);
19 | });
20 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/bugs/render-deleted-data.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutCompactBoxBasic } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('render deleted data', () => {
5 | it('bug', async () => {
6 | const graph = await createDemoGraph(layoutCompactBoxBasic);
7 |
8 | const render = jest.fn(async () => {
9 | graph.removeNodeData(['Classification']);
10 | await graph.render();
11 | });
12 |
13 | expect(render).not.toThrow();
14 | });
15 | });
16 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/dataset/element-edges.json:
--------------------------------------------------------------------------------
1 | {
2 | "nodes": [
3 | { "id": "node1" },
4 | { "id": "node2" },
5 | { "id": "node3" },
6 | { "id": "node4" },
7 | { "id": "node5" },
8 | { "id": "node6" }
9 | ],
10 | "edges": [
11 | { "id": "line-default", "source": "node1", "target": "node2" },
12 | { "id": "line-active", "source": "node1", "target": "node3", "states": ["active"] },
13 | { "id": "line-selected", "source": "node1", "target": "node4", "states": ["selected"] },
14 | { "id": "line-highlight", "source": "node1", "target": "node5", "states": ["highlight"] },
15 | { "id": "line-inactive", "source": "node1", "target": "node6", "states": ["inactive"] }
16 | ]
17 | }
18 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/dataset/file-system.json:
--------------------------------------------------------------------------------
1 | {
2 | "id": "src",
3 | "children": [
4 | { "id": "animations" },
5 | { "id": "behaviors" },
6 | { "id": "elements", "children": [{ "id": "nodes" }, { "id": "edges" }, { "id": "combos" }] },
7 | { "id": "layouts" },
8 | {
9 | "id": "runtime",
10 | "children": [
11 | { "id": "canvas" },
12 | { "id": "data" },
13 | { "id": "element" },
14 | { "id": "graph" },
15 | { "id": "layout" },
16 | { "id": "viewport" }
17 | ]
18 | },
19 | { "id": "spec" },
20 | { "id": "themes", "children": [{ "id": "dark" }, { "id": "light" }] }
21 | ]
22 | }
23 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/common-graph.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/cluster.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const commonGraph: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | style: {
10 | fill: (d) => (d.id === '33' ? '#d4414c' : '#2f363d'),
11 | },
12 | },
13 | layout: { type: 'd3-force' },
14 | behaviors: ['zoom-canvas', 'drag-canvas'],
15 | plugins: [],
16 | });
17 |
18 | await graph.render();
19 |
20 | return graph;
21 | };
22 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-edge-cubic-radial.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/algorithm-category.json';
2 | import { Graph, treeToGraphData } from '@antv/g6';
3 |
4 | export const elementEdgeCubicRadial: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | autoFit: 'view',
8 | data: treeToGraphData(data),
9 | edge: {
10 | type: 'cubic-radial',
11 | },
12 | layout: {
13 | type: 'dendrogram',
14 | radial: true,
15 | nodeSep: 30,
16 | rankSep: 200,
17 | preLayout: true,
18 | },
19 | });
20 |
21 | await graph.render();
22 |
23 | return graph;
24 | };
25 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-edge-cubic.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-edges.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementEdgeCubic: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | edge: {
9 | type: 'cubic', // 👈🏻 Edge shape type.
10 | style: {
11 | labelText: (d) => d.id!,
12 | labelBackground: true,
13 | endArrow: true,
14 | },
15 | },
16 | layout: {
17 | type: 'radial',
18 | unitRadius: 220,
19 | linkDistance: 220,
20 | },
21 | });
22 |
23 | await graph.render();
24 |
25 | return graph;
26 | };
27 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-edge-quadratic.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-edges.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementEdgeQuadratic: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | edge: {
9 | type: 'quadratic', // 👈🏻 Edge shape type.
10 | style: {
11 | labelText: (d) => d.id!,
12 | labelBackground: true,
13 | endArrow: true,
14 | },
15 | },
16 | layout: {
17 | type: 'radial',
18 | unitRadius: 220,
19 | linkDistance: 220,
20 | },
21 | });
22 |
23 | await graph.render();
24 |
25 | return graph;
26 | };
27 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-node-circle.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-nodes.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementNodeCircle: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | type: 'circle', // 👈🏻 Node shape type.
10 | style: {
11 | iconFontFamily: 'iconfont',
12 | iconText: '\ue602',
13 | labelText: (d) => d.id!,
14 | size: 40,
15 | },
16 | },
17 | layout: {
18 | type: 'grid',
19 | },
20 | });
21 |
22 | await graph.render();
23 |
24 | return graph;
25 | };
26 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-node-diamond.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-nodes.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementNodeDiamond: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | type: 'diamond', // 👈🏻 Node shape type.
10 | style: {
11 | size: 40,
12 | labelText: (d) => d.id!,
13 | iconFontFamily: 'iconfont',
14 | iconText: '\ue602',
15 | },
16 | },
17 | layout: {
18 | type: 'grid',
19 | },
20 | });
21 | await graph.render();
22 |
23 | return graph;
24 | };
25 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-node-ellipse.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-nodes.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementNodeEllipse: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | type: 'ellipse', // 👈🏻 Node shape type.
10 | style: {
11 | size: [45, 35],
12 | labelText: (d) => d.id!,
13 | iconHeight: 20,
14 | iconWidth: 20,
15 | iconFontFamily: 'iconfont',
16 | iconText: '\ue602',
17 | },
18 | },
19 | layout: {
20 | type: 'grid',
21 | },
22 | });
23 |
24 | await graph.render();
25 |
26 | return graph;
27 | };
28 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-node-hexagon.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-nodes.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementNodeHexagon: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | type: 'hexagon', // 👈🏻 Node shape type.
10 | style: {
11 | size: 40,
12 | labelText: (d) => d.id!,
13 | iconFontFamily: 'iconfont',
14 | iconText: '\ue602',
15 | },
16 | },
17 | layout: {
18 | type: 'grid',
19 | },
20 | });
21 |
22 | await graph.render();
23 |
24 | return graph;
25 | };
26 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-node-rect.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-nodes.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementNodeRect: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | type: 'rect', // 👈🏻 Node shape type.
10 | style: {
11 | radius: 4, // 👈🏻 Set the radius.
12 | size: 40,
13 | labelText: (d) => d.id!,
14 | iconFontFamily: 'iconfont',
15 | iconText: '\ue602',
16 | },
17 | },
18 | layout: {
19 | type: 'grid',
20 | },
21 | });
22 |
23 | await graph.render();
24 |
25 | return graph;
26 | };
27 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/element-node-star.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/element-nodes.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const elementNodeStar: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | type: 'star', // 👈🏻 Node shape type.
10 | style: {
11 | size: 40,
12 | labelText: (d) => d.id!,
13 | iconFontFamily: 'iconfont',
14 | iconText: '\ue602',
15 | },
16 | },
17 | layout: {
18 | type: 'grid',
19 | },
20 | });
21 |
22 | await graph.render();
23 |
24 | return graph;
25 | };
26 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-circular-basic.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/circular.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutCircularBasic: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | autoFit: 'view',
8 | data,
9 | layout: {
10 | type: 'circular',
11 | },
12 | behaviors: ['zoom-canvas', 'drag-canvas'],
13 | });
14 |
15 | await graph.render();
16 |
17 | return graph;
18 | };
19 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-circular-configuration-translate.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/circular.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutCircularConfigurationTranslate: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | autoFit: 'view',
8 | data,
9 | edge: {
10 | style: {
11 | endArrow: true,
12 | endArrowType: 'vee',
13 | },
14 | },
15 | layout: {
16 | type: 'circular',
17 | },
18 | behaviors: ['drag-canvas', 'drag-element'],
19 | });
20 |
21 | await graph.render();
22 |
23 | return graph;
24 | };
25 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-circular-degree.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/circular.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutCircularDegree: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | autoFit: 'view',
8 | data,
9 | node: {
10 | style: {
11 | labelText: (d) => d.id,
12 | },
13 | },
14 | edge: {
15 | style: {
16 | endArrow: true,
17 | endArrowType: 'vee',
18 | },
19 | },
20 | layout: {
21 | type: 'circular',
22 | ordering: 'degree',
23 | },
24 | behaviors: ['zoom-canvas', 'drag-canvas'],
25 | });
26 |
27 | await graph.render();
28 |
29 | return graph;
30 | };
31 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-concentric.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/gene.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutConcentric: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | autoFit: 'view',
8 | data,
9 | layout: {
10 | type: 'concentric',
11 | maxLevelDiff: 0.5,
12 | preventOverlap: true,
13 | },
14 | behaviors: ['zoom-canvas', 'drag-canvas', 'drag-element'],
15 | animation: false,
16 | });
17 |
18 | await graph.render();
19 |
20 | return graph;
21 | };
22 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-dendrogram-radial.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/algorithm-category.json';
2 | import { Graph, treeToGraphData } from '@antv/g6';
3 |
4 | export const layoutDendrogramRadial: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | autoFit: 'view',
8 | data: treeToGraphData(data),
9 | node: {
10 | style: {
11 | labelText: (d) => d.id,
12 | },
13 | },
14 | layout: {
15 | type: 'dendrogram',
16 | radial: true,
17 | nodeSep: 30,
18 | rankSep: 200,
19 | },
20 | });
21 |
22 | await graph.render();
23 |
24 | return graph;
25 | };
26 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-fruchterman-basic.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/cluster.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutFruchtermanBasic: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | style: {
10 | labelPlacement: 'center',
11 | labelText: (d) => d.id,
12 | },
13 | },
14 | layout: {
15 | type: 'fruchterman',
16 | gravity: 5,
17 | speed: 5,
18 | },
19 | behaviors: ['drag-canvas', 'drag-element'],
20 | });
21 |
22 | await graph.render();
23 |
24 | return graph;
25 | };
26 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-fruchterman-fix.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/relations.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutFruchtermanFix: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | layout: {
9 | type: 'fruchterman',
10 | speed: 10,
11 | maxIteration: 500,
12 | },
13 | behaviors: ['drag-canvas', 'drag-element'],
14 | });
15 |
16 | graph.on('node:dragstart', function () {
17 | graph.stopLayout();
18 | });
19 |
20 | graph.on('node:dragend', function () {
21 | // FIXME: 不应该完全重新布局，而是以当前画布数据进行布局
22 | graph.layout();
23 | });
24 |
25 | await graph.render();
26 |
27 | return graph;
28 | };
29 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/demos/layout-radial-basic.ts:
--------------------------------------------------------------------------------
1 | import data from '@@/dataset/radial.json';
2 | import { Graph } from '@antv/g6';
3 |
4 | export const layoutRadialBasic: TestCase = async (context) => {
5 | const graph = new Graph({
6 | ...context,
7 | data,
8 | node: {
9 | style: {
10 | labelText: (d) => d.id,
11 | labelPlacement: 'center',
12 | },
13 | },
14 | layout: {
15 | type: 'radial',
16 | unitRadius: 50,
17 | },
18 | behaviors: ['drag-canvas', 'drag-element'],
19 | });
20 |
21 | await graph.render();
22 |
23 | return graph;
24 | };
25 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/setup.ts:
--------------------------------------------------------------------------------
1 | import 'jest-canvas-mock';
2 | import './utils/to-be-close-to';
3 | import './utils/use-snapshot-matchers';
4 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/behaviors/drag-canvas/drag-on-element-default.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/behaviors/drag-canvas/drag-on-element.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/bugs/behaviors-multiple-conflict/default.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/bugs/behaviors-multiple-conflict/drag-canvas.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/bugs/behaviors-multiple-conflict/drag-element.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/bugs/element-custom-state-switch/single.svg:
--------------------------------------------------------------------------------
1 |
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/snapshots/bugs/graph-draw-after-clear/blank.svg:
--------------------------------------------------------------------------------
1 |
8 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/default.spec.ts:
--------------------------------------------------------------------------------
1 | describe('default', () => {
2 | it('expect', () => {
3 | expect(1).toBe(1);
4 | });
5 | });
6 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/arrow.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeArrow } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge arrow', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeArrow);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/cubic-horizontal.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeCubicHorizontal } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge cubic horizontal', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeCubicHorizontal);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/cubic-radial.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeCubicRadial } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge cubic radial', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeCubicRadial);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/cubic-vertical.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeCubicVertical } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge cubic vertical', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeCubicVertical);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/cubic.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeCubic } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge cubic', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeCubic);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/custom-arrow.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeCustomArrow } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge custom arrow', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeCustomArrow);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/line.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeLine } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge line', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeLine);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/loop-curve.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeLoopCurve } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge loop curve', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeLoopCurve);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/loop-polyline.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeLoopPolyline } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge loop polyline', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeLoopPolyline);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/polyline.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgePolyline } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge polyline', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgePolyline);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/port.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgePort } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge port', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgePort);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/quadratic.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeQuadratic } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge quadratic', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeQuadratic);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/edges/size.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementEdgeSize } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element edge line size', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementEdgeSize);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/label-background.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementLabelBackground } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label background', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementLabelBackground);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/label-oversized.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementLabelOversized } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementLabelOversized);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/avatar.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeAvatar } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeAvatar);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/circle.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeCircle } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeCircle);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/diamond.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeDiamond } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeDiamond);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/donut.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeDonut } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeDonut);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/ellipse.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeEllipse } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeEllipse);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/hexagon.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeHexagon } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeHexagon);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/image.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeImage } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeImage);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/rect.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeRect } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeRect);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/star.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeStar } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeStar);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/nodes/triangle.spec.ts:
--------------------------------------------------------------------------------
1 | import { elementNodeTriangle } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('element label oversized', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(elementNodeTriangle);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/elements/position-combo.spec.ts:
--------------------------------------------------------------------------------
1 | import type { Graph } from '@/src';
2 | import { elementPositionCombo } from '@@/demos';
3 | import { createDemoGraph } from '@@/utils';
4 |
5 | describe('element position combo', () => {
6 | let graph: Graph;
7 |
8 | beforeAll(async () => {
9 | graph = await createDemoGraph(elementPositionCombo, { animation: false });
10 | });
11 |
12 | afterAll(() => {
13 | graph.destroy();
14 | });
15 |
16 | it('default status', async () => {
17 | await expect(graph).toMatchSnapshot(__filename);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/import.spec.ts:
--------------------------------------------------------------------------------
1 | import * as G6 from '@/src';
2 |
3 | describe('import', () => {
4 | it('default', () => {
5 | expect(G6).not.toBe(undefined);
6 | const entries = Object.entries(G6);
7 | expect(entries.length).toBeGreaterThan(0);
8 | });
9 | });
10 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/combo-layout.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutComboCombined } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('combo layout', () => {
5 | it('combined', async () => {
6 | const graph = await createDemoGraph(layoutComboCombined);
7 | await expect(graph).toMatchSnapshot(__filename, 'combined');
8 | graph.destroy();
9 | });
10 | });
11 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/concentric.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutConcentric } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('layout concentric', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(layoutConcentric);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/custom-dagre.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutCustomDagre } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('custom dagre', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(layoutCustomDagre);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/custom-layout-horizontal.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutCustomHorizontal } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('custom layout horizontal', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(layoutCustomHorizontal);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/d3-force-collision.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutForceCollision } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 | import { clear as clearMockRandom, mock as mockRandom } from 'jest-random-mock';
4 |
5 | describe('layout d3 force collision', () => {
6 | beforeAll(() => {
7 | mockRandom();
8 | });
9 |
10 | afterAll(() => {
11 | clearMockRandom();
12 | });
13 |
14 | it('render', async () => {
15 | const graph = await createDemoGraph(layoutForceCollision);
16 | await expect(graph).toMatchSnapshot(__filename);
17 |
18 | graph.destroy();
19 | });
20 | });
21 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/d3-force-lattice.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutForceLattice } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('layout d3 force lattice', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(layoutForceLattice);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | // drag
10 |
11 | graph.destroy();
12 | });
13 | });
14 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/d3-force.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutD3Force } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('layout d3 force', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(layoutD3Force);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/dendrogram.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutDendrogramBasic, layoutDendrogramTb } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('dendrogram', () => {
5 | it('basic', async () => {
6 | const graph = await createDemoGraph(layoutDendrogramBasic);
7 | await expect(graph).toMatchSnapshot(__filename, 'basic');
8 | graph.destroy();
9 | });
10 |
11 | it('tb', async () => {
12 | const graph = await createDemoGraph(layoutDendrogramTb);
13 | await expect(graph).toMatchSnapshot(__filename, 'tb');
14 | graph.destroy();
15 | });
16 | });
17 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/indented.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutIndented } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('layout d3 force', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(layoutIndented);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/layouts/mds.spec.ts:
--------------------------------------------------------------------------------
1 | import type { Graph } from '@/src';
2 | import { layoutMDS } from '@@/demos/layout-mds';
3 | import { createDemoGraph } from '@@/utils';
4 |
5 | describe('mds', () => {
6 | let graph: Graph;
7 |
8 | beforeAll(async () => {
9 | graph = await createDemoGraph(layoutMDS);
10 | });
11 |
12 | afterAll(() => {
13 | graph.destroy();
14 | });
15 |
16 | it('mds linkDistance = 100', async () => {
17 | await expect(graph).toMatchSnapshot(__filename, 'ld100');
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/plugins/edge-bundling.spec.ts:
--------------------------------------------------------------------------------
1 | import { createDemoGraph } from '@@/utils';
2 | import type { Graph } from '@antv/g6';
3 | import { pluginEdgeBundling } from '../../demos';
4 |
5 | describe('plugin edge bundling', () => {
6 | let graph: Graph;
7 |
8 | beforeAll(async () => {
9 | graph = await createDemoGraph(pluginEdgeBundling, { animation: false });
10 | });
11 |
12 | afterAll(() => {
13 | graph.destroy();
14 | });
15 |
16 | it('default edge bundling', async () => {
17 | await expect(graph).toMatchSnapshot(__filename);
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/runtime/graph/add-children-data.spec.ts:
--------------------------------------------------------------------------------
1 | import { layoutCompactBoxBasic } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('add children data', () => {
5 | it('default', async () => {
6 | const graph = await createDemoGraph(layoutCompactBoxBasic, { animation: false });
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.addChildrenData('Rules', [{ id: 'node-1' }, { id: 'node-2' }]);
10 | await graph.render();
11 |
12 | await expect(graph).toMatchSnapshot(__filename, 'add-children-data');
13 | });
14 | });
15 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/spec/behavior.spec.ts:
--------------------------------------------------------------------------------
1 | import type { BehaviorOptions } from '@/src';
2 |
3 | describe('spec behavior', () => {
4 | it('behavior', () => {
5 | const behavior: BehaviorOptions = ['drag-canvas', 'zoom-canvas', { type: 'unset' }, { type: 'any', anyProps: 1 }];
6 |
7 | expect(behavior).toBeTruthy();
8 | });
9 | });
10 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/spec/canvas.spec.ts:
--------------------------------------------------------------------------------
1 | import type { CanvasOptions } from '@/src';
2 | import { Renderer } from '@antv/g-canvas';
3 |
4 | describe('spec canvas', () => {
5 | it('canvas', () => {
6 | const canvas: CanvasOptions = {
7 | width: 100,
8 | height: 100,
9 | renderer: () => new Renderer(),
10 | autoResize: true,
11 | };
12 |
13 | expect(canvas).toBeTruthy();
14 | });
15 | });
16 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/spec/optimize.spec.ts:
--------------------------------------------------------------------------------
1 | describe('spec optimize', () => {
2 | it('optimize 1', () => {
3 | expect(1).toBe(1);
4 | });
5 | });
6 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/spec/plugin.spec.ts:
--------------------------------------------------------------------------------
1 | import type { PluginOptions } from '@/src';
2 |
3 | describe('spec plugin', () => {
4 | it('plugin', () => {
5 | const plugin: PluginOptions = ['minimap', { type: 'unset', key: '1' }];
6 |
7 | expect(plugin).toBeTruthy();
8 | });
9 | });
10 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/spec/viewport.spec.ts:
--------------------------------------------------------------------------------
1 | import type { ViewportOptions } from '@/src';
2 |
3 | describe('spec viewport', () => {
4 | it('viewport 1', () => {
5 | const viewport: ViewportOptions = {
6 | autoFit: 'view',
7 | padding: 0,
8 | zoom: 1,
9 | zoomRange: [0.5, 2],
10 | };
11 |
12 | expect(viewport).toBeTruthy();
13 | });
14 |
15 | it('viewport 2', () => {
16 | const viewport: ViewportOptions = {
17 | autoFit: {
18 | type: 'center',
19 | animation: {
20 | duration: 1000,
21 | },
22 | },
23 | padding: [10, 10],
24 | zoom: 0.5,
25 | };
26 |
27 | expect(viewport).toBeTruthy();
28 | });
29 | });
30 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/themes/base.spec.ts:
--------------------------------------------------------------------------------
1 | import { create } from '@/src/themes/base';
2 |
3 | describe('base', () => {
4 | it('create', () => {
5 | expect(
6 | create({
7 | bgColor: '#ffffff',
8 | comboColor: '#99ADD1',
9 | comboColorDisabled: '#f0f0f0',
10 | comboStroke: '#99add1',
11 | comboStrokeDisabled: '#d9d9d9',
12 | edgeColor: '#99add1',
13 | edgeColorDisabled: '#d9d9d9',
14 | edgeColorInactive: '#1B324F',
15 | nodeColor: '#1783ff',
16 | nodeColorDisabled: '#1B324F',
17 | nodeStroke: '#000000',
18 | textColor: '#000000',
19 | }),
20 | ).toBeTruthy();
21 | });
22 | });
23 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/transforms/base-transform.spec.ts:
--------------------------------------------------------------------------------
1 | import { BaseTransform } from '@/src/transforms/base-transform';
2 |
3 | describe('BaseTransform', () => {
4 | it('beforeDraw', () => {
5 | class Transform extends BaseTransform {}
6 |
7 | const baseTransform = new Transform({} as any, {});
8 | expect(baseTransform.beforeDraw({} as any, {})).toEqual({});
9 | });
10 | });
11 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/transforms/transform-position-radial-labels.spec.ts:
--------------------------------------------------------------------------------
1 | import { transformPlaceRadialLabels } from '@@/demos';
2 | import { createDemoGraph } from '@@/utils';
3 |
4 | describe('transform position radial labels', () => {
5 | it('render', async () => {
6 | const graph = await createDemoGraph(transformPlaceRadialLabels);
7 | await expect(graph).toMatchSnapshot(__filename);
8 |
9 | graph.destroy();
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/array.spec.ts:
--------------------------------------------------------------------------------
1 | import { deduplicate } from '@/src/utils/array';
2 |
3 | describe('array', () => {
4 | it('deduplicate', () => {
5 | expect(deduplicate([1, 2, 3, 4, 5, 1, 2, 3, 4, 5])).toEqual([1, 2, 3, 4, 5]);
6 |
7 | expect(
8 | deduplicate(
9 | [{ id: 'node-1', data: { value: 1 } }, { id: 'node-2' }, { id: 'node-1', data: { value: 2 } }],
10 | (item) => item.id,
11 | ),
12 | ).toEqual(expect.arrayContaining([{ id: 'node-1', data: { value: 1 } }, { id: 'node-2' }]));
13 | });
14 | });
15 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/collapsibility.spec.ts:
--------------------------------------------------------------------------------
1 | import { isCollapsed } from '@/src/utils/collapsibility';
2 |
3 | describe('collapsibility', () => {
4 | it('isCollapsed', () => {
5 | expect(isCollapsed({ id: 'xxx' })).toBe(false);
6 | expect(isCollapsed({ id: 'xxx', style: { collapsed: true } })).toBe(true);
7 | expect(isCollapsed({ id: 'xxx', style: { collapsed: false } })).toBe(false);
8 | });
9 | });
10 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/contextmenu.spec.ts:
--------------------------------------------------------------------------------
1 | import { getContentFromItems } from '@/src/plugins/contextmenu/util';
2 |
3 | describe('contextmenu', () => {
4 | it('getContentFromItems', () => {
5 | expect(
6 | getContentFromItems([
7 | { name: 'expand', value: 'expand' },
8 | { name: 'collapse', value: 'collapse' },
9 | ]),
10 | ).toEqual(`
11 |
14 | `);
15 | });
16 | });
17 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/dom.spec.ts:
--------------------------------------------------------------------------------
1 | import { sizeOf } from '@/src/utils/dom';
2 |
3 | describe('dom', () => {
4 | it('should return the size of the graph container', () => {
5 | // Create a mock container element
6 | const container = document.createElement('div');
7 | container.style.width = '500px';
8 | container.style.height = '300px';
9 |
10 | // Call the sizeOf function
11 | const result = sizeOf(container);
12 |
13 | // Assert the result
14 | expect(result).toEqual([500, 300]);
15 | });
16 | });
17 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/math.spec.ts:
--------------------------------------------------------------------------------
1 | import { isBetween } from '@/src/utils/math';
2 |
3 | describe('math', () => {
4 | it('isBetween', () => {
5 | expect(isBetween(1, 0, 2)).toBe(true);
6 | expect(isBetween(1, 2, 3)).toBe(false);
7 | });
8 | });
9 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/random.spec.ts:
--------------------------------------------------------------------------------
1 | import { createDeterministicRandom } from '@@/utils';
2 |
3 | describe('createDeterministicRandom', () => {
4 | it('should generate a random number between 0 and 1', () => {
5 | const r1 = createDeterministicRandom();
6 | const r2 = createDeterministicRandom();
7 |
8 | expect(new Array(100).fill(0).map(r1)).toEqual(new Array(100).fill(0).map(r2));
9 | expect(r1()).toBeGreaterThanOrEqual(0);
10 | expect(r1()).toBeLessThan(1);
11 | });
12 | });
13 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/size.spec.ts:
--------------------------------------------------------------------------------
1 | import { parseSize } from '@/src/utils/size';
2 |
3 | describe('size', () => {
4 | it('parseSize', () => {
5 | expect(parseSize()).toEqual([0, 0, 0]);
6 | expect(parseSize(10)).toEqual([10, 10, 10]);
7 | expect(parseSize([10, 20])).toEqual([10, 20, 10]);
8 | expect(parseSize([10, 20, 30])).toEqual([10, 20, 30]);
9 | });
10 | });
11 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/state.spec.ts:
--------------------------------------------------------------------------------
1 | import { statesOf } from '@/src/utils/state';
2 |
3 | describe('state', () => {
4 | it('statesOf', () => {
5 | expect(
6 | statesOf({
7 | id: 'node-1',
8 | }),
9 | ).toEqual([]);
10 |
11 | expect(
12 | statesOf({
13 | id: 'node-1',
14 | states: ['selected'],
15 | }),
16 | ).toEqual(['selected']);
17 | });
18 | });
19 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/text.spec.ts:
--------------------------------------------------------------------------------
1 | import { getWordWrapWidthWithBase } from '@/src/utils/text';
2 |
3 | describe('text', () => {
4 | it('getWordWrapWidthWithBase', () => {
5 | expect(getWordWrapWidthWithBase(10, 100)).toBe(100);
6 | expect(getWordWrapWidthWithBase(10, '100%')).toBe(10);
7 | expect(getWordWrapWidthWithBase(10, '100!')).toBe(20);
8 | });
9 | });
10 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/theme.spec.ts:
--------------------------------------------------------------------------------
1 | import { register } from '@/src/registry/register';
2 | import { themeOf } from '@/src/utils/theme';
3 |
4 | describe('theme', () => {
5 | it('themeOf', () => {
6 | expect(themeOf({})).toEqual({});
7 | expect(themeOf({ theme: 'null' })).toEqual({});
8 |
9 | const theme = { node: {} };
10 | register('theme', 'light', theme);
11 |
12 | expect(themeOf({ theme: 'light' })).toBe(theme);
13 | });
14 | });
15 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/utils/z-index.spec.ts:
--------------------------------------------------------------------------------
1 | import { getZIndexOf } from '@/src/utils/z-index';
2 |
3 | describe('z-index', () => {
4 | it('getZIndexOf', () => {
5 | expect(getZIndexOf({ id: 'node-1' })).toBe(0);
6 | expect(getZIndexOf({ id: 'node-1', style: {} })).toBe(0);
7 | expect(getZIndexOf({ id: 'node-1', style: { zIndex: 1 } })).toBe(1);
8 | });
9 | });
10 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/unit/version.spec.ts:
--------------------------------------------------------------------------------
1 | import pkg from '@/package.json';
2 | import { version } from '@/src';
3 |
4 | describe('version', () => {
5 | it('version', () => {
6 | expect(version).toBe(pkg.version);
7 | });
8 | });
9 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/utils/canvas.ts:
--------------------------------------------------------------------------------
1 | import type { Graph } from '@/src';
2 | import { CustomEvent } from '@antv/g';
3 |
4 | export function dispatchCanvasEvent(graph: Graph, type: string, data?: any) {
5 | // @ts-expect-error private method
6 | const canvas = graph.context.canvas.document;
7 | canvas.dispatchEvent(new CustomEvent(type, data));
8 | }
9 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/utils/dom.ts:
--------------------------------------------------------------------------------
1 | import type { Graph } from '@/src';
2 | import { CommonEvent } from '@/src';
3 |
4 | export function emitWheelEvent(
5 | graph: Graph,
6 | options?: { deltaX: number; deltaY: number; clientX: number; clientY: number },
7 | ) {
8 | const dom = graph.getCanvas().getContextService().getDomElement();
9 | dom?.dispatchEvent(new WheelEvent(CommonEvent.WHEEL, options));
10 | }
11 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/utils/index.ts:
--------------------------------------------------------------------------------
1 | export { dispatchCanvasEvent } from './canvas';
2 | export { createDemoGraph, createEdgeNode, createGraph, createGraphCanvas } from './create';
3 | export { createDeterministicRandom } from './random';
4 | export { sleep } from './sleep';
5 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/utils/random.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Get random number(0 - 1) generator, with deterministic random number.
3 | * @returns Random number
4 | */
5 | export function createDeterministicRandom() {
6 | let i = 0;
7 | return () => {
8 | i++;
9 | return (Math.E * i) % 1;
10 | };
11 | }
12 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/utils/sleep.ts:
--------------------------------------------------------------------------------
1 | export function sleep(n: number) {
2 | return new Promise((resolve) => {
3 | setTimeout(resolve, n);
4 | });
5 | }
6 |
--------------------------------------------------------------------------------
/packages/g6/__tests__/utils/svg-transformer.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | process() {
3 | return {
4 | code: `module.exports = {};`,
5 | };
6 | },
7 | };
8 |
--------------------------------------------------------------------------------
/packages/g6/perf.config.js:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'iperf';
2 | import path from 'path';
3 |
4 | export default defineConfig({
5 | perf: {
6 | report: {
7 | dir: './__tests__/perf-report',
8 | },
9 | },
10 | resolve: {
11 | alias: {
12 | '@antv/g6': path.resolve(__dirname, './src'),
13 | },
14 | },
15 | });
16 |
--------------------------------------------------------------------------------
/packages/g6/scripts/version.mjs:
--------------------------------------------------------------------------------
1 | import { readFileSync, writeFileSync } from 'fs';
2 |
3 | const pkg = readFileSync('./package.json', 'utf-8');
4 | const version = JSON.parse(pkg).version;
5 | writeFileSync('./src/version.ts', `export const version = '${version}';\n`, 'utf-8');
6 |
--------------------------------------------------------------------------------
/packages/g6/src/animations/index.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 内置的动画元素。
3 | * Built-in animations.
4 | */
5 | export { executor } from './executor';
6 |
7 | export const Fade = [{ fields: ['opacity'] }];
8 |
9 | export const Translate = [{ fields: ['x', 'y'] }];
10 |
11 | export const NodeCollapse = [{ fields: ['x', 'y'] }];
12 |
13 | export const NodeExpand = NodeCollapse;
14 |
15 | export const PathIn = [{ fields: ['sourceNode', 'targetNode'] }];
16 |
17 | export const PathOut = PathIn;
18 |
19 | export const ComboCollapse = [{ fields: ['childrenNode', 'x', 'y'] }];
20 |
21 | export const ComboExpand = ComboCollapse;
22 |
23 | export const ComboCollapseExpand = [{ fields: ['childrenNode', 'x', 'y'] }];
24 |
--------------------------------------------------------------------------------
/packages/g6/src/behaviors/base-behavior.ts:
--------------------------------------------------------------------------------
1 | import { BaseExtension } from '../registry/extension';
2 | import type { CustomBehaviorOption } from '../spec/behavior';
3 |
4 | /**
5 | * 交互通用配置项
6 | *
7 | * Base options for behaviors
8 | */
9 | export interface BaseBehaviorOptions extends CustomBehaviorOption {}
10 |
11 | /**
12 | * 交互的基类
13 | *
14 | * Base class for behaviors
15 | */
16 | export abstract class BaseBehavior extends BaseExtension {}
17 |
--------------------------------------------------------------------------------
/packages/g6/src/behaviors/types.ts:
--------------------------------------------------------------------------------
1 | import type { BaseBehavior } from './base-behavior';
2 |
3 | export type Behavior = BaseBehavior;
4 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/animation.ts:
--------------------------------------------------------------------------------
1 | import type { AnimationEffectTiming } from '../animations/types';
2 |
3 | export const DEFAULT_ANIMATION_OPTIONS: AnimationEffectTiming = {
4 | duration: 500,
5 | };
6 |
7 | export const DEFAULT_ELEMENTS_ANIMATION_OPTIONS: AnimationEffectTiming = {
8 | duration: 1000,
9 | easing: 'cubic-bezier(0.250, 0.460, 0.450, 0.940)',
10 | iterations: 1,
11 | fill: 'both',
12 | };
13 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/element.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 根据不同的 node，自动计算 icon 的大小之后，乘以一下缩放系数，防止贴的太紧密
3 | *
4 | * According to the different nodes, the size of the icon is automatically calculated, and then multiplied by the following scaling factor to prevent it from being too close
5 | */
6 | export const ICON_SIZE_RATIO = 0.8;
7 |
8 | export const ELEMENT_TYPES = ['node', 'edge', 'combo'] as const;
9 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/events/animation.ts:
--------------------------------------------------------------------------------
1 | export enum AnimationType {
2 | DRAW = 'draw',
3 | COLLAPSE = 'collapse',
4 | EXPAND = 'expand',
5 | TRANSFORM = 'transform',
6 | }
7 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/events/container.ts:
--------------------------------------------------------------------------------
1 | export enum ContainerEvent {
2 | /**
3 | * 按下键盘时触发
4 | *
5 | * Triggered when the keyboard is pressed
6 | */
7 | KEY_DOWN = 'keydown',
8 | /**
9 | * 抬起键盘时触发
10 | *
11 | * Triggered when the keyboard is lifted
12 | */
13 | KEY_UP = 'keyup',
14 | }
15 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/events/index.ts:
--------------------------------------------------------------------------------
1 | export { AnimationType } from './animation';
2 | export { CanvasEvent } from './canvas';
3 | export { ComboEvent } from './combo';
4 | export { CommonEvent } from './common';
5 | export { ContainerEvent } from './container';
6 | export { EdgeEvent } from './edge';
7 | export { GraphEvent } from './graph';
8 | export { HistoryEvent } from './history';
9 | export { NodeEvent } from './node';
10 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/graphlib.ts:
--------------------------------------------------------------------------------
1 | export const COMBO_KEY = 'combo';
2 |
3 | export const TREE_KEY = 'tree';
4 |
--------------------------------------------------------------------------------
/packages/g6/src/constants/index.ts:
--------------------------------------------------------------------------------
1 | export * from './animation';
2 | export * from './change';
3 | export * from './events';
4 | export * from './graphlib';
5 | export * from './registry';
6 |
--------------------------------------------------------------------------------
/packages/g6/src/elements/combos/index.ts:
--------------------------------------------------------------------------------
1 | export { BaseCombo } from './base-combo';
2 | export { CircleCombo } from './circle';
3 | export { RectCombo } from './rect';
4 |
5 | export type { BaseComboStyleProps } from './base-combo';
6 | export type { CircleComboStyleProps } from './circle';
7 | export type { RectComboStyleProps } from './rect';
8 |
--------------------------------------------------------------------------------
/packages/g6/src/elements/index.ts:
--------------------------------------------------------------------------------
1 | export * from './combos';
2 | export * from './edges';
3 | export * from './nodes';
4 |
--------------------------------------------------------------------------------
/packages/g6/src/global.d.ts:
--------------------------------------------------------------------------------
1 | import '@antv/g';
2 | import type { RuntimeContext } from './runtime/types';
3 |
4 | declare module '@antv/g' {
5 | interface BaseStyleProps {
6 | /**
7 | * 图形所在的图层，默认为 'main'。
8 | *
9 | * The layer where the shape is located, default is 'main'.
10 | */
11 | $layer?: string;
12 | }
13 |
14 | interface DisplayObjectConfig {
15 | context?: RuntimeContext;
16 | }
17 | }
18 |
--------------------------------------------------------------------------------
/packages/g6/src/index.ts:
--------------------------------------------------------------------------------
1 | import './preset';
2 |
3 | export * from './exports';
4 |
5 | export { version } from './version';
6 | export const iconfont = {
7 | css: '//at.alicdn.com/t/a/font_470089_8hnbbf8n4u8.css',
8 | js: '//at.alicdn.com/t/a/font_470089_8hnbbf8n4u8.js',
9 | };
10 |
--------------------------------------------------------------------------------
/packages/g6/src/layouts/hierarchy.d.ts:
--------------------------------------------------------------------------------
1 | // TODO need @antv/hierarchy to implement the types
2 | declare module '@antv/hierarchy' {
3 | const _: {
4 | compactBox: any;
5 | dendrogram: any;
6 | indented: any;
7 | mindmap: any;
8 | };
9 | export = _;
10 | }
11 |
--------------------------------------------------------------------------------
/packages/g6/src/layouts/index.ts:
--------------------------------------------------------------------------------
1 | export { compactBox, dendrogram, indented, mindmap } from '@antv/hierarchy';
2 | export {
3 | AntVDagreLayout,
4 | CircularLayout,
5 | ComboCombinedLayout,
6 | ConcentricLayout,
7 | D3ForceLayout,
8 | DagreLayout,
9 | ForceAtlas2Layout,
10 | ForceLayout,
11 | FruchtermanLayout,
12 | GridLayout,
13 | MDSLayout,
14 | RadialLayout,
15 | RandomLayout,
16 | } from '@antv/layout';
17 | export { BaseLayout } from './base-layout';
18 | export { FishboneLayout } from './fishbone';
19 | export { SnakeLayout } from './snake';
20 |
21 | export type { FishboneLayoutOptions } from './fishbone';
22 | export type { SnakeLayoutOptions } from './snake';
23 |
--------------------------------------------------------------------------------
/packages/g6/src/palettes/types.ts:
--------------------------------------------------------------------------------
1 | export type Palette = string | BuiltInPalette | CategoricalPalette | ContinuousPalette;
2 |
3 | export type STDPalette = CategoricalPalette | ContinuousPalette;
4 |
5 | export type BuiltInPalette = 'spectral' | 'oranges' | 'greens' | 'blues';
6 |
7 | export type CategoricalPalette = string[];
8 |
9 | export type ContinuousPalette = (ratio: number) => string;
10 |
--------------------------------------------------------------------------------
/packages/g6/src/plugins/base-plugin.ts:
--------------------------------------------------------------------------------
1 | import { BaseExtension } from '../registry/extension';
2 | import type { CustomPluginOption } from '../spec/plugin';
3 |
4 | export interface BasePluginOptions extends CustomPluginOption {}
5 |
6 | /**
7 | * 插件的基类
8 | *
9 | * Base class for plugins
10 | */
11 | export abstract class BasePlugin extends BaseExtension {}
12 |
--------------------------------------------------------------------------------
/packages/g6/src/plugins/hull/hull/README.md:
--------------------------------------------------------------------------------
1 | > Code copied from [hull-js](https://github.com/hull/hull-js), and fix the issue [[Bug]: hull.js Code Injection Vulnerability #6605](https://github.com/antvis/G6/issues/6605).
2 |
--------------------------------------------------------------------------------
/packages/g6/src/plugins/hull/hull/two-sum.ts:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | export function fastTwoSum(a: number, b: number, result?: [number, number]): [number, number] {
4 | const x = a + b;
5 | const bv = x - a;
6 | const av = x - bv;
7 | const br = b - bv;
8 | const ar = a - av;
9 |
10 | if (result) {
11 | result[0] = ar + br;
12 | result[1] = x;
13 | return result;
14 | }
15 |
16 | return [ar + br, x];
17 | }
18 |
--------------------------------------------------------------------------------
/packages/g6/src/plugins/types.ts:
--------------------------------------------------------------------------------
1 | import type { BasePlugin } from './base-plugin';
2 |
3 | export type Plugin = BasePlugin;
4 |
--------------------------------------------------------------------------------
/packages/g6/src/preset.ts:
--------------------------------------------------------------------------------
1 | import { registerBuiltInExtensions } from './registry/build-in';
2 |
3 | registerBuiltInExtensions();
4 |
--------------------------------------------------------------------------------
/packages/g6/src/registry/extension/types.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 标准扩展配置项
3 | *
4 | * Standard extension options
5 | */
6 | export interface STDExtensionOption {
7 | /**
8 | * 扩展类型
9 | *
10 | * Extension type
11 | */
12 | type: string;
13 | /**
14 | * 扩展 key，即唯一标识
15 | *
16 | * Extension key, that is, the unique identifier
17 | */
18 | key: string;
19 | [key: string]: unknown;
20 | }
21 |
--------------------------------------------------------------------------------
/packages/g6/src/registry/store.ts:
--------------------------------------------------------------------------------
1 | import type { ExtensionRegistry } from './types';
2 |
3 | /**
4 | * 扩展注册表
5 | *
6 | * Extension registry
7 | */
8 | export const EXTENSION_REGISTRY: ExtensionRegistry = {
9 | animation: {},
10 | behavior: {},
11 | combo: {},
12 | edge: {},
13 | layout: {},
14 | node: {},
15 | palette: {},
16 | theme: {},
17 | plugin: {},
18 | transform: {},
19 | shape: {},
20 | };
21 |
--------------------------------------------------------------------------------
/packages/g6/src/spec/element/animation.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 元素动画执行阶段
3 | *
4 | * Stage of element animation execution
5 | */
6 | export type AnimationStage = 'enter' | 'update' | 'exit' | 'show' | 'hide' | 'collapse' | 'expand' | string;
7 |
--------------------------------------------------------------------------------
/packages/g6/src/spec/index.ts:
--------------------------------------------------------------------------------
1 | export type { BehaviorOptions } from './behavior';
2 | export type { CanvasOptions } from './canvas';
3 | export type { ComboData, EdgeData, GraphData, NodeData } from './data';
4 | export type { ComboOptions } from './element/combo';
5 | export type { EdgeOptions } from './element/edge';
6 | export type { NodeOptions } from './element/node';
7 | export type { GraphOptions } from './graph';
8 | export type { LayoutOptions } from './layout';
9 | export type { PluginOptions } from './plugin';
10 | export type { ThemeOptions } from './theme';
11 | export type { TransformOptions } from './transform';
12 | export type { ViewportOptions } from './viewport';
13 |
--------------------------------------------------------------------------------
/packages/g6/src/spec/layout.ts:
--------------------------------------------------------------------------------
1 | import type { BaseLayoutOptions, BuiltInLayoutOptions } from '../layouts/types';
2 |
3 | export type LayoutOptions = SingleLayoutOptions | SingleLayoutOptions[];
4 |
5 | export type STDLayoutOptions = BaseLayoutOptions;
6 |
7 | export type SingleLayoutOptions = BuiltInLayoutOptions | BaseLayoutOptions;
8 |
--------------------------------------------------------------------------------
/packages/g6/src/spec/theme.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 主题配置项
3 | *
4 | * Theme Options
5 | * @public
6 | */
7 | export type ThemeOptions = false | 'light' | 'dark' | string;
8 |
--------------------------------------------------------------------------------
/packages/g6/src/spec/transform.ts:
--------------------------------------------------------------------------------
1 | import type { Graph } from '../runtime/graph';
2 |
3 | export type TransformOptions = (string | CustomTransformOption | ((this: Graph) => CustomTransformOption))[];
4 |
5 | export interface UpdateTransformOption {
6 | key: string;
7 | [key: string]: unknown;
8 | }
9 |
10 | export interface CustomTransformOption {
11 | type: string;
12 | key?: string;
13 | [key: string]: unknown;
14 | }
15 |
--------------------------------------------------------------------------------
/packages/g6/src/themes/index.ts:
--------------------------------------------------------------------------------
1 | export { dark } from './dark';
2 | export { light } from './light';
3 |
--------------------------------------------------------------------------------
/packages/g6/src/themes/types.ts:
--------------------------------------------------------------------------------
1 | import type { StaticComboOptions } from '../spec/element/combo';
2 | import type { StaticEdgeOptions } from '../spec/element/edge';
3 | import type { StaticNodeOptions } from '../spec/element/node';
4 |
5 | export type Theme = {
6 | node?: StaticNodeOptions;
7 | edge?: StaticEdgeOptions;
8 | combo?: StaticComboOptions;
9 | background?: string;
10 | };
11 |
--------------------------------------------------------------------------------
/packages/g6/src/transforms/types.ts:
--------------------------------------------------------------------------------
1 | import type { ComboData, EdgeData, NodeData } from '../spec';
2 | import type { ID } from '../types';
3 | import type { BaseTransform } from './base-transform';
4 |
5 | export type Transform = BaseTransform;
6 |
7 | /**
8 | * 在 Element Controller 中，为了提高查询性能，统一使用 Map 存储数据
9 | *
10 | * In Element Controller, in order to improve query performance, use Map to store data uniformly
11 | */
12 | export type ProcedureData = {
13 | nodes: Map;
14 | edges: Map;
15 | combos: Map;
16 | };
17 |
18 | export type DrawData = {
19 | add: ProcedureData;
20 | update: ProcedureData;
21 | remove: ProcedureData;
22 | };
23 |
--------------------------------------------------------------------------------
/packages/g6/src/types/anchor.ts:
--------------------------------------------------------------------------------
1 | import type { Vector2, Vector3 } from './vector';
2 |
3 | export type Anchor = string | Vector2 | Vector3;
4 |
5 | export type STDAnchor = Vector2;
6 |
--------------------------------------------------------------------------------
/packages/g6/src/types/animation.ts:
--------------------------------------------------------------------------------
1 | import type { IAnimation } from '@antv/g';
2 |
3 | export type Keyframe = {
4 | [key: string]: any;
5 | };
6 |
7 | export type AnimationTask = () => () => IAnimation | null;
8 |
--------------------------------------------------------------------------------
/packages/g6/src/types/canvas.ts:
--------------------------------------------------------------------------------
1 | export type CanvasLayer = 'background' | 'main' | 'label' | 'transient';
2 |
--------------------------------------------------------------------------------
/packages/g6/src/types/centrality.ts:
--------------------------------------------------------------------------------
1 | import type { EdgeDirection } from './edge';
2 |
3 | export type NodeCentralityOptions =
4 | | { type: 'degree'; direction?: EdgeDirection }
5 | | { type: 'betweenness'; directed?: boolean; weightPropertyName?: string }
6 | | { type: 'closeness'; directed?: boolean; weightPropertyName?: string }
7 | | { type: 'eigenvector'; directed?: boolean }
8 | | { type: 'pagerank'; epsilon?: number; linkProb?: number };
9 |
--------------------------------------------------------------------------------
/packages/g6/src/types/enum.ts:
--------------------------------------------------------------------------------
1 | export type Loosen = `${T}`;
2 |
--------------------------------------------------------------------------------
/packages/g6/src/types/id.ts:
--------------------------------------------------------------------------------
1 | export type ID = string;
2 |
--------------------------------------------------------------------------------
/packages/g6/src/types/layout.ts:
--------------------------------------------------------------------------------
1 | import type { Graph as LayoutModel } from '@antv/layout';
2 | import type { AntVLayout } from '../layouts/types';
3 | import type { GraphData } from '../spec/data';
4 | import type { STDLayoutOptions } from '../spec/layout';
5 |
6 | export interface AdaptiveLayout {
7 | instance: AntVLayout;
8 |
9 | execute(model: GraphData, options?: STDLayoutOptions): Promise;
10 |
11 | graphData2LayoutModel(data: GraphData): LayoutModel;
12 | }
13 |
--------------------------------------------------------------------------------
/packages/g6/src/types/padding.ts:
--------------------------------------------------------------------------------
1 | export type Padding = number | number[];
2 |
3 | export type STDPadding = [number, number, number, number];
4 |
--------------------------------------------------------------------------------
/packages/g6/src/types/placement.ts:
--------------------------------------------------------------------------------
1 | export type CardinalPlacement = 'left' | 'right' | 'top' | 'bottom';
2 |
3 | export type CornerPlacement =
4 | | 'left-top'
5 | | 'left-bottom'
6 | | 'right-top'
7 | | 'right-bottom'
8 | | 'top-left'
9 | | 'top-right'
10 | | 'bottom-left'
11 | | 'bottom-right';
12 |
13 | export type RelativePlacement = [number, number];
14 |
15 | export type DirectionalPlacement = CardinalPlacement | CornerPlacement | 'center';
16 |
17 | export type Placement = RelativePlacement | DirectionalPlacement;
18 |
--------------------------------------------------------------------------------
/packages/g6/src/types/plugin.ts:
--------------------------------------------------------------------------------
1 | import type { DisplayObject, FederatedEvent } from '@antv/g';
2 |
3 | export type PluginEvent = Omit & {
4 | targetType: 'canvas' | 'node' | 'edge' | 'combo';
5 | target: DisplayObject;
6 | };
7 |
--------------------------------------------------------------------------------
/packages/g6/src/types/point.ts:
--------------------------------------------------------------------------------
1 | export type Point = [number, number] | [number, number, number] | Float32Array;
2 |
3 | export type PointObject = {
4 | x: number;
5 | y: number;
6 | z?: number;
7 | };
8 |
--------------------------------------------------------------------------------
/packages/g6/src/types/size.ts:
--------------------------------------------------------------------------------
1 | import type { Vector2, Vector3 } from './vector';
2 |
3 | export type Size = number | Vector2 | Vector3;
4 |
5 | export type STDSize = Vector3;
6 |
--------------------------------------------------------------------------------
/packages/g6/src/types/state.ts:
--------------------------------------------------------------------------------
1 | export type State = string;
2 |
--------------------------------------------------------------------------------
/packages/g6/src/types/style.ts:
--------------------------------------------------------------------------------
1 | import type { Graph } from '../runtime/graph';
2 | import type { ElementDatum } from './data';
3 |
4 | /**
5 | * 样式计算迭代上下文
6 | *
7 | * Style iteration context
8 | */
9 | export type StyleIterationContext = {
10 | datum: ElementDatum;
11 | graph: Graph;
12 | };
13 |
--------------------------------------------------------------------------------
/packages/g6/src/types/tree.ts:
--------------------------------------------------------------------------------
1 | export type TreeData = {
2 | id: string;
3 | children?: TreeData[];
4 | depth?: number;
5 | [key: string]: any;
6 | };
7 |
--------------------------------------------------------------------------------
/packages/g6/src/types/vector.ts:
--------------------------------------------------------------------------------
1 | export type Vector2 = [number, number] | Float32Array;
2 |
3 | export type Vector3 = [number, number, number] | Float32Array;
4 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/anchor.ts:
--------------------------------------------------------------------------------
1 | import type { Anchor, STDAnchor } from '../types/anchor';
2 | import { isBetween } from './math';
3 |
4 | /**
5 | * 解析原点（锚点）
6 | *
7 | * Parse the origin/anchor
8 | * @param anchor - 原点 | Anchor
9 | * @returns 标准原点 | Standard anchor
10 | */
11 | export function parseAnchor(anchor: Anchor): STDAnchor {
12 | const parsedAnchor = (
13 | typeof anchor === 'string' ? anchor.split(' ').map((v) => parseFloat(v)) : anchor.slice(0, 2)
14 | ) as [number, number];
15 | if (!isBetween(parsedAnchor[0], 0, 1) || !isBetween(parsedAnchor[1], 0, 1)) {
16 | return [0.5, 0.5];
17 | }
18 | return parsedAnchor;
19 | }
20 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/array.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 数组去重
3 | *
4 | * deduplicate array
5 | * @param arr - 数组 | array
6 | * @param by - 通过某个属性去重 | deduplicate by some property
7 | * @returns 去重后的数组 | deduplicated array
8 | */
9 | export function deduplicate(arr: T[], by: (item: T) => unknown = (item) => item) {
10 | const set = new Set();
11 | return arr.filter((item) => {
12 | const key = by ? by(item) : item;
13 | return set.has(key) ? false : set.add(key);
14 | }) as T[];
15 | }
16 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/collapsibility.ts:
--------------------------------------------------------------------------------
1 | import type { NodeLikeData } from '../types';
2 |
3 | /**
4 | * 判断节点/组合是否收起
5 | *
6 | * Determine whether the node/combo is collapsed
7 | * @param nodeLike - 节点/组合数据 | Node/Combo data
8 | * @returns 是否收起 | Whether it is collapsed
9 | */
10 | export function isCollapsed(nodeLike: NodeLikeData) {
11 | return !!nodeLike.style?.collapsed;
12 | }
13 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/math.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * 判断值是否在区间内
3 | *
4 | * Judge whether the value is in the interval
5 | * @param value - 值 | value
6 | * @param min - 最小值 | minimum value
7 | * @param max - 最大值 | maximum value
8 | * @returns 是否在区间内 | whether in the interval
9 | */
10 | export function isBetween(value: number, min: number, max: number): boolean {
11 | return value >= min && value <= max;
12 | }
13 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/size.ts:
--------------------------------------------------------------------------------
1 | import type { STDSize, Size } from '../types';
2 |
3 | /**
4 | * 解析尺寸配置
5 | *
6 | * Parse size configuration
7 | * @param size - 尺寸配置 | size configuration
8 | * @returns 标准尺寸格式 | standard size format
9 | */
10 | export function parseSize(size: Size = 0): STDSize {
11 | if (typeof size === 'number') return [size, size, size] as STDSize;
12 | const [x, y = x, z = x] = size;
13 | return [x, y, z];
14 | }
15 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/state.ts:
--------------------------------------------------------------------------------
1 | import type { ElementDatum } from '../types';
2 |
3 | /**
4 | * 获取元素的状态
5 | *
6 | * Get the state of the element
7 | * @param datum - 元素数据 Element data
8 | * @returns 状态列表 State list
9 | */
10 | export function statesOf(datum: ElementDatum) {
11 | return datum.states || [];
12 | }
13 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/theme.ts:
--------------------------------------------------------------------------------
1 | import { ExtensionCategory } from '../constants';
2 | import { getExtension } from '../registry/get';
3 | import type { GraphOptions } from '../spec';
4 | import { print } from './print';
5 |
6 | /**
7 | * 获取主题配置
8 | *
9 | * Get theme options
10 | * @param options - 图配置项 graph options
11 | * @returns 主题配置 theme options
12 | */
13 | export function themeOf(options: GraphOptions) {
14 | const { theme } = options;
15 | if (!theme) return {};
16 |
17 | const themeOptions = getExtension(ExtensionCategory.THEME, theme);
18 |
19 | if (themeOptions) return themeOptions;
20 |
21 | print.warn(`The theme of ${theme} is not registered.`);
22 | return {};
23 | }
24 |
--------------------------------------------------------------------------------
/packages/g6/src/utils/z-index.ts:
--------------------------------------------------------------------------------
1 | import { ElementDatum } from '../types';
2 |
3 | /**
4 | * 获取元素的 zIndex
5 | * Get the zIndex of the element
6 | * @param datum - 元素数据 | element data
7 | * @returns - zIndex | zIndex
8 | */
9 | export function getZIndexOf(datum: ElementDatum): number {
10 | return datum?.style?.zIndex || 0;
11 | }
12 |
--------------------------------------------------------------------------------
/packages/g6/src/version.ts:
--------------------------------------------------------------------------------
1 | export const version = '5.0.48';
2 |
--------------------------------------------------------------------------------
/packages/g6/tsconfig.build.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "paths": {}
4 | },
5 | "include": ["src/**/*"],
6 | "extends": "./tsconfig.json"
7 | }
8 |
--------------------------------------------------------------------------------
/packages/g6/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "baseUrl": ".",
4 | "experimentalDecorators": true,
5 | "lib": ["DOM", "ESNext"],
6 | "outDir": "lib",
7 | "paths": {
8 | "@/*": ["./*"],
9 | "@@/*": ["__tests__/*"],
10 | "@antv/g6": ["./src/index.ts"]
11 | }
12 | },
13 | "exclude": ["node_modules", "dist", "lib", "esm"],
14 | "extends": "../../tsconfig.json",
15 | "include": ["src/**/*", "__tests__/**/*"]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/.dumi/app.tsx:
--------------------------------------------------------------------------------
1 | if (typeof window !== 'undefined') {
2 | window.onresize = () => {
3 | const { graph, container, widthOffset = 0, heightOffset = 0 } = window as any;
4 |
5 | if (!graph || graph.destroyed) return;
6 | if (!container || !container.scrollWidth || !container.scrollHeight) return;
7 | graph.setSize(container.scrollWidth + widthOffset, container.scrollHeight + heightOffset);
8 | };
9 | }
10 |
--------------------------------------------------------------------------------
/packages/site/.dumi/global.less:
--------------------------------------------------------------------------------
1 | .ant-layout-sider-children > :first-child[class^='toc'] {
2 | height: 100%;
3 | overflow-y: auto;
4 | }
5 |
6 | summary {
7 | color: #873bf4;
8 | cursor: pointer;
9 | }
10 |
11 | .ant-layout {
12 | background: none !important;
13 | }
14 |
15 | .prism-code {
16 | background-color: #f6f8fa !important;
17 | }
18 |
--------------------------------------------------------------------------------
/packages/site/.dumi/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../tsconfig.json",
3 | "include": [
4 | "**/*"
5 | ]
6 | }
--------------------------------------------------------------------------------
/packages/site/.gitignore:
--------------------------------------------------------------------------------
1 | /dist
2 | .dumi/tmp
3 | .dumi/tmp-production
4 | /support
5 |
6 | ## api doc
7 | docs/api/.gitignore
8 |
9 | /server
10 |
11 | # Dead links report
12 | dead-links-report.log
13 |
--------------------------------------------------------------------------------
/packages/site/CNAME:
--------------------------------------------------------------------------------
1 | g6.antv.vision
--------------------------------------------------------------------------------
/packages/site/common/manual/core-concept/palette/continuous-palette.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 200,
7 | height: 50,
8 | data: {
9 | nodes: new Array(6).fill(0).map((_, i) => ({ id: `node-${i}`, data: { value: (i + 1) * 20 } })),
10 | },
11 | layout: { type: 'grid', cols: 6 },
12 | node: {
13 | palette: {
14 | type: 'value',
15 | field: 'value',
16 | color: (value) => `rgb(${value * 255}, 0, 0)`,
17 | },
18 | },
19 | });
20 |
21 | graph.render();
22 | ```
23 |
--------------------------------------------------------------------------------
/packages/site/common/manual/core-concept/palette/default-config.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 400,
7 | height: 100,
8 | data: {
9 | nodes: new Array(30).fill(0).map((_, i) => ({ id: `node-${i}` })),
10 | },
11 | layout: { type: 'grid', cols: 10, rows: 3 },
12 | node: {
13 | palette: 'spectral',
14 | },
15 | });
16 |
17 | graph.render();
18 | ```
19 |
--------------------------------------------------------------------------------
/packages/site/common/manual/core-concept/palette/standard-config.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 200,
7 | height: 50,
8 | data: {
9 | nodes: new Array(6).fill(0).map((_, i) => ({ id: `node-${i}`, data: { category: ['A', 'B', 'C'][i % 3] } })),
10 | },
11 | layout: { type: 'grid', cols: 6 },
12 | node: {
13 | palette: {
14 | type: 'group',
15 | field: 'category',
16 | color: 'tableau',
17 | },
18 | },
19 | });
20 |
21 | graph.render();
22 | ```
23 |
--------------------------------------------------------------------------------
/packages/site/common/manual/custom-extension/animation/composite-animation-1.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 200,
7 | height: 50,
8 | data: {
9 | nodes: [{ id: 'node-1', style: { x: 25, y: 25, size: 20 } }],
10 | },
11 | node: {
12 | animation: {
13 | update: [
14 | {
15 | fields: ['x', 'y'],
16 | },
17 | { fields: ['r'], shape: 'key' },
18 | ],
19 | },
20 | },
21 | });
22 |
23 | graph.draw().then(() => {
24 | graph.updateNodeData([{ id: 'node-1', style: { x: 175, size: 40 } }]);
25 | graph.draw();
26 | });
27 | ```
28 |
--------------------------------------------------------------------------------
/packages/site/common/manual/custom-extension/animation/composite-animation-2.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 200,
7 | height: 50,
8 | data: {
9 | nodes: [{ id: 'node-1', style: { x: 25, y: 25, size: 20 } }],
10 | },
11 | node: {
12 | animation: {
13 | update: [
14 | {
15 | fields: ['x', 'y'],
16 | },
17 | { fields: ['r', 'fill'], shape: 'key' },
18 | ],
19 | },
20 | },
21 | });
22 |
23 | graph.draw().then(() => {
24 | graph.updateNodeData([{ id: 'node-1', style: { x: 175, size: 40, fill: 'pink' } }]);
25 | graph.draw();
26 | });
27 | ```
28 |
--------------------------------------------------------------------------------
/packages/site/common/manual/custom-extension/animation/implement-animation.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | width: 50,
6 | height: 50,
7 | container,
8 | data: {
9 | nodes: [{ id: 'node-1', style: { x: 25, y: 25, size: 20 } }],
10 | },
11 | node: {
12 | animation: {
13 | update: [
14 | {
15 | fields: ['r'],
16 | shape: 'key',
17 | },
18 | ],
19 | },
20 | },
21 | });
22 |
23 | graph.draw().then(() => {
24 | graph.updateNodeData([{ id: 'node-1', style: { size: 40 } }]);
25 | graph.draw();
26 | });
27 | ```
28 |
--------------------------------------------------------------------------------
/packages/site/common/manual/feature/webpack4.md:
--------------------------------------------------------------------------------
1 | ```js
2 | module.exports = {
3 | entry: './src/index.js',
4 | output: {
5 | path: path.resolve(__dirname, 'dist'),
6 | filename: 'index.js',
7 | },
8 | module: {
9 | rules: [
10 | {
11 | test: /\.js$/,
12 | use: {
13 | loader: 'babel-loader',
14 | options: {
15 | presets: ['@babel/preset-env'],
16 | },
17 | },
18 | },
19 | {
20 | test: /\.js$/,
21 | loader: '@open-wc/webpack-import-meta-loader',
22 | },
23 | ],
24 | },
25 | mode: 'production',
26 | };
27 | ```
28 |
--------------------------------------------------------------------------------
/packages/site/common/manual/getting-started/step-by-step/create-chart.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 200,
7 | height: 100,
8 | data: {
9 | nodes: [
10 | { id: 'node-1', style: { x: 50, y: 50 } },
11 | { id: 'node-2', style: { x: 150, y: 50 } },
12 | ],
13 | edges: [{ source: 'node-1', target: 'node-2' }],
14 | },
15 | });
16 |
17 | graph.render();
18 | ```
19 |
--------------------------------------------------------------------------------
/packages/site/common/manual/getting-started/step-by-step/elements-1.md:
--------------------------------------------------------------------------------
1 | ```js | ob { pin: false , autoMount: true }
2 | import { Graph } from '@antv/g6';
3 |
4 | const graph = new Graph({
5 | container: 'container',
6 | width: 200,
7 | height: 100,
8 | data: {
9 | nodes: [
10 | { id: 'node-1', style: { x: 50, y: 50 } },
11 | { id: 'node-2', style: { x: 150, y: 50 } },
12 | ],
13 | edges: [{ source: 'node-1', target: 'node-2' }],
14 | },
15 | node: {
16 | style: {
17 | fill: 'pink',
18 | },
19 | },
20 | edge: {
21 | style: {
22 | stroke: 'lightgreen',
23 | },
24 | },
25 | });
26 |
27 | graph.render();
28 | ```
29 |
--------------------------------------------------------------------------------
/packages/site/docs/api/graph.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Graph Instance
3 | order: 2
4 | ---
5 |
6 | ## API Reference
7 |
8 | ### Graph.destroy()
9 |
10 | Destroy the current graph instance and release all resources related to it.
11 |
12 | ⚠️ **Note**: After destruction, no operations can be performed. If you need to use it again, you must create a new graph instance.
13 |
14 | ```typescript
15 | destroy(): void;
16 | ```
17 |
18 | **Usage Scenarios**:
19 |
20 | - When the user closes the chart or switches to another view, this method can be called to release resources.
21 | - When needing to recreate a graph instance, ensure the old instance is destroyed first to avoid memory leaks.
22 |
--------------------------------------------------------------------------------
/packages/site/docs/api/graph.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 图实例
3 | order: 2
4 | ---
5 |
6 | ## API 参考
7 |
8 | ### Graph.destroy()
9 |
10 | 销毁当前图实例，释放与图实例相关的所有资源。
11 |
12 | ⚠️ **注意**: 销毁后无法进行任何操作，如果需要重新使用，需要重新创建一个新的图实例。
13 |
14 | ```typescript
15 | destroy(): void;
16 | ```
17 |
18 | **使用场景**:
19 |
20 | - 当用户关闭图表或切换到其他视图时，可以调用此方法来释放资源。
21 | - 在需要重新创建图实例时，确保先销毁旧的实例，以避免内存泄漏。
22 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/combo/build-in/CircleCombo.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Circle 圆形
3 | ---
4 |
5 | ## 概述
6 |
7 | 圆形组合以圆形边界包裹子节点或子组合，适合表示平等或非层级化的群组关系。
8 |
9 | 适用场景：
10 |
11 | - 适合表示无明确层级关系的节点群组，圆形组合能体现成员的平等性，如社交网络中的用户群体、分散式团队结构（突出协作性）。
12 |
13 | ## 在线体验
14 |
15 |
16 |
17 | ## 样式配置
18 |
19 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见 [BaseCombo](/manual/element/combo/build-in/base-combo)
20 |
21 | ## 示例
22 |
23 | 以下示例为兴趣小组人员分布：
24 |
25 |
26 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/combo/build-in/RectCombo.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Rect 矩形
3 | ---
4 |
5 | ## 概述
6 |
7 | 矩形组合以直角边界组织内容，支持严格的层级结构。
8 |
9 | 适用场景：
10 |
11 | - **系统架构图**：如系统架构里面的服务分层，以及每层服务里面的细分等。
12 | - **地理区域划分**：如城市包含多个区域，矩形组合能直观展示行政边界或功能分区。
13 |
14 | ## 在线体验
15 |
16 |
17 |
18 | ## 样式配置
19 |
20 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见 [BaseCombo](/manual/element/combo/build-in/base-combo)
21 |
22 | ## 示例
23 |
24 | 以下示例为简单的微服务架构服务层：
25 |
26 |
27 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/edge/build-in/Line.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Line 直线
3 | ---
4 |
5 | ## 概述
6 |
7 | 直线是最简单的边类型，直接连接两个节点，没有任何弯曲。
8 |
9 | 使用场景：
10 |
11 | - 适用于简单的图，如拓扑图、流程图。
12 |
13 | - 当需要快速绘制且无需复杂视觉效果时使用。
14 |
15 | ## 在线体验
16 |
17 |
18 |
19 | ## 样式配置
20 |
21 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见 [BaseEdge](/manual/element/edge/build-in/base-edge)
22 |
23 | ## 示例
24 |
25 | ### 内置直线边效果
26 |
27 |
28 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/node/build-in/Circle.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Circle 圆形
3 | order: 1
4 | ---
5 |
6 | ## 概述
7 |
8 | 圆形是一个对称的几何形状，具有均匀的半径。
9 |
10 | 适用场景：
11 |
12 | - 用于表示节点的大小或权重（通过半径控制）。
13 | - 适合表示无方向性的关系，如社交网络中的用户节点。
14 | - 常用于流程图、网络图、拓扑图等。
15 |
16 | ## 在线体验
17 |
18 |
19 |
20 | ## 样式配置
21 |
22 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见[BaseNode](/manual/element/node/build-in/base-node)
23 |
24 | ## 示例
25 |
26 | ### 内置圆形节点效果
27 |
28 |
29 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/node/build-in/Diamond.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Diamond 菱形
3 | ---
4 |
5 | ## 概述
6 |
7 | 菱形是一个四边相等的几何形状，具有对角线对称性。
8 |
9 | 适用场景：
10 |
11 | - 用于表示决策节点、条件判断或关键路径。
12 |
13 | - 适合表示流程图中的判断节点或关键步骤。
14 |
15 | - 常用于流程图、决策树、网络图等。
16 |
17 | ## 在线体验
18 |
19 |
20 |
21 | ## 样式配置
22 |
23 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见 [BaseNode](/manual/element/node/build-in/base-node)
24 |
25 | ## 示例
26 |
27 | ### 内置菱形节点效果
28 |
29 |
30 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/node/build-in/Ellipse.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Ellipse 椭圆形
3 | ---
4 |
5 | ## 概述
6 |
7 | 椭圆是一个长轴和短轴不对称的几何形状。
8 |
9 | 适用场景：
10 |
11 | - 用于表示动态节点、非对称关系或特殊形状。
12 |
13 | - 适合表示流程图、网络图或拓扑图。
14 |
15 | - 常用于流程图、网络图、拓扑图等。
16 |
17 | ## 在线体验
18 |
19 |
20 |
21 | ## 样式配置
22 |
23 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见 [BaseNode](/manual/element/node/build-in/base-node)
24 |
25 | ## 示例
26 |
27 | ### 内置椭圆形节点效果
28 |
29 |
30 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/element/node/build-in/Rect.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Rect 矩形
3 | ---
4 |
5 | ## 概述
6 |
7 | 矩形是一个四边相等的几何形状，具有明确的边界。
8 |
9 | 适用场景：
10 |
11 | - 用于表示模块、组件或容器。
12 |
13 | - 适合表示层次结构，如组织结构图、文件目录树。
14 |
15 | - 常用于流程图、架构图、UML 图等。
16 |
17 | ## 在线体验
18 |
19 |
20 |
21 | ## 样式配置
22 |
23 | > 如果元素有其特定的属性，我们将在下面列出。对于所有的通用样式属性，见 [BaseNode](/manual/element/node/build-in/base-node)
24 |
25 | ## 示例
26 |
27 | ### 内置矩形节点效果
28 |
29 |
30 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/extension/3d.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: g6-extension-3d
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/extension/3d.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: g6-extension-3d
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/getting-started/integration/angular.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: angular
3 | order: 2
4 | ---
5 |
6 | Refer to the example below, you can use G6 in Angular, and you can also view the [Live Example](https://stackblitz.com/edit/g6-in-angular?file=src%2Fmain.ts)。
7 |
8 |
9 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/getting-started/integration/angular.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 在 Angular 中使用
3 | order: 2
4 | ---
5 |
6 | 参考下面的示例，你可以在 Angular 中使用 G6，也可以查看 [在线示例](https://stackblitz.com/edit/g6-in-angular?file=src%2Fmain.ts)。
7 |
8 |
9 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/getting-started/integration/react.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: react
3 | order: 0
4 | ---
5 |
6 | ## Non-Strict Mode
7 |
8 | Refer to the example below, you can use G6 in React, and you can also view the [Live Example](https://stackblitz.com/edit/g6-in-react?file=src/App.tsx) 。
9 |
10 |
11 |
12 | ## Strict Mode
13 |
14 | In strict mode, React will update twice, causing G6 to create and destroy the Graph instance repeatedly. You can refer to the following example to solve this problem:
15 |
16 |
17 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/getting-started/integration/react.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 在 React 中使用
3 | order: 0
4 | ---
5 |
6 | ## 非严格模式
7 |
8 | 参考下面的示例，你可以在 React 中使用 G6，也可以查看 [在线示例](https://stackblitz.com/edit/g6-in-react?file=src/App.tsx) 。
9 |
10 |
11 |
12 | > 如果你需要更完善的 React 与 G6 集成解决方案，可以使用 AntV 官方封装库 [`@antv/graphin`](https://github.com/antvis/graphin)。
13 |
14 | ## 严格模式
15 |
16 | 在严格模式下，React 会二次更新导致 G6 重复创建 Graph 实例并销毁，可以参考如下示例解决：
17 |
18 |
19 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/getting-started/integration/vue.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: vue
3 | order: 1
4 | ---
5 |
6 | :::warning
7 | Please do not pass Vue reactive data directly to the G6 instance, which may cause G6 to fail to render correctly, or even cause the page to crash.
8 | :::
9 |
10 | Refer to the example below, you can use G6 in Vue, and you can also view the [Live Example](https://stackblitz.com/edit/g6-in-vue?file=src/App.vue)。
11 |
12 |
13 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/getting-started/integration/vue.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 在 Vue 中使用
3 | order: 1
4 | ---
5 |
6 | :::warning{title=注意}
7 | 请不要将 Vue 响应式数据直接传递给 G6 实例，这可能会导致 G6 无法正确渲染，甚至导致页面崩溃。
8 | :::
9 |
10 | 参考下面的示例，你可以在 Vue 中使用 G6，也可以查看 [在线示例](https://stackblitz.com/edit/g6-in-vue?file=src/App.vue)。
11 |
12 |
13 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/theme/overview.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Theme Overview
3 | order: 1
4 | ---
5 |
6 | ## Overview
7 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/transform/build-in/PlaceRadialLabels.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: PlaceRadialLabels
3 | ---
4 |
5 | ## Options
6 |
7 | ### offset
8 |
9 | > _number_
10 |
11 | Offset
12 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/transform/build-in/PlaceRadialLabels.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: PlaceRadialLabels 径向标签
3 | ---
4 |
5 | **参考示例**：
6 |
7 | - [径向生态树](/examples/scene-case/tree-graph/#radial-dendrogram)
8 | - [径向紧凑树](/examples/scene-case/tree-graph/#radial-compact-tree)
9 |
10 | ## 配置项
11 |
12 | ### type
13 |
14 | > _`place-radial-labels` \| string_
15 |
16 | 此数据处理已内置，你可以通过 `type: 'place-radial-labels'` 来使用它。
17 |
18 | ### offset
19 |
20 | > _number_
21 |
22 | 偏移量
23 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/transform/custom-transform.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Custom Transform
3 | order: 3
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/docs/manual/transform/overview.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Data Transformation Overview
3 | order: 1
4 | ---
5 |
6 | ## Overview
7 |
--------------------------------------------------------------------------------
/packages/site/examples/algorithm/case/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Graph Algorithm Practice
3 | order: 5
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/algorithm/case/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 图算法应用
3 | order: 5
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/animation/basic/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Basic Animation
3 | order: 0
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/animation/basic/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 基本动画
3 | order: 0
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/animation/persistence/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Persistence Animation
3 | order: 1
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/animation/persistence/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 持续动画
3 | order: 1
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/animation/viewport/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Viewport Animation
3 | order: 2
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/animation/viewport/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 视口动画
3 | order: 2
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/auto-adapt-label/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": "智能标签控制",
10 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*FIj7T4ZtyoAAAAAAAAAAAAAAemJ7AQ/original"
11 | }
12 | ]
13 | }
--------------------------------------------------------------------------------
/packages/site/examples/behavior/auto-adapt-label/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Intelligent tag control
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/auto-adapt-label/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 智能标签控制
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/canvas/demo/drag.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const graph = new Graph({
4 | container: 'container',
5 | layout: {
6 | type: 'grid',
7 | },
8 | data: {
9 | nodes: [{ id: 'node1' }, { id: 'node2' }, { id: 'node3' }, { id: 'node4' }, { id: 'node5' }],
10 | edges: [
11 | { source: 'node1', target: 'node2' },
12 | { source: 'node1', target: 'node3' },
13 | { source: 'node1', target: 'node4' },
14 | { source: 'node2', target: 'node3' },
15 | { source: 'node3', target: 'node4' },
16 | { source: 'node4', target: 'node5' },
17 | ],
18 | },
19 | behaviors: ['drag-canvas'],
20 | });
21 |
22 | graph.render();
23 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/canvas/demo/scroll-xy.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const graph = new Graph({
4 | container: 'container',
5 | layout: {
6 | type: 'grid',
7 | },
8 | data: {
9 | nodes: [{ id: 'node1' }, { id: 'node2' }, { id: 'node3' }, { id: 'node4' }, { id: 'node5' }],
10 | edges: [
11 | { source: 'node1', target: 'node2' },
12 | { source: 'node1', target: 'node3' },
13 | { source: 'node1', target: 'node4' },
14 | { source: 'node2', target: 'node3' },
15 | { source: 'node3', target: 'node4' },
16 | { source: 'node4', target: 'node5' },
17 | ],
18 | },
19 | behaviors: ['scroll-canvas'],
20 | });
21 |
22 | graph.render();
23 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/canvas/demo/scroll-y.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const graph = new Graph({
4 | container: 'container',
5 | layout: {
6 | type: 'grid',
7 | },
8 | data: {
9 | nodes: [{ id: 'node1' }, { id: 'node2' }, { id: 'node3' }, { id: 'node4' }, { id: 'node5' }],
10 | edges: [
11 | { source: 'node1', target: 'node2' },
12 | { source: 'node1', target: 'node3' },
13 | { source: 'node1', target: 'node4' },
14 | { source: 'node2', target: 'node3' },
15 | { source: 'node3', target: 'node4' },
16 | { source: 'node4', target: 'node5' },
17 | ],
18 | },
19 | behaviors: [{ type: 'scroll-canvas', direction: 'y' }],
20 | });
21 |
22 | graph.render();
23 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/canvas/demo/zoom.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const graph = new Graph({
4 | container: 'container',
5 | layout: {
6 | type: 'grid',
7 | },
8 | data: {
9 | nodes: [{ id: 'node1' }, { id: 'node2' }, { id: 'node3' }, { id: 'node4' }, { id: 'node5' }],
10 | edges: [
11 | { source: 'node1', target: 'node2' },
12 | { source: 'node1', target: 'node3' },
13 | { source: 'node1', target: 'node4' },
14 | { source: 'node2', target: 'node3' },
15 | { source: 'node3', target: 'node4' },
16 | { source: 'node4', target: 'node5' },
17 | ],
18 | },
19 | behaviors: ['zoom-canvas'],
20 | });
21 |
22 | graph.render();
23 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/canvas/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Canvas Manipulation
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/canvas/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 画布操作
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/combo/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "展开/收起",
11 | "en": "Expand/Collapse"
12 | },
13 | "screenshot": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Rvx9SYSHGsIAAAAAAAAAAABkARQnAQ"
14 | },
15 | {
16 | "filename": "collapse-expand.js",
17 | "title": {
18 | "zh": "展开/收起的触发方式",
19 | "en": "Trigger of Expand/Collapse"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*zrL2RJtAKkAAAAAAAAAAAAAAemJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/combo/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Combo Behaviors
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/combo/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 组合交互
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/create-edge/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Create Edge
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/create-edge/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 创建边
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/fix-element-size/index.en.md:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/packages/site/examples/behavior/fix-element-size/index.en.md
--------------------------------------------------------------------------------
/packages/site/examples/behavior/fix-element-size/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 缩放画布时固定元素大小
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/focus/demo/basic.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const data = {
4 | nodes: [
5 | { id: 'node1', combo: 'combo1', style: { x: 110, y: 150 } },
6 | { id: 'node2', combo: 'combo1', style: { x: 190, y: 150 } },
7 | { id: 'node3', combo: 'combo2', style: { x: 150, y: 260 } },
8 | ],
9 | edges: [{ source: 'node1', target: 'node2' }],
10 | combos: [{ id: 'combo1', combo: 'combo2' }, { id: 'combo2' }],
11 | };
12 |
13 | const graph = new Graph({
14 | container: 'container',
15 | node: {
16 | style: { labelText: (d) => d.id },
17 | },
18 | data,
19 | behaviors: ['collapse-expand', 'focus-element'],
20 | });
21 |
22 | graph.render();
23 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/focus/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": "点击聚焦",
10 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ph6tS4k6S-oAAAAAAAAAAAAADmJ7AQ/original"
11 | }
12 | ]
13 | }
14 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/focus/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Focus Element
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/focus/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 元素聚焦
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/highlight-element/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Highlight Element
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/highlight-element/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 高亮元素
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/inner-event/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "指定图形响应事件",
11 | "en": "Specify the shape response event"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZPt0SKT5JXQAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/inner-event/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Inner Element Event
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/inner-event/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 元素内部事件
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/select/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Select
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/select/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 选中
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/update-label/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "update.js",
9 | "title": {
10 | "zh": "更新标签",
11 | "en": "Update Label"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*DSVuQ6oH_m8AAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/update-label/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Update Label
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/behavior/update-label/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 更新标签
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/element/combo/demo/circle.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const data = {
4 | nodes: [
5 | { id: 'node1', combo: 'combo1', style: { x: 250, y: 150 } },
6 | { id: 'node2', combo: 'combo1', style: { x: 350, y: 150 } },
7 | { id: 'node3', combo: 'combo2', style: { x: 250, y: 300 } },
8 | ],
9 | edges: [],
10 | combos: [{ id: 'combo1', combo: 'combo2' }, { id: 'combo2' }],
11 | };
12 |
13 | const graph = new Graph({
14 | container: 'container',
15 | data,
16 | node: {
17 | style: {
18 | labelText: (d) => d.id,
19 | },
20 | },
21 | combo: {
22 | type: 'circle',
23 | },
24 | behaviors: ['drag-element', 'collapse-expand'],
25 | });
26 |
27 | graph.render();
28 |
--------------------------------------------------------------------------------
/packages/site/examples/element/combo/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "circle.js",
9 | "title": "圆形",
10 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Kbk1S5pzSY0AAAAAAAAAAAAADmJ7AQ/original"
11 | },
12 | {
13 | "filename": "rect.js",
14 | "title": "矩形",
15 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*PKtgSZzmb3YAAAAAAAAAAAAADmJ7AQ/original"
16 | }
17 | ]
18 | }
19 |
--------------------------------------------------------------------------------
/packages/site/examples/element/combo/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Combos
3 | order: 2
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/combo/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 组合
3 | order: 2
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-combo/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "extra-button.js",
9 | "title": {
10 | "zh": "额外按钮",
11 | "en": "Extra Button"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*YBe_Ta8leloAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-combo/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Custom Combo
3 | order: 6
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-combo/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 自定义组合
3 | order: 6
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-edge/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Custom Edge
3 | order: 5
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-edge/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 自定义边
3 | order: 5
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-node/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Custom Node
3 | order: 4
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/custom-node/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 自定义节点
3 | order: 4
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/edge/demo/polyline-orth.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const data = {
4 | nodes: [
5 | { id: 'node-1', style: { x: 200, y: 200 } },
6 | { id: 'node-2', style: { x: 350, y: 120 } },
7 | ],
8 | edges: [
9 | {
10 | id: 'edge-1',
11 | source: 'node-1',
12 | target: 'node-2',
13 | },
14 | ],
15 | };
16 |
17 | const graph = new Graph({
18 | container: 'container',
19 | data,
20 | edge: {
21 | type: 'polyline',
22 | style: {
23 | router: {
24 | type: 'orth',
25 | },
26 | },
27 | },
28 | behaviors: [{ type: 'drag-element' }],
29 | });
30 |
31 | graph.render();
32 |
--------------------------------------------------------------------------------
/packages/site/examples/element/edge/demo/polyline.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const data = {
4 | nodes: [
5 | { id: 'node-1', style: { x: 200, y: 200 } },
6 | { id: 'node-2', style: { x: 350, y: 120 } },
7 | ],
8 | edges: [
9 | {
10 | id: 'edge-1',
11 | source: 'node-1',
12 | target: 'node-2',
13 | controlPoints: [[300, 190]],
14 | },
15 | ],
16 | };
17 |
18 | const graph = new Graph({
19 | container: 'container',
20 | data,
21 | edge: {
22 | type: 'polyline',
23 | style: {
24 | controlPoints: (d) => d.controlPoints,
25 | },
26 | },
27 | behaviors: [{ type: 'drag-element' }],
28 | });
29 |
30 | graph.render();
31 |
--------------------------------------------------------------------------------
/packages/site/examples/element/edge/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Edges
3 | order: 1
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/edge/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 边
3 | order: 1
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/label/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Label
3 | order: 3
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/label/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 标签
3 | order: 3
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/node/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Nodes
3 | order: 0
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/element/node/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 节点
3 | order: 0
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/feature/default/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Theme
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/feature/default/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 特性
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/circular/demo/basic.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/circular.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | autoFit: 'view',
9 | data,
10 | node: {
11 | style: {
12 | labelText: d => d.id,
13 | labelFill: '#fff',
14 | labelPlacement: 'center'
15 | }
16 | },
17 | layout: {
18 | type: 'circular',
19 | },
20 | behaviors: ['drag-canvas', 'drag-element'],
21 | });
22 |
23 | graph.render();
24 | });
25 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/circular/demo/degree.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/circular.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | autoFit: 'view',
9 | data,
10 | node: {
11 | style: {
12 | labelText: d => d.id,
13 | labelFill: '#fff',
14 | labelPlacement: 'center'
15 | }
16 | },
17 | layout: {
18 | type: 'circular',
19 | ordering: 'degree',
20 | },
21 | behaviors: ['drag-canvas', 'drag-element'],
22 | });
23 |
24 | graph.render();
25 | });
26 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/circular/demo/spiral.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/circular.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | autoFit: 'center',
9 | data,
10 | node: {
11 | style: {
12 | labelText: d => d.id,
13 | labelFill: '#fff',
14 | labelPlacement: 'center'
15 | }
16 | },
17 | layout: {
18 | type: 'circular',
19 | startRadius: 10,
20 | endRadius: 300,
21 | },
22 | behaviors: ['drag-canvas', 'drag-element'],
23 | });
24 |
25 | graph.render();
26 | });
27 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/circular/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Circular Layout
3 | order: 4
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/circular/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Circular 环形布局
3 | order: 4
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/combo-layout/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "combo-combined.js",
9 | "title": {
10 | "zh": "ComboCombined 组合布局",
11 | "en": "Combo Combined Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*zPAzSZ3XxpUAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/combo-layout/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Combo Layout
3 | order: 2
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/combo-layout/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 组合布局
3 | order: 2
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/compact-box/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: CompactBox
3 | order: 3
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/compact-box/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: CompactBox 紧凑树
3 | order: 3
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/concentric/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "Concentric 同心圆布局",
11 | "en": "Concentric Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*KXunQKOLCSAAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/concentric/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Concentric Layout
3 | order: 10
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/concentric/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Concentric 同心圆布局
3 | order: 10
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/custom/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "bi-graph.js",
9 | "title": {
10 | "zh": "二分图布局",
11 | "en": "Bi-graph Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*RfYnRK1rWVgAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "arc.js",
17 | "title": {
18 | "zh": "弧线图",
19 | "en": "Arc Diagram"
20 | },
21 | "screenshot": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*_eivQrJXt8sAAAAAAAAAAABkARQnAQ"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/custom/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Custom Layout
3 | order: 16
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/custom/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 自定义布局
3 | order: 16
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/dagre/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Dagre Layout
3 | order: 1
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/dagre/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Dagre 布局
3 | order: 1
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/dendrogram/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Dendrogram
3 | order: 4
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/dendrogram/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Dendrogram 生态树
3 | order: 4
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/fishbone/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "Fishbone 鱼骨布局",
11 | "en": "Fishbone Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*CT60SrCib9QAAAAAAAAAAAAAemJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/fishbone/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fishbone Layout
3 | order: 11
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/fishbone/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fishbone 鱼骨布局
3 | order: 11
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/force-directed/demo/atlas2.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://gw.alipayobjects.com/os/antvdemo/assets/data/relations.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | data,
9 | autoFit: 'view',
10 | layout: {
11 | type: 'force-atlas2',
12 | preventOverlap: true,
13 | kr: 20,
14 | center: [250, 250],
15 | },
16 | behaviors: ['zoom-canvas', 'drag-canvas'],
17 | autoResize: true,
18 | zoomRange: [0.1, 5],
19 | });
20 |
21 | graph.render();
22 | });
23 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/force-directed/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Force-directed Layout
3 | order: 0
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/force-directed/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 力导向图布局
3 | order: 0
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/fruchterman/demo/basic.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/cluster.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | data,
9 | layout: {
10 | type: 'fruchterman',
11 | gravity: 5,
12 | speed: 5,
13 | animation: true,
14 | },
15 | node: {
16 | style: {
17 | labelFill: '#fff',
18 | labelPlacement: 'center',
19 | labelText: (d) => d.id,
20 | },
21 | },
22 | behaviors: ['drag-canvas', 'drag-element'],
23 | });
24 |
25 | graph.render();
26 | });
27 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/fruchterman/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fruchterman Layout
3 | order: 13
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/fruchterman/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fruchterman 图布局
3 | order: 13
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/grid/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "Grid 网格布局",
11 | "en": "Grid Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*8RYVTrENVCcAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/grid/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Grid
3 | order: 11
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/grid/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Grid 网格布局
3 | order: 11
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/indented/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Indented
3 | order: 6
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/indented/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Indented 缩进树
3 | order: 6
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mds/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "基本 MDS 布局",
11 | "en": "Basic MDS Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*myM6T6R_d34AAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mds/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: MDS Layout
3 | order: 12
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mds/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: MDS 布局
3 | order: 12
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mechanism/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "switch.js",
9 | "title": {
10 | "zh": "布局切换",
11 | "en": "Switch Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*aGiCRrsJeCUAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "change-data.js",
17 | "title": {
18 | "zh": "数据动态切换",
19 | "en": "Change Data"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Cq8SRL2NZtYAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mechanism/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Layout Mechanism
3 | order: 15
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mechanism/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 布局机制
3 | order: 15
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mindmap/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Mindmap
3 | order: 5
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/mindmap/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Mindmap 脑图树
3 | order: 5
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/radial/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Radial Layout
3 | order: 7
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/radial/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Radial 辐射布局
3 | order: 7
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/snake/demo/basic.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const data = {
4 | nodes: new Array(16).fill(0).map((_, i) => ({ id: `${i}` })),
5 | edges: new Array(15).fill(0).map((_, i) => ({ source: `${i}`, target: `${i + 1}` })),
6 | };
7 |
8 | const graph = new Graph({
9 | container: 'container',
10 | data,
11 | node: {
12 | style: {
13 | labelFill: '#fff',
14 | labelPlacement: 'center',
15 | labelText: (d) => d.id,
16 | },
17 | },
18 | layout: {
19 | type: 'snake',
20 | padding: 50,
21 | },
22 | behaviors: ['drag-canvas', 'drag-element'],
23 | });
24 |
25 | graph.render();
26 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/snake/demo/gutter.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const data = {
4 | nodes: new Array(16).fill(0).map((_, i) => ({ id: `${i}` })),
5 | edges: new Array(15).fill(0).map((_, i) => ({ source: `${i}`, target: `${i + 1}` })),
6 | };
7 |
8 | const graph = new Graph({
9 | container: 'container',
10 | autoFit: 'center',
11 | data,
12 | node: {
13 | style: {
14 | labelFill: '#fff',
15 | labelPlacement: 'center',
16 | labelText: (d) => d.id,
17 | },
18 | },
19 | layout: {
20 | type: 'snake',
21 | cols: 3,
22 | rowGap: 80,
23 | colGap: 120,
24 | },
25 | behaviors: ['drag-canvas', 'drag-element'],
26 | });
27 |
28 | graph.render();
29 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/snake/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "基本 Snake 布局",
11 | "en": "Basic Snake Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*pIpcQ6yX7P0AAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "gutter.js",
17 | "title": {
18 | "zh": "自定义间距的 Snake 布局",
19 | "en": "Snake Layout with Gutter"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*g-5JSoayUzAAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/snake/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Snake Layout
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/snake/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Snake 蛇形布局
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/sub-graph/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "子图布局",
11 | "en": "SubGraph Layout"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*7dQoTLrT2xMAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/sub-graph/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: SubGraph
3 | order: 16
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/layout/sub-graph/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 子图布局
3 | order: 16
4 | ---
5 |
--------------------------------------------------------------------------------
/packages/site/examples/performance/massive-data/demo/20000.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/20000.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | animation: false,
9 | autoFit: 'view',
10 | data,
11 | node: {
12 | style: {
13 | size: 8,
14 | },
15 | palette: {
16 | type: 'group',
17 | field: 'cluster',
18 | },
19 | },
20 | behaviors: ['zoom-canvas', 'drag-canvas'],
21 | });
22 |
23 | graph.render();
24 | });
25 |
--------------------------------------------------------------------------------
/packages/site/examples/performance/massive-data/demo/5000.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/5000.json')
4 | .then((res) => res.json())
5 | .then(async (data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | animation: false,
9 | data,
10 | behaviors: ['zoom-canvas', 'drag-canvas', 'drag-element'],
11 | autoFit: 'view',
12 | });
13 |
14 | await graph.render();
15 | });
16 |
--------------------------------------------------------------------------------
/packages/site/examples/performance/massive-data/demo/60000.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/60000.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | animation: false,
9 | autoFit: 'view',
10 | data,
11 | node: {
12 | style: {
13 | size: 4,
14 | batchKey: 'node',
15 | },
16 | },
17 | behaviors: ['zoom-canvas', 'drag-canvas'],
18 | });
19 |
20 | graph.render();
21 | });
22 |
--------------------------------------------------------------------------------
/packages/site/examples/performance/massive-data/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Massive Data
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/performance/massive-data/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 大数据量
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/background/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "background.js",
9 | "title": {
10 | "zh": "背景图片",
11 | "en": "Background Image"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*eCkYR7cLfWwAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/background/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Background
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/background/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Background 背景图
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/bubble-sets/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "用气泡集包裹节点集",
11 | "en": "Use Bubblesets to wrap the node sets."
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*JwvxTbOoWQ8AAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/bubble-sets/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Bubblesets
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/bubble-sets/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Bubblesets 气泡集
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/contextMenu/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "上下文菜单",
11 | "en": "Context Menu"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*9o1lRbfc3YMAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/contextMenu/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: ContextMenu
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/contextMenu/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Contextmenu 上下文菜单
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-bundling/demo/basic.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | fetch('https://assets.antv.antgroup.com/g6/circular.json')
4 | .then((res) => res.json())
5 | .then((data) => {
6 | const graph = new Graph({
7 | container: 'container',
8 | autoFit: 'view',
9 | data,
10 | layout: {
11 | type: 'circular',
12 | },
13 | node: { style: { size: 20 } },
14 | behaviors: ['drag-canvas', 'drag-element'],
15 | plugins: [
16 | {
17 | key: 'edge-bundling',
18 | type: 'edge-bundling',
19 | bundleThreshold: 0.1,
20 | },
21 | ],
22 | });
23 |
24 | graph.render();
25 | });
26 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-bundling/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "边绑定",
11 | "en": "Edge Bundling"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*aC-VQJmDwdkAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-bundling/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: EdgeBundling
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-bundling/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: EdgeBundling 边绑定
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-filter-lens/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "边过滤镜",
11 | "en": "Edge Filter Lens"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*62FuSY-LFEIAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-filter-lens/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: EdgeFilterLens
3 | ---
4 |
5 | EdgeFilterLens can keep the focused edges within the lens range, while other edges will not be displayed within that range.
6 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/edge-filter-lens/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: EdgeFilterLens 边过滤镜
3 | ---
4 |
5 | 边过滤镜可以将关注的边保留在过滤镜范围内，其他边将在该范围内不显示。
6 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/fisheye/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "鱼眼放大镜",
11 | "en": "Fisheye"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*SPqiTLwdZ9MAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "custom.js",
17 | "title": {
18 | "zh": "自定义鱼眼放大镜",
19 | "en": "Custom Fisheye"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*-VyPRY-2dMIAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/fisheye/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fisheye
3 | ---
4 |
5 | Fisheye is designed for focus+context exploration, it keeps the context and the relationships between context and the focus while magnifying the focus area.
6 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/fisheye/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fisheye 鱼眼放大镜
3 | ---
4 |
5 | Fisheye 鱼眼放大镜是为 focus+context 的探索场景设计的，它能够保证在放大关注区域的同时，保证上下文以及上下文与关注中心的关系不丢失。
6 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/fullscreen/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "全屏展示",
11 | "en": "Fullscreen"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*KQlbQZxPOvgAAAAAAAAAAAAAemJ7AQ/fmt.avif"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/fullscreen/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fullscreen
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/fullscreen/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Fullscreen 全屏展示
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/grid-line/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "画布网格",
11 | "en": "Grid Line"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*s66AQJ3FJMMAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/grid-line/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Grid Line
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/grid-line/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Grid Line 网格线
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/history/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "撤销重做",
11 | "en": "Redo/Undo"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*5K19SrUgO6QAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/history/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: History
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/history/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: History 撤销重做
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/hull/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "用轮廓包裹节点集合",
11 | "en": "Use hulls to wrap the node sets."
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*YXHtRZUKAZcAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/hull/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Hull
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/hull/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Hull 节点集轮廓包裹
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/legend/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Legend
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/legend/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Legend 图例
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/minimap/demo/basic.js:
--------------------------------------------------------------------------------
1 | import { Graph } from '@antv/g6';
2 |
3 | const graph = new Graph({
4 | container: 'container',
5 | data: { nodes: Array.from({ length: 20 }).map((_, i) => ({ id: `node${i}` })) },
6 | behaviors: ['drag-canvas', 'zoom-canvas', 'drag-element'],
7 | plugins: [
8 | {
9 | type: 'minimap',
10 | size: [240, 160],
11 | },
12 | ],
13 | node: {
14 | palette: 'spectral',
15 | },
16 | layout: {
17 | type: 'circular',
18 | },
19 | autoFit: 'view',
20 | });
21 |
22 | graph.render();
23 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/minimap/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "小地图",
11 | "en": "Minimap"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*asv5Roh25YkAAAAAAAAAAAAADmJ7AQ/original"
14 | }
15 | ]
16 | }
17 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/minimap/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Minimap
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/minimap/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Minimap 小地图
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/snapline/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "对齐线",
11 | "en": "Snapline"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*MU65RolCuPkAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "autoSnap.js",
17 | "title": {
18 | "zh": "支持自动吸附",
19 | "en": "Snapline with auto snap"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*67Y_RpCskBMAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/snapline/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Snapline
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/snapline/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Snapline 对齐线
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/timebar/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "time.js",
9 | "title": {
10 | "zh": "时间模式",
11 | "en": "Time Mode"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*94CATK7VwhQAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "chart.js",
17 | "title": {
18 | "zh": "图表模式",
19 | "en": "Chart Mode"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*RjCKS6xdRWwAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/timebar/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Timebar
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/timebar/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Timebar 时间条
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/toolbar/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "basic.js",
9 | "title": {
10 | "zh": "工具栏",
11 | "en": "ToolBar"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*IXshSoyeZHEAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "custom.js",
17 | "title": {
18 | "zh": "自定义工具栏",
19 | "en": "ToolBar"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*U_72RJtvwEIAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/toolbar/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: ToolBar
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/toolbar/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Toolbar 工具栏
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/tooltip/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Tooltip
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/tooltip/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Tooltip 提示框
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/watermark/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "text.js",
9 | "title": {
10 | "zh": "文本水印",
11 | "en": "Text Watermark"
12 | },
13 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*GPRuRqBUIsoAAAAAAAAAAAAADmJ7AQ/original"
14 | },
15 | {
16 | "filename": "repeat.js",
17 | "title": {
18 | "zh": "重复图片",
19 | "en": "Repeat Image"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*8NfwR5QEXvIAAAAAAAAAAAAADmJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/watermark/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Watermark
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/plugin/watermark/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Watermark 水印
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/scene-case/default/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Scene Case
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/scene-case/default/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 场景案例
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/scene-case/tree-graph/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: TreeGraph Scene Case
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/scene-case/tree-graph/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 树图场景案例
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/transform/process-parallel-edges/demo/meta.json:
--------------------------------------------------------------------------------
1 | {
2 | "title": {
3 | "zh": "中文分类",
4 | "en": "Category"
5 | },
6 | "demos": [
7 | {
8 | "filename": "bundle.js",
9 | "title": {
10 | "zh": "捆绑模式",
11 | "en": "Bundle Mode"
12 | },
13 | "screenshot": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*g2p_Qa_wZcIAAAAAAAAAAABkARQnAQ"
14 | },
15 | {
16 | "filename": "merge.js",
17 | "title": {
18 | "zh": "合并模式",
19 | "en": "Merge Mode"
20 | },
21 | "screenshot": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*3dsfSZunOjEAAAAAAAAAAAAAemJ7AQ/original"
22 | }
23 | ]
24 | }
25 |
--------------------------------------------------------------------------------
/packages/site/examples/transform/process-parallel-edges/index.en.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Process Parallel Edges
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/examples/transform/process-parallel-edges/index.zh.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: Process Parallel Edges 平行边
3 | ---
4 |
--------------------------------------------------------------------------------
/packages/site/mako.config.json:
--------------------------------------------------------------------------------
1 | {
2 | "optimization": {
3 | "skipModules": false,
4 | "concatenateModules": false
5 | }
6 | }
7 |
--------------------------------------------------------------------------------
/packages/site/src/constants/index.ts:
--------------------------------------------------------------------------------
1 | export * from './link';
2 | export * from './locales';
3 |
--------------------------------------------------------------------------------
/packages/site/src/constants/locales/api-category.json:
--------------------------------------------------------------------------------
1 | {
2 | "option": ["Option", "图配置项"],
3 | "render": ["Render", "渲染"],
4 | "data": ["Data", "数据"],
5 | "instance": ["Instance", "图实例"],
6 | "canvas": ["Canvas", "画布"],
7 | "viewport": ["Viewport", "视口"],
8 | "element": ["Element", "元素"],
9 | "animation": ["Animation", "动画"],
10 | "layout": ["Layout", "布局"],
11 | "behavior": ["Behavior", "交互"],
12 | "event": ["Event", "事件"],
13 | "theme": ["Theme", "主题"],
14 | "transform": ["Transform", "数据转换"],
15 | "plugin": ["plugin", "插件"],
16 | "exportImage": ["Export Image", "导出图片"]
17 | }
18 |
--------------------------------------------------------------------------------
/packages/site/src/constants/locales/element.json:
--------------------------------------------------------------------------------
1 | {
2 | "node": ["Node", "节点"],
3 | "edge": ["Edge", "边"],
4 | "combo": ["Combo", "组合"]
5 | }
6 |
--------------------------------------------------------------------------------
/packages/site/src/utils/parser.ts:
--------------------------------------------------------------------------------
1 | import type { DocBlock, DocComment, DocSection } from '@microsoft/tsdoc';
2 |
3 | /**
4 | *
5 | * @param tagName
6 | * @param docComment
7 | */
8 | export function getBlockTagByName(tagName: string, docComment: DocComment): DocSection | undefined {
9 | const tag = docComment.customBlocks.find((customBlock: DocBlock) => customBlock.blockTag.tagName === tagName);
10 | return tag && tag.content;
11 | }
12 |
--------------------------------------------------------------------------------
/packages/site/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "../../tsconfig.json",
3 | "compilerOptions": {
4 | "baseUrl": ".",
5 | "jsx": "react",
6 | "lib": ["dom"],
7 | "paths": {
8 | "@antv/g6": ["../g6/lib/index"]
9 | },
10 | "module": "CommonJS"
11 | },
12 | "include": [".dumirc.ts"]
13 | }
14 |
--------------------------------------------------------------------------------
/pnpm-workspace.yaml:
--------------------------------------------------------------------------------
1 | packages:
2 | - 'packages/*'
--------------------------------------------------------------------------------
/scripts/demo-to-test/core/global.js:
--------------------------------------------------------------------------------
1 | // global object
2 | let GLOBALSTATE = {
3 | staticCode: [],
4 | };
5 |
6 | const RESETGLOBAL = () => {
7 | GLOBALSTATE = { staticCode: [] };
8 | };
9 |
10 | const SETGLOBAL = ([start, end]) => {
11 | GLOBALSTATE['staticCode'].push([start, end]);
12 | };
13 |
14 | const INGLOBALRANGE = ([start, end]) => {
15 | const { staticCode } = GLOBALSTATE;
16 | let flag = false;
17 | for (let i = 0; i < staticCode.length; i++) {
18 | const [s, e] = staticCode[i];
19 | if ((start >= s && start <= e) || (end >= s && end <= e)) {
20 | flag = true;
21 | }
22 | }
23 | return flag;
24 | };
25 |
26 | module.exports = { RESETGLOBAL, INGLOBALRANGE, SETGLOBAL };
27 |
--------------------------------------------------------------------------------
/scripts/demo-to-test/core/index.js:
--------------------------------------------------------------------------------
1 | const { parser, transformSign } = require('./parser');
2 |
3 | module.exports = { parser, transformSign };
4 |
--------------------------------------------------------------------------------
/scripts/demo-to-test/template/it.js:
--------------------------------------------------------------------------------
1 | const itTemplate = ({ camelName, sampleKebabName, sampleKebabNameWithSpace }) => {
2 | return `it('${sampleKebabNameWithSpace}', async () => {
3 | const graph = await createDemoGraph(${camelName});
4 | await expect(graph).toMatchSnapshot(__filename, '${sampleKebabName}');
5 | graph.destroy();
6 | });`;
7 | };
8 |
9 | module.exports = itTemplate;
10 |
--------------------------------------------------------------------------------
/scripts/demo-to-test/template/spec.js:
--------------------------------------------------------------------------------
1 | const specTemplate = ({ imported, content, describe }) => {
2 | return `import {
3 | ${imported}
4 | } from '@@/demo/case';
5 | import { createDemoGraph } from '@@/utils';
6 |
7 | describe('${describe}', () => {
8 | ${content}
9 | })`;
10 | };
11 |
12 | module.exports = specTemplate;
13 |
--------------------------------------------------------------------------------
/scripts/demo-to-test/template/test.js:
--------------------------------------------------------------------------------
1 | const testTemplate = ({ config, filename, dataFile }) => {
2 | return `import { Graph } from '@/src';
3 | import data from '@@/dataset/${dataFile}';
4 | import type { STDTestCase } from '../types';
5 |
6 | export const ${filename}: STDTestCase = async (context) => {
7 | const graph = new Graph({
8 | ...context,
9 | data,
10 | ${config}
11 | });
12 |
13 | await graph.render();
14 |
15 | return graph;
16 | };
17 | `;
18 | };
19 |
20 | module.exports = testTemplate;
21 |
--------------------------------------------------------------------------------
/scripts/version.sh:
--------------------------------------------------------------------------------
1 | #!/bin/bash
2 |
3 | pnpm changeset
4 | pnpm changeset version
5 |
6 | cd ./packages/g6 && npm run version
--------------------------------------------------------------------------------
/tests/g6/elements/node-element.spec.ts:
--------------------------------------------------------------------------------
1 | import { expect, test } from '@playwright/test';
2 |
3 | test.describe('element node html', () => {
4 | test('html', async ({ page }) => {
5 | await page.goto('/?Demo=elementNodeHTML&Renderer=canvas&GridLine=true&Theme=light&Animation=false');
6 |
7 | await page.waitForSelector('.key');
8 |
9 | const clip = { x: 100, y: 100, width: 240, height: 180 };
10 |
11 | await expect(page).toHaveScreenshot({ clip });
12 | });
13 | });
14 |
--------------------------------------------------------------------------------
/tests/g6/elements/node-element.spec.ts-snapshots/element-node-html-html-1-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/elements/node-element.spec.ts-snapshots/element-node-html-html-1-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-1-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-1-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-2-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-2-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-3-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-3-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-4-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-4-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-5-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-5-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-6-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-minimap.spec.ts-snapshots/plugin-minimap-default-6-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-tooltip.spec.ts-snapshots/plugin-tooltip-bug-tooltip-should-has-correct-position-after-graph-resize-1-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-tooltip.spec.ts-snapshots/plugin-tooltip-bug-tooltip-should-has-correct-position-after-graph-resize-1-chromium-darwin.png
--------------------------------------------------------------------------------
/tests/g6/plugins/plugins-tooltip.spec.ts-snapshots/plugin-tooltip-bug-tooltip-should-has-correct-position-after-graph-resize-2-chromium-darwin.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/antvis/G6/86f574bdd2c28cc267fd6fccd2144ef8198c4729/tests/g6/plugins/plugins-tooltip.spec.ts-snapshots/plugin-tooltip-bug-tooltip-should-has-correct-position-after-graph-resize-2-chromium-darwin.png
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "allowSyntheticDefaultImports": true,
4 | "declaration": true,
5 | "esModuleInterop": true,
6 | "forceConsistentCasingInFileNames": true,
7 | "isolatedModules": true,
8 | "module": "esnext",
9 | "moduleResolution": "Node",
10 | "pretty": true,
11 | "resolveJsonModule": true,
12 | "skipLibCheck": true,
13 | "sourceMap": true,
14 | "strict": true,
15 | "target": "ES6",
16 | "types": ["node", "@types/jest"]
17 | },
18 | "exclude": ["node_modules"]
19 | }
20 |
--------------------------------------------------------------------------------
/turbo.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://turbo.build/schema.json",
3 | "pipeline": {
4 | "build": {
5 | "dependsOn": ["^build"],
6 | "outputs": ["dist/**", "esm/**", "lib/**"]
7 | },
8 | "ci": {
9 | "dependsOn": ["^ci"]
10 | },
11 | "version": {}
12 | }
13 | }
14 |
--------------------------------------------------------------------------------