{"id":13670929,"url":"https://github.com/lkiarest/flow-chart","last_synced_at":"2025-07-03T06:03:04.247Z","repository":{"id":149611203,"uuid":"70546864","full_name":"lkiarest/flow-chart","owner":"lkiarest","description":"流程图工具","archived":false,"fork":false,"pushed_at":"2016-10-31T08:41:08.000Z","size":104,"stargazers_count":164,"open_issues_count":1,"forks_count":60,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-04-04T23:41:41.035Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lkiarest.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-10-11T02:14:15.000Z","updated_at":"2024-11-28T19:38:40.000Z","dependencies_parsed_at":"2023-04-25T11:32:14.795Z","dependency_job_id":null,"html_url":"https://github.com/lkiarest/flow-chart","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/lkiarest/flow-chart","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lkiarest%2Fflow-chart","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lkiarest%2Fflow-chart/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lkiarest%2Fflow-chart/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lkiarest%2Fflow-chart/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lkiarest","download_url":"https://codeload.github.com/lkiarest/flow-chart/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lkiarest%2Fflow-chart/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":263271506,"owners_count":23440396,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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"}},"keywords":[],"created_at":"2024-08-02T09:00:53.629Z","updated_at":"2025-07-03T06:03:04.185Z","avatar_url":"https://github.com/lkiarest.png","language":"JavaScript","readme":"# flow-chart\n流程图工具\n\nDemo演示：[https://lkiarest.github.io/flow-chart/demo/demo.html](https://lkiarest.github.io/flow-chart/demo/demo.html)\n\n基于 jsplumb 封装一个使用十分简单的流程图处理类。\n\n样式使用less处理\n\n### 引入依赖文件\n```\n\u003clink rel=\"stylesheet\" type=\"text/css\" href=\"../chart.css\"\u003e\n\u003cscript src=\"../libs/jquery.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"../libs/jsPlumb.min.js\"\u003e\u003c/script\u003e\n\u003cscript src='../chart.js'\u003e\u003c/script\u003e\n```\n\n### 常用操作\n```\nChart.ready(() =\u003e { // 初始化\n    // 创建画布\n    let chart = new Chart($('#div1'), {\n        onNodeClick (data) { // 点击节点时触发的事件\n            console.log(data);\n        }\n    });\n\n    // 添加节点\n    let nodeStart = chart.addNode('开始', basicX, startY, {\n        class: 'node-start', // 自定义节点样式\n        data: { // 节点绑定数据，在click事件中可以获取\n            name: '开始',\n            nodeType: 0\n        }\n    });\n    // 添加端口\n    nodeStart.addPort({\n        isSource: true\n    });\n\n    // 获取所有节点\n    console.log(chart.getNodes());\n\n    // 序列化用以保存\n    console.log(JSON.stringify(chart.toJson()));\n\n    // 删除节点 - 1\n    nodeStart.dispose();\n    // 删除节点 - 2\n    chart.removeNode(nodeStart.getId());\n});\n```","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flkiarest%2Fflow-chart","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flkiarest%2Fflow-chart","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flkiarest%2Fflow-chart/lists"}