Redimensionner Widgets Pro (Gantt)

Question

Je suis en train de mettre en œuvre un graphique pro widget (dans Jaspersoft Studio Professional 6.1), en particulier un diagramme de Gantt, qui répertorie en gros tous les projets en cours dans l'entreprise. Les données sont correctes et les graphiques fonctionnent comme prévu, mais je ne peux pas sembler trouver un moyen de redimensionner dynamiquement l'objet graphique en fonction du nombre de "projets", par exemple, maintenant j'ai 5 projets et le gantt semble bien avec w = 802px h = 183px. Mais si j'ai 10 projets, le composant ne se redimensionne pas, ce qui signifie qu'il ne "grandit" pas en hauteur pour s'adapter aux nouveaux projets qui mènent à un tableau illisible.

Est-il possible de redimensionner automatiquement le composant en fonction du nombre de projets que je vais afficher, potentiellement croissant vers une autre page du rapport?

Quelles étapes, classes, etc. dois-je mettre en œuvre pour que cela fonctionne correctement? Il n'y a pas d'option de classe de personnalisation pour ce composant.

Est-ce possible?

Merci pour l'aide :)

Answer 1

@Synamoon! Ce que j'ai compris de votre déclaration de problème que votre diagramme de Gantt devient maladroit quand il y a une grande quantité de données. La taille du tableau est fixe et il ne redimensionne pas lui-même en fonction de son contenu de données, mais cependant, la taille du diagramme peut être modifié en utilisant l'API -

yourChartObj.resizeTo(width, height); 

Mais dans votre cas, je vous suggère d'utiliser la fonction de défilement de Gantt tableau de FusionCharts qui va résoudre votre problème.

Voici un exemple de diagramme de Gantt ayant fonction de défilement -

