Available only in PRO Edition

Meilensteine

Meilensteine sind Aufgaben ohne Dauer, die verwendet werden, um wichtige Termine, Ereignisse oder Ziele in einem Projekt hervorzuheben. Sie können nützlich sein, um Besprechungen zur Überprüfung oder den erwarteten Abschluss von Projektphasen zu markieren.

Technisch gesehen ist ein Meilenstein eine der vordefinierten Aufgabentypen. Er funktioniert jedoch genau wie eine reguläre Aufgabe, indem er die gleichen Ereignisse und Vorlagen auslöst.

Related sample:  Projects and milestones

Um Meilensteine in einem Diagramm zu aktivieren, führen Sie die folgenden Schritte aus:

1. Fügen Sie dem Lightbox eine Sektion hinzu - Typeselect-Steuerelement - die es den Benutzern ermöglicht, Aufgabentypen zu ändern und Meilensteine auszuwählen.
   
   

   gantt.config.lightbox.sections = [
       {name: "description", height: 70, map_to: "text", type: "textarea"},
       {name: "type", type: "typeselect", map_to: "type"},
       {name: "time", height: 72, type: "duration", map_to: "auto"}
   ];

2. Richten Sie die rightside_text oder leftside_text Vorlage ein, um ein Label für Meilensteine anzuzeigen. Beachten Sie, dass Labels aus der task_text Vorlage nicht erscheinen, da Meilensteine keine Dauer haben.
   
   

   gantt.templates.rightside_text = function(start, end, task){
       if(task.type == gantt.config.types.milestone){
           return task.text;
       }
       return "";
   };

3. Schalten Sie die order_branch Eigenschaft ein, um es den Benutzern zu erleichtern. Dies ermöglicht das Ziehen von Aufgaben innerhalb des übergeordneten Zweigs, sodass Benutzer Meilensteine überall erstellen und dann bei Bedarf neu positionieren können.
   
   

   gantt.config.order_branch = true;

Sobald diese Schritte abgeschlossen sind, ist Ihr Gantt-Diagramm bereit, mit Meilensteinen umzugehen.

Related sample:  Projects and milestones

Um Meilensteine in Ihren Datensatz aufzunehmen, weisen Sie der type Eigenschaft eines Datenobjekts den Wert 'milestone' zu (Werte werden im types Objekt gespeichert):

var data = {
    tasks:[
        {id:1, text:"Project #1",    type:gantt.config.types.project,    open:true}, 
        {id:2, text:"Task #1",       start_date:"12-04-2020", duration:3, parent:1},
        {id:3, text:"Alpha release", type:gantt.config.types.milestone,   parent:1,             start_date:"14-04-2020"}],                                                  links:[]
};

Seit v7.1 können Sie Aufgaben und Meilensteine in ihren übergeordneten Projekten anzeigen. Um dies zu aktivieren, setzen Sie die rollup Eigenschaft eines Datenobjekts auf true:

var data = {
    tasks:[
        {id:11, text:"Project #1", type:"project", progress: 0.6, open: true},
        {id:12, text:"Task #1", start_date:"03-04-2018", duration:"3",
            parent:"11", progress: 1, open: true},
        {id:13, text:"Task #2", start_date:"03-04-2018", type:"project", 
            parent:"11", progress: 0.5, open: true},
        {id:16, text:"Final milestone", start_date:"08-04-2018", type:"milestone",              rollup: true, parent:"11", progress: 0, open: true},          {id:17, text:"Task #2.1", start_date:"03-04-2018", duration:"2", 
            parent:"13", progress: 1, open: true},
        {id:18, text:"Task #2.2", start_date:"06-04-2018", duration:"1",   
            parent:"13", progress: 0.8}],  
    links:[]
};

So sieht es aus:

Sie können die Rollup-Funktion auch über das Rollup-Kontrollkästchen im Lightbox umschalten:

