{"id":15282481,"url":"https://github.com/shawn0326/zen-3d","last_synced_at":"2025-11-13T22:35:41.994Z","repository":{"id":45140004,"uuid":"65516064","full_name":"shawn0326/zen-3d","owner":"shawn0326","description":"JavaScript 3D library.","archived":false,"fork":false,"pushed_at":"2023-03-04T02:45:00.000Z","size":51406,"stargazers_count":196,"open_issues_count":5,"forks_count":24,"subscribers_count":13,"default_branch":"dev","last_synced_at":"2025-04-09T16:09:43.089Z","etag":null,"topics":["canvas","html5","javascript","webgl"],"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/shawn0326.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}},"created_at":"2016-08-12T02:18:08.000Z","updated_at":"2024-07-31T06:03:00.000Z","dependencies_parsed_at":"2023-02-12T00:46:21.079Z","dependency_job_id":"777ca1e7-1635-4cec-88cd-41ac3e9dfc0e","html_url":"https://github.com/shawn0326/zen-3d","commit_stats":{"total_commits":544,"total_committers":3,"mean_commits":"181.33333333333334","dds":"0.011029411764705843","last_synced_commit":"55bce9c6ec40399560e2301c95c81753e5a0cfc4"},"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shawn0326%2Fzen-3d","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shawn0326%2Fzen-3d/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shawn0326%2Fzen-3d/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shawn0326%2Fzen-3d/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shawn0326","download_url":"https://codeload.github.com/shawn0326/zen-3d/tar.gz/refs/heads/dev","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248065283,"owners_count":21041871,"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":["canvas","html5","javascript","webgl"],"created_at":"2024-09-30T14:26:23.165Z","updated_at":"2025-11-13T22:35:36.952Z","avatar_url":"https://github.com/shawn0326.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"zen-3d\n========\n\n[![NPM Package][npm]][npm-url]\n[![Build Size][build-size]][build-size-url]\n[![NPM Downloads][npm-downloads]][npmtrends-url]\n[![License][license-badge]][license-badge-url]\n[![Issues][issues-badge]][issues-badge-url]\n\n[![devDependencies Status](https://status.david-dm.org/gh/shawn0326/zen-3d.svg?type=dev)](https://david-dm.org/shawn0326/zen-3d?type=dev)\n[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/shawn0326/zen-3d.svg?logo=lgtm\u0026logoWidth=18)](https://lgtm.com/projects/g/shawn0326/zen-3d/context:javascript)\n[![Total alerts](https://img.shields.io/lgtm/alerts/g/shawn0326/zen-3d.svg?logo=lgtm\u0026logoWidth=18)](https://lgtm.com/projects/g/shawn0326/zen-3d/alerts/)\n\n### Moved ###\n\nThis project has moved and is now available at [t3d.js](https://github.com/UINOSOFT/t3d.js).\n\n### JavaScript 3D library ###\n\nThe aim of the project is to create an easy to use, lightweight, 3D/2D library. The library only provides WebGL renderers.\n\n[Examples](https://shawn0326.github.io/zen-3d/examples/) \u0026mdash;\n[RoadMap](https://trello.com/b/7Ie3DDBP) \u0026mdash;\n[Documentation](https://shawn0326.github.io/zen-3d/docs/) \u0026mdash;\n[Tests](https://shawn0326.github.io/zen-3d/tests/)\n\n### Usage ###\n\nUse `zen3d.js` or `zen3d.min.js` in your page:\n\n````html\n\u003cscript src=\"zen3d.min.js\"\u003e\u003c/script\u003e\n````\n\nor import as es6 module:\n\n````javascript\nimport * as zen3d from 'js/zen3d.module.js';\n````\n\ndraw a simple cube:\n\n````javascript\nvar width = window.innerWidth || 2;\nvar height = window.innerHeight || 2;\n\nvar canvas = document.createElement('canvas');\ncanvas.width = width;\ncanvas.height = height;\ndocument.body.appendChild(canvas);\n\nvar gl = canvas.getContext(\"webgl2\", {\n\tantialias: true,\n\talpha: false,\n\tstencil: true\n});\nvar glCore = new zen3d.WebGLCore(gl);\nglCore.state.colorBuffer.setClear(0.1, 0.1, 0.1, 1);\nvar backRenderTarget = new zen3d.RenderTargetBack(canvas);\n\nvar scene = new zen3d.Scene();\n\nvar geometry = new zen3d.CubeGeometry(8, 8, 8);\nvar material = new zen3d.PBRMaterial();\nvar mesh = new zen3d.Mesh(geometry, material);\nscene.add(mesh);\n\nvar ambientLight = new zen3d.AmbientLight(0xffffff);\nscene.add(ambientLight);\n\nvar directionalLight = new zen3d.DirectionalLight(0xffffff);\ndirectionalLight.position.set(-5, 5, 5);\ndirectionalLight.lookAt(new zen3d.Vector3(), new zen3d.Vector3(0, 1, 0));\nscene.add(directionalLight);\n\nvar camera = new zen3d.Camera();\ncamera.position.set(0, 10, 30);\ncamera.lookAt(new zen3d.Vector3(0, 0, 0), new zen3d.Vector3(0, 1, 0));\ncamera.setPerspective(45 / 180 * Math.PI, width / height, 1, 1000);\nscene.add(camera);\n\nfunction loop(count) {\n\trequestAnimationFrame(loop);\n\t\n\tmesh.euler.y = count / 1000 * .5; // rotate cube\n\n\tscene.updateMatrix();\n\tscene.updateLights();\n\n\tglCore.renderTarget.setRenderTarget(backRenderTarget);\n\n\tglCore.clear(true, true, false);\n\n\tglCore.render(scene, camera);\n}\nrequestAnimationFrame(loop);\n````\n\n### WebGL2 Support ###\n\n* [Multiple Render Targets](https://shawn0326.github.io/zen-3d/examples/#custompass_gbuffer). (WebGL 1.0 extension / WebGL 2.0)\n* [Instancing](https://shawn0326.github.io/zen-3d/examples/#webgl_instanced_draw). (WebGL 1.0 extension / WebGL 2.0)\n* Vertex Array Object. (WebGL 1.0 extension / WebGL 2.0)\n* [Shader Texture LOD](https://shawn0326.github.io/zen-3d/examples/#material_cubetexture_skybox). (WebGL 1.0 extension / WebGL 2.0)\n* [Shadow Sampler](https://shawn0326.github.io/zen-3d/examples/#light_softshadow). (WebGL 2.0)\n* Fragment Depth. (TODO)\n* Transform Feedback. (TODO)\n* Sampler Objects. (TODO)\n* [3D Texture](https://shawn0326.github.io/zen-3d/examples/#material_texture3d). (WebGL 2.0)\n* [Multisampled Renderbuffers](https://shawn0326.github.io/zen-3d/examples/#custompass_msaa). (WebGL 2.0)\n\n### Projects ###\n\n* [zen-viewer](https://shawn0326.github.io/zen-viewer/)\n\n### Change log ###\n\n[Releases](https://github.com/shawn0326/zen-3d/releases)\n\n\n[npm]: https://img.shields.io/npm/v/zen-3d\n[npm-url]: https://www.npmjs.com/package/zen-3d\n[build-size]: https://badgen.net/bundlephobia/minzip/zen-3d\n[build-size-url]: https://bundlephobia.com/result?p=zen-3d\n[npm-downloads]: https://img.shields.io/npm/dw/zen-3d\n[npmtrends-url]: https://www.npmtrends.com/zen-3d\n[license-badge]: https://img.shields.io/npm/l/zen-3d.svg\n[license-badge-url]: ./LICENSE\n[issues-badge]: https://img.shields.io/github/issues/shawn0326/zen-3d.svg\n[issues-badge-url]: https://github.com/shawn0326/zen-3d/issues\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshawn0326%2Fzen-3d","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshawn0326%2Fzen-3d","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshawn0326%2Fzen-3d/lists"}