{"id":23060854,"url":"https://github.com/syncfusionexamples/getting-started-with-the-vue-diagram-component","last_synced_at":"2025-04-03T07:17:06.519Z","repository":{"id":221645724,"uuid":"754958416","full_name":"SyncfusionExamples/Getting-Started-with-the-Vue-Diagram-Component","owner":"SyncfusionExamples","description":"A quick-start Vue project that shows how to add a Syncfusion Vue Diagram component to a Vue project. It includes code snippets to create nodes and connectors, join the nodes using connectors, and add segments and annotations to the connectors.","archived":false,"fork":false,"pushed_at":"2024-12-02T13:40:46.000Z","size":9,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-08T20:47:52.435Z","etag":null,"topics":["create","diagram","diagrambuilder","gettingstarted","quickstart","tutorial","vue","vue-components","vue-diagram","vue-ui-components","vuejs"],"latest_commit_sha":null,"homepage":"","language":"Vue","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/SyncfusionExamples.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,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-02-09T05:34:54.000Z","updated_at":"2024-02-09T05:45:59.000Z","dependencies_parsed_at":"2025-02-08T20:44:07.652Z","dependency_job_id":"011d7ee3-88d8-4686-b97b-3c38d25676c0","html_url":"https://github.com/SyncfusionExamples/Getting-Started-with-the-Vue-Diagram-Component","commit_stats":null,"previous_names":["syncfusionexamples/getting-started-with-the-vue-diagram-component"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SyncfusionExamples%2FGetting-Started-with-the-Vue-Diagram-Component","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SyncfusionExamples%2FGetting-Started-with-the-Vue-Diagram-Component/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SyncfusionExamples%2FGetting-Started-with-the-Vue-Diagram-Component/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SyncfusionExamples%2FGetting-Started-with-the-Vue-Diagram-Component/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SyncfusionExamples","download_url":"https://codeload.github.com/SyncfusionExamples/Getting-Started-with-the-Vue-Diagram-Component/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246952274,"owners_count":20859813,"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":["create","diagram","diagrambuilder","gettingstarted","quickstart","tutorial","vue","vue-components","vue-diagram","vue-ui-components","vuejs"],"created_at":"2024-12-16T03:15:30.480Z","updated_at":"2025-04-03T07:17:06.490Z","avatar_url":"https://github.com/SyncfusionExamples.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Getting Started with the Vue Diagram Component\n\nA quick-start Vue project that shows how to add a Syncfusion [Vue Diagram]( https://www.syncfusion.com/vue-components/vue-diagram?utm_source=github\u0026utm_medium=listing\u0026utm_campaign=vue-diagram-gettingstarted-sample) component to a Vue project. It includes code snippets to create nodes and connectors, join the nodes using connectors, and add segments and annotations to the connectors.\n\nWatch the video: Coming soon...\n\nRefer to the following documentation to learn about the Vue Diagram component: https://ej2.syncfusion.com/vue/documentation/diagram/getting-started-vue-3\n\nCheck out this online example of the Vue Diagram component: https://ej2.syncfusion.com/vue/demos/#/material3/diagram/default-functionality.html\n\nMake sure you have the latest versions of Node.js and Visual Studio Code on your machine before working with this project.\n\n## How to run this application\nTo run this application, you need to clone the `Getting-Started-with-the-Vue-Diagram-Component` repository and then open it in Visual Studio Code. After that, just install all the necessary Vue packages in your project using the `npm install` command and run your project using the `npm run dev` command.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsyncfusionexamples%2Fgetting-started-with-the-vue-diagram-component","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsyncfusionexamples%2Fgetting-started-with-the-vue-diagram-component","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsyncfusionexamples%2Fgetting-started-with-the-vue-diagram-component/lists"}