{"id":26249478,"url":"https://github.com/randomgamingdev/zoomp5js","last_synced_at":"2025-12-29T03:03:06.296Z","repository":{"id":172274045,"uuid":"649081667","full_name":"RandomGamingDev/Zoomp5js","owner":"RandomGamingDev","description":"A simple library for adding the zooming functionality to your p5.js project.","archived":false,"fork":false,"pushed_at":"2024-04-19T14:07:06.000Z","size":153,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2024-04-19T15:27:48.852Z","etag":null,"topics":["easy","javascript","p5","p5js","simple","tiny","zoom","zoom-images"],"latest_commit_sha":null,"homepage":"","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/RandomGamingDev.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}},"created_at":"2023-06-03T18:03:09.000Z","updated_at":"2024-04-19T14:03:47.000Z","dependencies_parsed_at":null,"dependency_job_id":"a4c51a0d-fb43-4ce3-8a9d-68ce9dc28c26","html_url":"https://github.com/RandomGamingDev/Zoomp5js","commit_stats":null,"previous_names":["randomgamingdev/zoomp5js"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RandomGamingDev%2FZoomp5js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RandomGamingDev%2FZoomp5js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RandomGamingDev%2FZoomp5js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RandomGamingDev%2FZoomp5js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/RandomGamingDev","download_url":"https://codeload.github.com/RandomGamingDev/Zoomp5js/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243436364,"owners_count":20290779,"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":["easy","javascript","p5","p5js","simple","tiny","zoom","zoom-images"],"created_at":"2025-03-13T15:37:56.005Z","updated_at":"2025-12-29T03:03:01.266Z","avatar_url":"https://github.com/RandomGamingDev.png","language":"JavaScript","readme":"# Zoomp5js\nA simple library for adding the zooming functionality to your p5.js project.\n\n\u003cimg src=\"Zoomp5js.png\" width=\"512\" /\u003e\n\nSimply create a new instance of the `Zoom` class and then apply zoom based on the location you want to zoom towards and its zoom level with the `.zoom` function. In order to apply the effects simply use `.apply`, but remember, that it will zoom using math that's heavily based upon the location of (0, 0), so unless you're going for it (no clue why you'd be doing that) I recommend that you translate it so that (0, 0) is in the center of the screen when apply the effects, or if you're in WebGL mode where that's the default, to leave it that way.\n\nExample of how to use `.zoom`:\n```js\nfunction mouseWheel(event) {\n  zoom.zoom(Vec.fromList([width, height]).divNum(2).subVec(Vec.fromList([mouseX, mouseY])), event.delta / 1000);\n}\n```\n\nAn example of how to use it is accessible at https://github.com/RandomGamingDev/Zoomp5js/tree/main/example and its result can be seen [here](https://randomgamingdev.github.io/Zoomp5js/example)\n\nThis library depends on the Vector implementation from https://github.com/RandomGamingDev/VecJs. To use it you can simply include https://cdn.jsdelivr.net/gh/RandomGamingDev/VecJs/vec.js in your HTML file! If you want to you can also just download the file and include it in your HTML file that way.\n\nTo use this library you can simply include https://cdn.jsdelivr.net/gh/RandomGamingDev/Zoomp5js/zoom.js in your HTML file! If you want to you can also just download the file and include it in your HTML file that way.\n\nbtw stuff updates so remember to specify a version/commit for your library if you want to use a link and don't want your code to automatically update to the newest version of the library\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frandomgamingdev%2Fzoomp5js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frandomgamingdev%2Fzoomp5js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frandomgamingdev%2Fzoomp5js/lists"}