gantt.config.lightbox.milestone_sections = [
    {name: "description", height: 70, map_to: "text", type: "textarea", focus: true},
    {name: "rollup", type: "checkbox", map_to: "rollup"},    {name: "hide_bar", type: "checkbox", map_to: "hide_bar"},
    {name: "type", type: "typeselect", map_to: "type"},
    {name: "time", type: "duration", map_to: "auto"}
];

Related sample:  Rollup tasks and milestones

Ab v7.1 können Sie Aufgabenleisten und Meilensteine in der Zeitleiste ausblenden, indem Sie hide_bar: true für ein Datenobjekt setzen:

var data = {
    tasks:[
        {id:11, text:"Project #1", type:"project", progress: 0.6, open: true},
        {id:12, text:"Task #1", start_date:"03-04-2018", duration:"3",
            parent:"11", progress: 1},
        {id:13, text:"Task #2", start_date:"03-04-2018", type:"project", 
            parent:"11", progress: 0.5, open: true},
        {id:16, text:"Final milestone", start_date:"08-04-2018", type:"milestone",              rollup: true, hide_bar: true, parent:"11", progress: 0},          {id:17, text:"Task #2.1", start_date:"03-04-2018", duration:"2", 
            parent:"13", progress: 1},
        {id:18, text:"Task #2.2", start_date:"06-04-2018", duration:"1",   
            parent:"13", progress: 0.8}],  
    links:[]
};

Das Ergebnis wird so aussehen:

Hinweis, wenn sowohl hide_bar:true als auch rollup:true für ein Element gesetzt sind, wird es in der Zeitleiste ausgeblendet, aber im übergeordneten Projekt sichtbar.

{ id:11, text:"Project #1", type:"project", rollup:false, open: true }

Sie können auch bestimmte Aufgaben/Meilensteine in der Zeitleiste ausblenden, indem Sie das Hide bar-Kontrollkästchen im Lightbox verwenden:

gantt.config.lightbox.sections = [
    {name: "description", height: 70, map_to: "text", type: "textarea", focus: true},
    {name: "rollup", type: "checkbox", map_to: "rollup"},
    {name: "hide_bar", type: "checkbox", map_to: "hide_bar"},      {name: "type", type: "typeselect", map_to: "type"},
    {name: "time", type: "duration", map_to: "auto"}
];
 
gantt.config.lightbox.milestone_sections = [
    {name: "description", height: 70, map_to: "text", type: "textarea", focus: true},
    {name: "rollup", type: "checkbox", map_to: "rollup"},
    {name: "hide_bar", type: "checkbox", map_to: "hide_bar"},      {name: "type", type: "typeselect", map_to: "type"},
    {name: "time", type: "duration", map_to: "auto"}
];
 
gantt.config.lightbox.project_sections = [
    {name: "description", height: 70, map_to: "text", type: "textarea", focus: true},
    {name: "hide_bar", type: "checkbox", map_to: "hide_bar"},      {name: "type", type: "typeselect", map_to: "type"},
    {name: "time", type: "duration", map_to: "auto"}
];

Related sample:  Rollup tasks and milestones

Sie können die Sichtbarkeit von Rollup-Aufgaben in übergeordneten Projekten mit diesem Ereignis verwalten:

• onBeforeRollupTaskDisplay

// bevor die Rollup-Aufgabe in ihrem übergeordneten Projekt angezeigt wird 
gantt.attachEvent("onBeforeRollupTaskDisplay", function(taskId, task, parentId){
    // jede benutzerdefinierte Logik hier
    return false;
});

Ab v8.0 enthalten Rollup-Elemente die task.$rendered_at Eigenschaft, die die Zeile angibt, in der das Rollup-Element angezeigt wird. Sie können die task_class Vorlage verwenden, um Rollup-Elemente basierend auf ihrer Zeile zu stylen:

gantt.templates.task_class = function(start, end, task) {
    if(task.$rendered_at) {
        if(gantt.calculateTaskLevel(gantt.getTask(task.$rendered_at)) === 1) {
            return "phase-level-rollup";
        }
    }
    return "";
};