Quiero crear un diagrama de Gantt D3 Js por primera vez. Encontré un ejemplo bastante bueno que se ajusta a mis expectativas https://dk8996.github.io/Gantt-Chart/ (Example2). Pero tengo problemas para cambiar el tamaño del svg. Quiero encajar el ejemplo en mi contenedor d3 que tiene una altura y un ancho fijos. Los botones del ejemplo solo se pueden copiar/pegar en mi código. Pero el SVG siempre se genera en la parte inferior de mi código/sitio.
<div class="Card-body"> <div id="d3-container"> //HERE </div> </div>Intenté algunas cosas, pero no sé cómo hacer esto. El ejemplo siempre ocupa toda la pantalla. ¿Cómo puedo hacer esto?
El SVG de su biblioteca de diagramas de Gantt siempre se agrega al elemento del cuerpo del documento. Si desea cambiar eso, deberá reemplazar la línea 16 y dos líneas adicionales (22 y 23) en el archivo https://github.com/dk8996/Gantt-Chart/blob/master/gantt-chart-d3.js - por ejemplo, descárguelo a su computadora y consúltelo desde su archivo index.html localmente, no desde la URL de la biblioteca Gannt-Chart, para
var selector = '#d3-container'; ... var height = document.getElementById("d3-container").clientHeight - margin.top - margin.bottom-5; var width = document.getElementById("d3-container").clientWidth - margin.right - margin.left-5;para que luego se cree SVG en su contenedor DIV.