{"id":20179469,"url":"https://github.com/radiium/polydiv","last_synced_at":"2026-05-19T07:31:06.173Z","repository":{"id":106501353,"uuid":"156756155","full_name":"radiium/polydiv","owner":"radiium","description":"Clipping html element in random polygon","archived":false,"fork":false,"pushed_at":"2019-05-25T15:56:22.000Z","size":37,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-10-18T19:47:36.535Z","etag":null,"topics":["clip-path","convex-hull","css","javascript","polygon"],"latest_commit_sha":null,"homepage":"https://radiium.github.io/polydiv/","language":"JavaScript","has_issues":false,"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/radiium.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":"2018-11-08T19:12:25.000Z","updated_at":"2023-07-20T18:32:58.000Z","dependencies_parsed_at":null,"dependency_job_id":"11eb95e5-4e62-426d-b8c9-3cba77083160","html_url":"https://github.com/radiium/polydiv","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/radiium/polydiv","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/radiium%2Fpolydiv","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/radiium%2Fpolydiv/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/radiium%2Fpolydiv/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/radiium%2Fpolydiv/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/radiium","download_url":"https://codeload.github.com/radiium/polydiv/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/radiium%2Fpolydiv/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33206276,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-19T07:16:55.748Z","status":"ssl_error","status_checked_at":"2026-05-19T07:16:54.366Z","response_time":58,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["clip-path","convex-hull","css","javascript","polygon"],"created_at":"2024-11-14T02:26:48.668Z","updated_at":"2026-05-19T07:31:06.148Z","avatar_url":"https://github.com/radiium.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Polydiv  \n\n### Clipping html element in random polygon with the css '[clip-path](https://developer.mozilla.org/fr/docs/Web/CSS/clip-path)' rule.\n\n\n## how it works:  \nThis module generate random number of random 2d coordinate,  \nfinding and keeping convex hull (Algorithm found [here](https://www.nayuki.io/page/convex-hull-algorithm))  \nthen use it for add css \"clip-path\" rules  \n\u003cimg src=\"https://raw.githubusercontent.com/radiium/polydiv/master/site/convex-hull.png\" alt=\"Convex hull \" height=\"100\"\u003e\n\n\n## Demo:\n\n[https://radiium.github.io/polydiv/](https://radiium.github.io/polydiv/)\n\n\n## Download:  \n\n[polydiv.js](https://raw.githubusercontent.com/radiium/polydiv/master/polydiv.js)  \n[polydiv.min.js](https://raw.githubusercontent.com/radiium/polydiv/master/polydiv.min.js)  \n\n\n## Usage:\n\n1 - In html\n```html\n\u003c!-- Create structure --\u003e\n\u003cdiv\u003e\n    \u003cdiv class=\"item\"\u003e1\u003c/div\u003e\n    \u003cdiv class=\"item\"\u003e2\u003c/div\u003e\n    \u003cdiv class=\"item\"\u003e3\u003c/div\u003e\n    ...\n\u003c/div\u003e\n\n\u003c!-- Import Polydiv --\u003e\n\u003cscript type=\"text/javascript\" src=\"./polydiv.min.js\"\u003e\u003c/script\u003e\n```\n\n\n2 - In javascript\n```javascript\n// Init Polydiv\nvar polydivInstance = new Polydiv({ query: '.item'}, function(err) {\n    // Polydiv init done\n});\n\n// Clip items \npolydivInstance.clipItems(function(err) {\n    // All items are clipped\n});\n\n// Unclip items\npolydivInstance.unClipItems(function(err) {\n    // All items are unclipped\n});\n\n// Destroy Polydiv\npolydivInstance.destroy(function(err) {\n    // Polydiv destroy done\n});\n```\n\n\n## Development:\n\n```bash\n# Install deps\nnpm install\n\n# Uglify and minify\nnpm run dist\n```\n\n\n## References: \n- css 'clip-path' rule [developer.mozilla.org/fr/docs/Web/CSS/clip-path](https://developer.mozilla.org/fr/docs/Web/CSS/clip-path)  \n- Convex hull algorithm [nayuki.io/page/convex-hull-algorithm](https://www.nayuki.io/page/convex-hull-algorithm)  \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fradiium%2Fpolydiv","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fradiium%2Fpolydiv","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fradiium%2Fpolydiv/lists"}