{"id":15814092,"url":"https://github.com/jkutianski/d3-clone","last_synced_at":"2025-05-07T08:09:46.125Z","repository":{"id":28345918,"uuid":"118077172","full_name":"jkutianski/d3-clone","owner":"jkutianski","description":"D3js plugin for clone nodes from selections.","archived":false,"fork":false,"pushed_at":"2024-09-24T10:44:54.000Z","size":270,"stargazers_count":2,"open_issues_count":8,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-05-07T08:09:34.599Z","etag":null,"topics":["clone","d3-module","d3js","node","node-js","node-module","nodejs"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jkutianski.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,"publiccode":null,"codemeta":null}},"created_at":"2018-01-19T04:29:59.000Z","updated_at":"2022-11-23T08:06:32.000Z","dependencies_parsed_at":"2023-11-28T15:29:58.461Z","dependency_job_id":"bc890f88-8388-4637-81ba-c18c0a47caf9","html_url":"https://github.com/jkutianski/d3-clone","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkutianski%2Fd3-clone","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkutianski%2Fd3-clone/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkutianski%2Fd3-clone/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jkutianski%2Fd3-clone/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jkutianski","download_url":"https://codeload.github.com/jkutianski/d3-clone/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252839293,"owners_count":21812090,"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":["clone","d3-module","d3js","node","node-js","node-module","nodejs"],"created_at":"2024-10-05T04:22:27.838Z","updated_at":"2025-05-07T08:09:46.079Z","avatar_url":"https://github.com/jkutianski.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"d3-clone\n========\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/f424dd4911324201a86c9543e192c4e6)](https://www.codacy.com/app/jkutianski/d3-clone?utm_source=github.com\u0026amp;utm_medium=referral\u0026amp;utm_content=jkutianski/d3-clone\u0026amp;utm_campaign=Badge_Grade)\n\n[![dependencies Status](https://david-dm.org/jkutianski/d3-clone/status.svg)](https://david-dm.org/jkutianski/d3-clone)\n[![devDependencies Status](https://david-dm.org/jkutianski/d3-clone/dev-status.svg)](https://david-dm.org/jkutianski/d3-clone?type=dev)\n\n[![Known Vulnerabilities](https://snyk.io/test/github/jkutianski/d3-clone/badge.svg?targetFile=package.json)](https://snyk.io/test/github/jkutianski/d3-clone?targetFile=package.json)\n\nD3js plugin for clone nodes from selections.\n\nThe d3-clone add methods to append and insert a duplicate of the selection on which this method was called.\nThis methods copy all of its attributes and their values, including intrinsic (in–line) listeners. It does not copy the data of the original selection.\n\nYou can see the running [example](https://github.com/jkutianski/d3-clone/tree/master/examples) on this [link](https://cdn.rawgit.com/jkutianski/d3-clone/5f755227/examples/cityscape.html)\n\nInstall\n-------\nTo install via NPM use `npm install d3-clone`. You can also load directly from [unpkg.com](https://unpkg.com/d3-clone/build/d3-clone.min.js).\n\n```html\n\u003cscript src=\"https://unpkg.com/d3-clone/build/d3-clone.min.js\"\u003e\u003c/script\u003e\n```\n\nHow to use it\n-------------\n\n*Append clone*\n\n```selection.appendClone(source)```\n\nThis example append the node selected by `svg.select('#source')` to each node selected from `svg.selectAll('.node')`.\n\n```javascript\nvar nodes = svg.selectAll('.node')\n    .exit().remove()\n    .data(data).enter()\n    .appendClone(svg.select('#source'));\n```\nif you've start with this HTML structure\n```html\n\u003cdiv id=\"source\"\u003e\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n```\nafter run the code you'll have\n```html\n\u003cdiv id=\"source\"\u003e\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n  \u003cdiv id=\"source1\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n  \u003cdiv id=\"source2\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n  \u003cdiv id=\"source3\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n```\n\n*Insert clone*\n\n```selection.insertClone(source, before)```\n\nThis example insert the node selected by `svg.select('#source')` to each node selected from `svg.selectAll('.node')` before the `svg.select('#existing_node')`.\n\n```javascript\nvar nodes = svg.selectAll('.node')\n    .exit().remove()\n    .data(data).enter()\n    .insertClone(svg.select('#source'), svg.select('#existing_node'));\n```\nif you've start with this HTML structure\n```html\n\u003cdiv id=\"source\"\u003e\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n```\nafter run the code you'll have\n```html\n\u003cdiv id=\"source\"\u003e\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"source1\"\u003e\u003c/div\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"source2\"\u003e\u003c/div\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n\u003cdiv class=\"node\"\u003e\n  \u003cdiv id=\"source3\"\u003e\u003c/div\u003e\n  \u003cdiv id=\"existing_node\"\u003e\u003c/div\u003e\n\u003c/div\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjkutianski%2Fd3-clone","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjkutianski%2Fd3-clone","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjkutianski%2Fd3-clone/lists"}