FusionCharts.ready(function() { 
 
    var smoPlan = new FusionCharts({ 
 
     type: 'gantt', 
 
     renderAt: 'chart-container', 
 
     width: '650', 
 
     height: '300', 
 
     dataFormat: 'json', 
 
     dataSource: { 
 
      "chart": { 
 
       "dateformat": "mm/dd/yyyy", 
 
       "caption": "Project Gantt", 
 
       "subcaption": "From 1st Feb 2007 - 31st Aug 2007", 
 
       "ganttpaneduration": "3", 
 
       "ganttpanedurationunit": "m", 
 
       "showborder": "0" 
 
      }, 
 
      "categories": [ 
 
       { 
 
        "category": [ 
 
         { 
 
          "start": "02/01/2007", 
 
          "end": "04/01/2007", 
 
          "label": "Q1" 
 
         }, 
 
         { 
 
          "start": "04/01/2007", 
 
          "end": "07/01/2007", 
 
          "label": "Q2" 
 
         }, 
 
         { 
 
          "start": "07/01/2007", 
 
          "end": "09/01/2007", 
 
          "label": "Q3" 
 
         } 
 
        ] 
 
       }, 
 
       { 
 
        "category": [ 
 
         { 
 
          "start": "02/01/2007", 
 
          "end": "03/01/2007", 
 
          "label": "Feb" 
 
         }, 
 
         { 
 
          "start": "03/01/2007", 
 
          "end": "04/01/2007", 
 
          "label": "Mar" 
 
         }, 
 
         { 
 
          "start": "04/01/2007", 
 
          "end": "05/01/2007", 
 
          "label": "Apr" 
 
         }, 
 
         { 
 
          "start": "05/01/2007", 
 
          "end": "06/01/2007", 
 
          "label": "May" 
 
         }, 
 
         { 
 
          "start": "06/01/2007", 
 
          "end": "07/01/2007", 
 
          "label": "Jun" 
 
         }, 
 
         { 
 
          "start": "07/01/2007", 
 
          "end": "08/01/2007", 
 
          "label": "Jul" 
 
         }, 
 
         { 
 
          "start": "08/01/2007", 
 
          "end": "09/01/2007", 
 
          "label": "Aug" 
 
         } 
 
        ] 
 
       } 
 
      ], 
 
      "processes": { 
 
       "fontsize": "12", 
 
       "isbold": "1", 
 
       "align": "right", 
 
       "headertext": "What to do?", 
 
       "headerfontsize": "18", 
 
       "headervalign": "bottom", 
 
       "headeralign": "right", 
 
       "process": [ 
 
        { 
 
         "label": "Identify Customers" 
 
        }, 
 
        { 
 
         "label": "Survey 50 Customers" 
 
        }, 
 
        { 
 
         "label": "Interpret Requirements" 
 
        }, 
 
        { 
 
         "label": "Study Competition" 
 
        }, 
 
        { 
 
         "label": "Documentation of features" 
 
        }, 
 
        { 
 
         "label": "Brainstorm concepts" 
 
        }, 
 
        { 
 
         "label": "Design & Code" 
 
        }, 
 
        { 
 
         "label": "Testing/QA" 
 
        }, 
 
        { 
 
         "label": "Documentation of product" 
 
        }, 
 
        { 
 
         "label": "Global Release" 
 
        } 
 
       ] 
 
      }, 
 
      "datatable": { 
 
       "headervalign": "bottom", 
 
       "datacolumn": [ 
 
        { 
 
         "headertext": "Who does?", 
 
         "headerfontsize": "18", 
 
         "headervalign": "bottom", 
 
         "headeralign": "right", 
 
         "align": "left", 
 
         "fontsize": "12", 
 
         "text": [ 
 
          { 
 
           "label": "John" 
 
          }, 
 
          { 
 
           "label": "David" 
 
          }, 
 
          { 
 
           "label": "Mary" 
 
          }, 
 
          { 
 
           "label": "Andrew" 
 
          }, 
 
          { 
 
           "label": "Tiger" 
 
          }, 
 
          { 
 
           "label": "Sharon" 
 
          }, 
 
          { 
 
           "label": "Neil" 
 
          }, 
 
          { 
 
           "label": "Harry" 
 
          }, 
 
          { 
 
           "label": "Chris" 
 
          }, 
 
          { 
 
           "label": "Richard" 
 
          } 
 
         ] 
 
        } 
 
       ] 
 
      }, 
 
      "tasks": { 
 
       "task": [ 
 
        { 
 
         "start": "02/04/2007", 
 
         "end": "02/10/2007" 
 
        }, 
 
        { 
 
         "start": "02/08/2007", 
 
         "end": "02/19/2007" 
 
        }, 
 
        { 
 
         "start": "02/19/2007", 
 
         "end": "03/02/2007" 
 
        }, 
 
        { 
 
         "start": "02/24/2007", 
 
         "end": "03/02/2007" 
 
        }, 
 
        { 
 
         "start": "03/02/2007", 
 
         "end": "03/21/2007" 
 
        }, 
 
        { 
 
         "start": "03/21/2007", 
 
         "end": "04/06/2007" 
 
        }, 
 
        { 
 
         "start": "04/06/2007", 
 
         "end": "07/21/2007" 
 
        }, 
 
        { 
 
         "start": "07/21/2007", 
 
         "end": "08/19/2007" 
 
        }, 
 
        { 
 
         "start": "07/28/2007", 
 
         "end": "08/24/2007" 
 
        }, 
 
        { 
 
         "start": "08/24/2007", 
 
         "end": "08/27/2007" 
 
        } 
 
       ] 
 
      } 
 
     } 
 
    }).render(); 
 
});

<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script> 
 
<div id="chart-container">FusionCharts will render here</div>

Vous pouvez explorer plus sur les attributs de diagramme de Gantt et les paramètres de here et diverses implémentations de diagramme de Gantt de here.

S'il vous plaît laissez-moi savoir si vous avez d'autres préoccupations.

Merci!