{"id":16960868,"url":"https://github.com/carleslc/gantt","last_synced_at":"2025-04-11T22:11:16.470Z","repository":{"id":40279085,"uuid":"114201510","full_name":"Carleslc/Gantt","owner":"Carleslc","description":"Online Gantt Chart for a better planning.","archived":false,"fork":false,"pushed_at":"2019-11-09T13:40:18.000Z","size":3082,"stargazers_count":25,"open_issues_count":0,"forks_count":11,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-03-25T18:09:50.367Z","etag":null,"topics":["free","gantt","gantt-chart","gantt-diagram","project-management","tool"],"latest_commit_sha":null,"homepage":"https://carleslc.me/Gantt","language":"CSS","has_issues":true,"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/Carleslc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"ko_fi":"carleslc"}},"created_at":"2017-12-14T04:13:39.000Z","updated_at":"2025-03-20T13:22:35.000Z","dependencies_parsed_at":"2022-07-29T20:39:55.179Z","dependency_job_id":null,"html_url":"https://github.com/Carleslc/Gantt","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/Carleslc%2FGantt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Carleslc%2FGantt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Carleslc%2FGantt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Carleslc%2FGantt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Carleslc","download_url":"https://codeload.github.com/Carleslc/Gantt/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248487695,"owners_count":21112191,"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":["free","gantt","gantt-chart","gantt-diagram","project-management","tool"],"created_at":"2024-10-13T22:50:24.744Z","updated_at":"2025-04-11T22:11:16.446Z","avatar_url":"https://github.com/Carleslc.png","language":"CSS","funding_links":["https://ko-fi.com/carleslc"],"categories":[],"sub_categories":[],"readme":"# Gantt\n_Online Gantt Chart for a better planning._\n\n[![ko-fi](https://www.ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/carleslc)\n\nUsing [dhtmlxGantt](https://dhtmlx.com/docs/products/dhtmlxGantt/) library. Free support for milestones.\n\nExport to *PDF*, *PNG*, *Excel*, *iCal* and save as *JSON* to load and edit in the future.\n\nCollaborators are welcome via pull-request.\n\n## ¿Qué es un diagrama de Gantt?\n\nEl *diagrama de Gantt* es un esquema visual en el que podemos observar de forma general las etapas de un proyecto y la duración de cada etapa, útil para planificar y prever cuando se tiene previsto terminar el proyecto o una parte de este, y para observar el progreso en un momento determinado.\n\n## ¿Qué herramientas podemos usar?\n\nPara *prototipado* rápido y para diagramas sencillos podemos usar esta herramienta. Más abajo se detalla un ejemplo de uso.\n\nOtra opción es usar una hoja de **Excel** o **Google Spreadsheets** usando una tabla y un gráfico de barras. Para diagramas con más complejidad o para hacer seguimiento de tareas es preferible utilizar herramientas más avanzadas. Algunas herramientas específicas para este tipo de diagramas son **GanttProjct**, **Gantter** o **Microsoft Project**. Algunos servicios como **Asana**, **Trello** o **Coda** proporcionan sus propios calendarios que relacionan las tareas con su representación en calendario o como diagrama de Gantt, lo que permite tener una mayor trazabilidad.\n\n## Creando un diagrama sencillo\n\nSi no necesitamos trazabilidad de tareas y solo queremos hacer un diagrama sencillo podemos usar la página [https://carleslc.me/Gantt/](https://carleslc.me/Gantt/), con el que obtendremos un resultado como el que se muestra a continuación.\n\n![Haz click [aquí](https://github.com/Carleslc/Gantt/blob/master/images/resultado.png?raw=true) para visualizarlo mejor](images/resultado.png)\n\nCuando accedemos a la página nos encontramos con nuestro espacio de trabajo, con diferentes opciones para poder crear nuestro diagrama:\n\n![](images/espacio_trabajo.png)\n\nPara añadir una **tarea** pulsaremos en el \"**+**\" de la parte izquierda de la página, donde se mostrará el *árbol de tareas y proyectos* con sus fechas de inicio y duraciones.\n\n![](images/plus.png)\n\nCuando pulsamos en el \"+\" nos aparece una ventana para rellenar la información de nuestra tarea.\n\n![](images/task.png)\n\nAñadimos una pequeña descripción como **título** (Description) de la tarea y le damos a guardar (Save). Las **fechas** de inicio y final las podemos especificar ahora o más tarde, *estirando* la tarea arrastrando desde sus laterales.\n\nAquí consideraremos un **proyecto** como un conjunto de tareas, y se muestra en el diagrama de color verde. Sirven para mejorar la visualización de etapas más generales. Las tareas se muestran en color azul. Podemos crear un proyecto añadiendo subtareas, como se muestra en el gráfico siguiente.\n\n![](images/project.png)\n\nPuedes **editar** una tarea haciendo *doble click* sobre ella.\n\nSi quieres, puedes especificar **dependencias** usando flechas, mediante los círculos a los laterales de las tareas.\n\n![](images/dependencias.png)\n\nPuedes definir *milestones* a la hora de crear una tarea. Esto son **objetivos**, y se muestran en morado.\n\n![](images/milestone.png)\n\nPuedes modificar el **zoom** del diagrama para verlo de forma más global. Hay tres niveles de zoom: semanal, mensual y anual. Así queda el diagrama en visualización anual:\n\n![](images/zoom.png)\n\nLa opción *\"Show Today\"* te permite señalar dónde nos encontramos actualmente.\n\nA la hora de añadir tareas puedes usar la opción *\"Preference\" Consecutive / Parallel*, para añadirlas después de la anterior o debajo de forma solapada. Las funciones *Indent / Outdent* son para añadir tareas existentes a proyectos o para sacarlas de un proyecto. Puedes mover tareas desde el árbol de tareas y también puedes **seleccionar** más de una tarea a la vez manteniendo pulsado *Shift* o *Control*.\n\nLas opciones \"Expand Task/Project Titles\" sirven para añadir el título de la tarea o proyecto al lado, para verse incluso si por el zoom o la duración de la tarea el título queda cortado.\n\nEn la siguiente imagen hemos marcado la opción \"Expand Task Titles\".\n\n![](images/expand.png)\n\nTambién puedes cambiar el **estilo** del diagrama.\n\n![](images/style.png)\n\nCuando hayas terminado, puedes **exportar** el diagrama en varios formatos (PNG, PDF, Excel o iCal). El formato **iCal** sirve para añadirlo a un calendario existente como el de Google Calendar.\n\n![](images/export.png)\n\nPara poder **guardar** el diagrama y **editarlo más tarde** utiliza la opción \"**Save**\" arriba de la página y luego haz click en \"**Download**\". Esto descargará un documento en formato JSON que podrás cargar usando la opción \"Load\" cuando vuelvas más tarde a esta página.\n\n![](images/save.png)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcarleslc%2Fgantt","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcarleslc%2Fgantt","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcarleslc%2Fgantt/lists"}