{"id":19365185,"url":"https://github.com/jorgeatgu/d3-bundle","last_synced_at":"2026-06-13T03:34:14.358Z","repository":{"id":69302093,"uuid":"162475723","full_name":"jorgeatgu/d3-bundle","owner":"jorgeatgu","description":"Importando solo los módulos necesarios de d3","archived":false,"fork":false,"pushed_at":"2018-12-19T22:38:07.000Z","size":211,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-11-18T03:03:24.435Z","etag":null,"topics":["d3js","d3v4","data-visualization"],"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/jorgeatgu.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-12-19T18:27:39.000Z","updated_at":"2019-06-10T08:47:32.000Z","dependencies_parsed_at":null,"dependency_job_id":"1ee326c9-a203-4424-bb1f-27fce1dea502","html_url":"https://github.com/jorgeatgu/d3-bundle","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/jorgeatgu/d3-bundle","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jorgeatgu%2Fd3-bundle","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jorgeatgu%2Fd3-bundle/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jorgeatgu%2Fd3-bundle/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jorgeatgu%2Fd3-bundle/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jorgeatgu","download_url":"https://codeload.github.com/jorgeatgu/d3-bundle/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jorgeatgu%2Fd3-bundle/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34271500,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-13T02:00:06.617Z","response_time":62,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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":["d3js","d3v4","data-visualization"],"created_at":"2024-11-10T07:39:22.316Z","updated_at":"2026-06-13T03:34:14.335Z","avatar_url":"https://github.com/jorgeatgu.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# d3 bundle\n\nLa v4.0 de d3.js modularizo todo el código. Así que aprovechando el sistema de modulos de ES2015 podemos generar un bundle que solamente contenga los módulos que vamos a utilizar. \n\nPara crear el bundle necesitamos rollup. Una vez creado usamos uglify para minificar el código.\n\nLa configuración para rollup, en entry le indicamos el archivo que contendra todos los módulos que queremos incluir en el bundle. En dest la ruta donde generar el bundle.\n\nAsí quedaría el archivo `rollup.config.js`\n\n```\nimport node from \"rollup-plugin-node-resolve\";\n\nexport default {\n  entry: \"index.js\",\n  format: \"umd\",\n  moduleName: \"d3\",\n  plugins: [node()],\n  dest: \"d3.js\"\n};\n```\n\nEl index.js con los módulos que necesitamos\n\n```\nexport {\n    select,\n    selectAll\n} from \"d3-selection\";\n\nexport {\n    area\n} from \"d3-shape\";\n\nexport {\n    scaleTime,\n    scaleLinear\n} from \"d3-scale\";\n\nexport {\n    axisBottom,\n    axisLeft\n} from \"d3-axis\";\n\nexport {\n    csv\n} from \"d3-request\";\n\nexport {\n    easeLinear\n} from \"d3-ease\";\n\nexport {\n    format\n} from \"d3-format\";\n\nimport \"d3-transition\";\n```\n\nTodos estos módulos los tenemos que instalar como paquetes de npm.\n\nAhora lanzaremos con npm el ```build:d3``` que primero creara un bundle y a continuación uglify se encargara de minificar el código y servirlo en la carpeta de js.\n\n```\n\"build:d3\": \"rollup -c \u0026\u0026 uglifyjs d3.js -c -m -o js/d3.min.js\"\n```\n\nEl bundle para hacer la gráfica de area ocupa 84kb. El tamaño de la v4.11.0 de d3 es de 220kb. La diferencia es bastante notable.\n\n## Modulos\n\nA continuación todos los módulos de d3. \n\n[d3-array](https://github.com/d3/d3-array)   \n[d3-axis](https://github.com/d3/d3-axis)   \n[d3-brush](https://github.com/d3/d3-brush)   \n[d3-chord](https://github.com/d3/d3-chord)   \nd3-collection \u003e Deprecation notice   \n[d3-color](https://github.com/d3/d3-color)   \n[d3-dispatch](https://github.com/d3/d3-color)   \n[d3-drag](https://github.com/d3/d3-drag)   \n[d3-dsv](https://github.com/d3/d3-dsv)   \n[d3-ease](https://github.com/d3/d3-ease)   \n[d3-force](https://github.com/d3/d3-force)   \n[d3-format](https://github.com/d3/d3-format)   \n[d3-geo](https://github.com/d3/d3-geo)   \n[d3-hierarchy](https://github.com/d3/d3-hierarchy)   \n[d3-interpolate](https://github.com/d3/d3-interpolate)   \n[d3-path](https://github.com/d3/d3-path)   \n[d3-polygon](https://github.com/d3/d3-polygon)   \n[d3-quadtree](https://github.com/d3/d3-quadtree)   \n[d3-queue](https://github.com/d3/d3-queue)   \n[d3-random](https://github.com/d3/d3-random)   \n[d3-request](https://github.com/d3/d3-request)   \n[d3-scale](https://github.com/d3/d3-scale)   \n[d3-selection](https://github.com/d3/d3-selection)   \n[d3-shape](https://github.com/d3/d3-shape)   \n[d3-time](https://github.com/d3/d3-time)   \n[d3-time-format](https://github.com/d3/d3-time-format)   \n[d3-timer](https://github.com/d3/d3-timer)   \n[d3-transition](https://github.com/d3/d3-transition)   \n[d3-voronoi](https://github.com/d3/d3-voronoi)   \n[d3-zoom](https://github.com/d3/d3-zoom)   \n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjorgeatgu%2Fd3-bundle","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjorgeatgu%2Fd3-bundle","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjorgeatgu%2Fd3-bundle/lists"}