Auf einen Blick

TsgcHTMLComponent_Gantt

Fügen Sie Aufgaben mit Start- und Enddatum und einem Fortschrittsprozentsatz hinzu, setzen Sie eine Überschrift und lesen Sie dann die HTML-Eigenschaft — die Komponente skaliert jeden Balken über den gesamten Projektzeitraum.

Komponentenklasse

TsgcHTMLComponent_Gantt

Rendert

Bootstrap-5-Karte mit Aufgabenbalken + scoped CSS

Familie

Daten & Tabellen

Sprachen

Delphi, C++ Builder, .NET

QuickStart

Aufgaben hinzufügen, Fortschritt setzen, rendern

Setzen Sie einen Title, rufen Sie AddTask für jeden Arbeitsposten mit dessen Daten, Fortschritt und Farbe auf und lesen Sie dann HTML.

uses
  sgcHTML_Enums, sgcHTML_Component_Gantt;

var
  oGantt: TsgcHTMLComponent_Gantt;
begin
  oGantt := TsgcHTMLComponent_Gantt.Create(nil);
  try
    oGantt.Title := 'Release Plan';

    oGantt.AddTask('Design', EncodeDate(2026, 6, 1),
      EncodeDate(2026, 6, 7), 100, hcPrimary, 'Ana');
    oGantt.AddTask('Build', EncodeDate(2026, 6, 8),
      EncodeDate(2026, 6, 20), 45, hcSuccess, 'Tom');

    WebModule.Response := oGantt.HTML;   // card + task bars + CSS
  finally
    oGantt.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Gantt.hpp

TsgcHTMLComponent_Gantt *oGantt = new TsgcHTMLComponent_Gantt(NULL);
try
{
  oGantt->Title = "Release Plan";

  oGantt->AddTask("Design", EncodeDate(2026, 6, 1),
    EncodeDate(2026, 6, 7), 100, hcPrimary, "Ana");
  oGantt->AddTask("Build", EncodeDate(2026, 6, 8),
    EncodeDate(2026, 6, 20), 45, hcSuccess, "Tom");

  String html = oGantt->HTML;   // card + task bars + CSS
}
__finally
{
  delete oGantt;
}

using esegece.sgcWebSockets;

var gantt = new TsgcHTMLComponent_Gantt();
gantt.Title = "Release Plan";

gantt.AddTask("Design", new DateTime(2026, 6, 1),
    new DateTime(2026, 6, 7), 100, TsgcHTMLColor.hcPrimary, "Ana");
gantt.AddTask("Build", new DateTime(2026, 6, 8),
    new DateTime(2026, 6, 20), 45, TsgcHTMLColor.hcSuccess, "Tom");

string html = gantt.HTML;   // card + task bars + CSS

Referenz

Wichtige Eigenschaften & Methoden

Die Member, die Sie am häufigsten verwenden.

Tasks

Tasks enthält Arbeitsposten mit Title, StartDate, EndDate, Progress, Enum-Color und Assignee.

Aufgaben hinzufügen

AddTask(aTitle, aStart, aEnd, aProgress, aColor, aAssignee) hängt in einem einzigen Aufruf einen Balken an.

Automatische Skalierung

Die Komponente ermittelt den frühesten Start und das späteste Ende über alle Aufgaben und positioniert jeden Balken proportional über diesem Zeitraum.

Fortschritt

Der Progress jeder Aufgabe (0–100) zeichnet eine durchscheinende Füllung über ihren Balken, sodass der Abschluss auf einen Blick sichtbar ist.

Überschrift

Title rendert eine fette Überschrift über dem Diagramm; lassen Sie sie leer, um die Überschriftenzeile wegzulassen.

Ausgabe

GanttID identifiziert die Karte; HTML gibt die Karte, die Aufgabenzeilen und das scoped Gantt-CSS zurück.

Ressourcen

Weiter entdecken

	Alle sgcHTML-KomponentenDurchsuchen Sie die vollständige Funktionsmatrix von über 60 Komponenten.	Öffnen
	Kostenlose Testversion herunterladenDie 30-Tage-Testversion enthält die 60.HTML-Demoprojekte.	Öffnen
	PreiseSingle-, Team- und Site-Lizenzen mit vollständigem Quellcode.	Öffnen

Gantt