{"id":30200,"url":"https://github.com/lloydzhou/awesome-x6","name":"awesome-x6","description":"Awesome list of antv x6","projects_count":36,"last_synced_at":"2026-10-15T13:00:32.529Z","repository":{"id":166486198,"uuid":"607463101","full_name":"lloydzhou/awesome-x6","owner":"lloydzhou","description":"Awesome list of antv x6","archived":false,"fork":false,"pushed_at":"2025-12-11T03:39:37.000Z","size":52,"stargazers_count":45,"open_issues_count":0,"forks_count":4,"subscribers_count":2,"default_branch":"master","last_synced_at":"2026-09-26T04:21:00.475Z","etag":null,"topics":["antv","dag","diagram","flowchart","graph","graph-editor","javascript","svg","x6"],"latest_commit_sha":null,"homepage":"https://x6.antv.antgroup.com/","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lloydzhou.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2023-02-28T02:35:00.000Z","updated_at":"2026-06-25T06:25:57.000Z","dependencies_parsed_at":"2024-01-13T14:49:24.616Z","dependency_job_id":"3ed0e0a8-bc7d-4842-bd58-21a024fd128d","html_url":"https://github.com/lloydzhou/awesome-x6","commit_stats":null,"previous_names":["lloydzhou/awesome-x6"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/lloydzhou/awesome-x6","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lloydzhou%2Fawesome-x6","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lloydzhou%2Fawesome-x6/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lloydzhou%2Fawesome-x6/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lloydzhou%2Fawesome-x6/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lloydzhou","download_url":"https://codeload.github.com/lloydzhou/awesome-x6/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lloydzhou%2Fawesome-x6/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":344836268,"owners_count":38329943,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-10-03T21:59:58.778Z","status":"online","status_checked_at":"2026-10-15T02:00:06.843Z","response_time":105,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"created_at":"2024-01-13T12:58:08.090Z","updated_at":"2026-10-15T13:00:32.529Z","primary_language":null,"list_of_lists":false,"displayable":true,"categories":["Learn","Frameworks","About"],"sub_categories":["Official docs","Screencasts / Videos","React Component","Vue Component","Devtool","Angular Component","Svelte Component","HTML shape"],"readme":"# awesome-x6 [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)\n\nAwesome list of [@antv/x6](https://github.com/antvis/x6/)\n\n\u003e **Note**\n\u003e\n\u003e 带有「🇨🇳」的项目为中文资源，或包含中文文档。\n\u003e \n\u003e Items with “🇨🇳” are either in Chinese, or contain Chinese documentation.\n\n- [About](#about)\n- [Learn](#learn)\n    - [Official docs](#official-docs)\n- [Frameworks](#frameworks)\n    - [React Component](#react-component)\n    - [Vue Component](#vue-component)\n    - [Angular Component](#angular-component)\n    - [Svelte Component](#svelte-component)\n    - [HTML shape](#html-shape)\n    - [Devtool](#devtool)\n\n\n## About\n\n[X6 JavaScript Diagramming Library](https://github.com/antvis/x6/)\nX6 is AntV's diagram editing engine, which provides a series of easy-to-use interactive components and node customization capabilities to facilitate the rapid construction of DAG diagrams, ER diagrams, flowcharts and other applications\n\n[X6](https://github.com/antvis/x6/) 是基于 HTML 和 SVG 的图编辑引擎，提供低成本的定制能力和开箱即用的内置扩展，方便我们快速搭建 DAG 图、ER 图、流程图、血缘图等应用。\n\n\n\n## Learn\n\n\n### Official docs\n\n- 🇨🇳 [教程](https://x6.antv.antgroup.com/tutorial/about)\n- 🇨🇳 [API](https://x6.antv.antgroup.com/api/graph/graph)\n- [示例](http://x6.antv.antgroup.com/examples)\n- [博客](https://www.yuque.com/antv/x6/huhla47wqalq5n7r)\n- [更新日志](https://www.yuque.com/antv/x6/bbfu6r)\n- [常见问题](https://www.yuque.com/antv/x6/tox1ukbz5cw57qfy)\n- [CodeSanbox 模板](https://codesandbox.io/s/mo-ban-wchooy?file=/src/App.tsx)\n- [1.x](https://x6.antv.vision/en)\n- 🇨🇳 [1.x](https://antv-x6.gitee.io/zh/)\n\n### Screencasts / Videos \n\n- [ANTV X6 JavaScript Diagramming Library: Lets build a workflow editor (Drag and Drop Nodes)](https://www.youtube.com/watch?v=EMtcA5z1fAg)\n\n## Frameworks\n\n### React Component\n- 🇨🇳 [xflow](https://github.com/antvis/xflow) - Professional graph editing application-level solution\n- 🇨🇳 [@ant-design/flowchart](https://github.com/ant-design/ant-design-charts/blob/master/packages/flowchart/README.md) - Flowchart solutions, based on XFlow.\n- 🇨🇳 [imove](https://github.com/i5ting/imove) - iMove 是一个逻辑可复用的，面向函数的，流程可视化的 JavaScript 工具库\n- 🇨🇳 [react-x6](https://github.com/lloydzhou/react-x6) - Using custom [react-reconciler](https://github.com/facebook/react/tree/main/packages/react-reconciler) to render x6 object in react.\n- 🇨🇳 [x6-graph/react](https://github.com/lloydzhou/x6-graph) - using context to wrap x6 graph as react component.\n- 🇨🇳 [x6-hooks/react](https://github.com/lloydzhou/x6-hooks) - provide react hook `useGraphState` to manager state for @antv/x6\n- 🇨🇳 [antv-x6-react](https://github.com/lloydzhou/antv-x6-react) - the react toolkit for graph analysis based on x6\n\n\n### Vue Component\n- 🇨🇳 [zsflow-editor](https://gitee.com/gfqy/zsflow-editor) - vue3+AntV X6 2.0版本 完成的流程设计器。内控业务属性的系统流程审批使用.\n- 🇨🇳 [vue-x6](https://github.com/lloydzhou/vue-x6) @lloydzhou - Using [custom-renderer](https://vuejs.org/api/custom-renderer.html) to render x6 object in vue.\n- 🇨🇳 [x6-graph/vue](https://github.com/lloydzhou/x6-graph) - using `provide`/`inject` api to wrap x6 graph as vue component.\n- 🇨🇳 [x6-hooks/vue](https://github.com/lloydzhou/x6-hooks) - provide vue hook `useGraphState` to manager state for @antv/x6\n- 🇨🇳 [antv-x6-vue](https://github.com/lloydzhou/antv-x6-vue) - the vue toolkit for graph analysis based on x6\n- 🇨🇳 [antv-x6-vue2](https://github.com/g0ngjie/antv-x6-vue2) @g0ngjie - @antv/x6 基于 vue2 + composition-api 的图形化编辑器\n- 🇨🇳 [vue-x6-flow](https://github.com/MyButifullyLife/vue-x6-flow) @MyButifullyLife - vue版流程图简易编辑器、简单易上手\n- 🇨🇳 [vue-x6-flow](https://github.com/xw-an/vue-x6-flow) @xw-an - 基于vue2.x+antdesign+antv x6实现的流程图编辑器\n- 🇨🇳 [vue-x6-flow](https://github.com/lxl19920401/vue-x6-flow) @lxl19920401 - 基于vue2.x+antdesign+antv x6实现的流程图编辑器\n- 🇨🇳 [vue-x6-editor](https://gitee.com/martsforever-pot/vue-x6-editor) - 基于@antv/x6以及plain-ui-composition封装的Vue3.0可视化流程编辑组件\n- 🇨🇳 [x6-flow](https://github.com/lourain/x6-flow) - flowchart base on X6 and Vue\n- 🇨🇳 [vue-x6](https://github.com/AK081KA/vue-x6) @AK081KA - x6的vue实践\n\n\n### Angular Component\n- 🇨🇳 [ngx-x6-demo](https://github.com/Eve-Sama/ngx-x6-demo) @Eve-Sama - Demos of antv-x6 in angular\n\n\n### Svelte Component\n- 🇨🇳 [antv-x6-svelte](https://github.com/lloydzhou/antv-x6-svelte) - antv x6 svelte as web component\n- 🇨🇳 [x6-svelte-shape](https://github.com/smallshen/x6-svelte-shape) - antv x6 svelte shape\n\n### HTML shape\n- 🇨🇳 [x6-html-shape](https://github.com/lloydzhou/x6-html-shape) - 非官方版自定义组件：可选择不依赖foreignObject挂载自定义组件，支持react18/react17/react-portal/vue2/vue3/vue-teleport/svelte等7种方式自定义节点\n\n### Devtool\n- 🇨🇳 [x6-devtool](https://github.com/antvis/x6-extensions/tree/master/packages/x6-devtool) - A devtool for @antv/x6 in chrome\n\n\n\n\n\n\n\n\n","projects_url":"https://awesome.ecosyste.ms/api/v1/lists/lloydzhou%2Fawesome-x6/projects"}