{"id":14973631,"url":"https://github.com/vue-gl/vue-gl","last_synced_at":"2025-05-15T23:05:00.129Z","repository":{"id":37752191,"uuid":"102296437","full_name":"vue-gl/vue-gl","owner":"vue-gl","description":"Vue.js components rendering 3D WebGL graphics reactively with three.js","archived":false,"fork":false,"pushed_at":"2024-03-29T08:03:22.000Z","size":18430,"stargazers_count":683,"open_issues_count":32,"forks_count":73,"subscribers_count":18,"default_branch":"master","last_synced_at":"2025-05-07T08:34:43.310Z","etag":null,"topics":["3d","3d-graphics","custom","element","elements","graphics","html","tag","tags","three","three-js","threejs","vue","vue-components","vue2","vuejs","vuejs2","web","webgl"],"latest_commit_sha":null,"homepage":"https://vue-gl.github.io/","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/vue-gl.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null},"funding":{"open_collective":"vue-gl","issuehunt":"vue-gl"}},"created_at":"2017-09-03T21:51:38.000Z","updated_at":"2025-04-23T13:50:39.000Z","dependencies_parsed_at":"2024-04-15T08:14:59.568Z","dependency_job_id":null,"html_url":"https://github.com/vue-gl/vue-gl","commit_stats":{"total_commits":1671,"total_committers":15,"mean_commits":111.4,"dds":0.7031717534410533,"last_synced_commit":"75b0a9611d2ab98a228c7b2437fc0f967988061c"},"previous_names":[],"tags_count":40,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-gl%2Fvue-gl","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-gl%2Fvue-gl/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-gl%2Fvue-gl/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-gl%2Fvue-gl/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vue-gl","download_url":"https://codeload.github.com/vue-gl/vue-gl/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253611124,"owners_count":21935819,"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":["3d","3d-graphics","custom","element","elements","graphics","html","tag","tags","three","three-js","threejs","vue","vue-components","vue2","vuejs","vuejs2","web","webgl"],"created_at":"2024-09-24T13:49:06.777Z","updated_at":"2025-05-15T23:05:00.106Z","avatar_url":"https://github.com/vue-gl.png","language":"JavaScript","funding_links":["https://opencollective.com/vue-gl","https://issuehunt.io/r/vue-gl","https://opencollective.com/vue-gl/contribute","https://opencollective.com/vue-gl/organization/0/website","https://opencollective.com/vue-gl/organization/1/website","https://opencollective.com/vue-gl/organization/2/website","https://opencollective.com/vue-gl/organization/3/website","https://opencollective.com/vue-gl/organization/4/website","https://opencollective.com/vue-gl/organization/5/website","https://opencollective.com/vue-gl/organization/6/website","https://opencollective.com/vue-gl/organization/7/website","https://opencollective.com/vue-gl/organization/8/website","https://opencollective.com/vue-gl/organization/9/website"],"categories":["UI Utilities [🔝](#readme)","JavaScript","UI实用程序","Components \u0026 Libraries","UI Utilities"],"sub_categories":["WebGL的","UI Utilities","WebGL"],"readme":"# VueGL\n\n[Vue.js](https://vuejs.org/) components rendering 3D WebGL graphics reactively with\n[three.js](https://threejs.org/).\n\n[![NPM](https://nodei.co/npm/vue-gl.png?compact=true)](https://nodei.co/npm/vue-gl/\n)  \n[![Financial Contributors on Open Collective](https://opencollective.com/vue-gl/all/badge.svg?label=financial+contributors)](https://opencollective.com/vue-gl)\n\n## Usage\n\n```html\n\u003c!-- Load scripts --\u003e\n\u003cscript src=\"https://unpkg.com/vue\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://unpkg.com/three\"\u003e\u003c/script\u003e\n\u003cscript src=\"https://unpkg.com/vue-gl\"\u003e\u003c/script\u003e\n\n\u003c!-- Define canvas and objects --\u003e\n\u003cvgl-renderer id=\"my-canvas\"\u003e\n  \u003ctemplate #scene\u003e\n    \u003cvgl-scene\u003e\n      \u003cvgl-mesh\u003e\n        \u003ctemplate #geometry\u003e\n          \u003cvgl-sphere-geometry\u003e\u003c/vgl-sphere-geometry\u003e\n        \u003c/template\u003e\n        \u003ctemplate #material\u003e\n          \u003cvgl-mesh-basic-material\u003e\u003c/vgl-mesh-basic-material\u003e\n        \u003c/template\u003e\n      \u003c/vgl-mesh\u003e\n    \u003c/vgl-scene\u003e\n  \u003c/template\u003e\n  \u003ctemplate #camera\u003e\n    \u003cvgl-perspective-camera position=\"spherical\" :position-radius=\"5\"\u003e\u003c/vgl-perspective-camera\u003e\n  \u003c/template\u003e\n\u003c/vgl-renderer\u003e\n\n\u003c!-- Register components and start vue --\u003e\n\u003cscript\u003e\n  new Vue({ el: \"#my-canvas\", components: VueGL });\n\u003c/script\u003e\n```\n\n[See the documentation](//vue-gl.github.io) for more information.\n\n## Available components\n\n[Components reference](//vue-gl.github.io/components/) shows a list of available\ncore components. [Example components reference](//vue-gl.github.io/examples/) also\nintroduces additional components you can use immediately.\n\nThe list of components not implemented yet can be found at [this project](https://github.com/vue-gl/vue-gl/projects/1).\n\n## Contribution\n\nAre you interested in enhance this product?\nWe're really glad and thanks a lot!  \nSee [Contributing guidelines](CONTRIBUTING.md) to get started.\n\n### Code Contributors\n\nThis project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].\n\u003ca href=\"https://github.com/vue-gl/vue-gl/graphs/contributors\"\u003e\n  \u003cimg src=\"https://opencollective.com/vue-gl/contributors.svg?width=890\u0026button=false\"\u003e\n\u003c/a\u003e\n\n### Financial Contributors\n\nBecome a financial contributor and help us sustain our community. [[Contribute](https://opencollective.com/vue-gl/contribute)]\n\n#### Individuals\n\n\u003ca href=\"https://opencollective.com/vue-gl\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/individuals.svg?width=890\"\u003e\u003c/a\u003e\n\n#### Organizations\n\nSupport this project with your organization. Your logo will show up here with a\nlink to your website. [[Contribute](https://opencollective.com/vue-gl/contribute)]\n\n\u003ca href=\"https://opencollective.com/vue-gl/organization/0/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/0/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/1/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/1/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/2/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/2/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/3/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/3/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/4/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/4/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/5/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/5/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/6/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/6/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/7/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/7/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/8/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/8/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/vue-gl/organization/9/website\"\u003e\u003cimg src=\"https://opencollective.com/vue-gl/organization/9/avatar.svg\"\u003e\u003c/a\u003e\n\n## License\n\n[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fvue-gl%2Fvue-gl.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fvue-gl%2Fvue-gl?ref=badge_large)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvue-gl%2Fvue-gl","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvue-gl%2Fvue-gl","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvue-gl%2Fvue-gl/lists"}