Diagram
TsgcHTMLComponent_Diagram — Delphi, C++ Builder ve .NET'te, düğümleri sabit koordinatlara yerleştirip etiketli oklarla birbirine bağlayarak satır içi SVG olarak bir düğüm-ve-ok akış diyagramı işleyin.
TsgcHTMLComponent_Diagram — Delphi, C++ Builder ve .NET'te, düğümleri sabit koordinatlara yerleştirip etiketli oklarla birbirine bağlayarak satır içi SVG olarak bir düğüm-ve-ok akış diyagramı işleyin.
Kendi içinde tamamlanmış satır içi bir <svg> üreten bir akış şeması bileşeni. X/Y koordinatlarına düğümler ekleyin, onları oklarla bağlayın, ardından HTML özelliğini okuyun.
TsgcHTMLComponent_Diagram
Satır içi <svg> düğümleri ve okları
Delphi, C++ Builder, .NET
Her kutu için (konumu, rengi ve şekliyle birlikte) AddNode'u çağırın, onları Connect ile bağlayın, ardından HTML'i okuyun.
uses
sgcHTML_Enums, sgcHTML_Component_Diagram;
var
oDiagram: TsgcHTMLComponent_Diagram;
begin
oDiagram := TsgcHTMLComponent_Diagram.Create(nil);
try
oDiagram.DiagramWidth := 600;
oDiagram.DiagramHeight := 300;
oDiagram.AddNode('start', 'Start', 240, 20, hcSuccess, nsCircle);
oDiagram.AddNode('work', 'Process', 240, 120, hcPrimary, nsRoundedRect);
oDiagram.AddNode('done', 'Finish', 240, 220, hcDanger, nsDiamond);
oDiagram.Connect('start', 'work', 'begin');
oDiagram.Connect('work', 'done', 'commit');
WebModule.Response := oDiagram.HTML; // inline <svg> flow diagram
finally
oDiagram.Free;
end;
end;// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Diagram.hpp
TsgcHTMLComponent_Diagram *oDiagram = new TsgcHTMLComponent_Diagram(NULL);
try
{
oDiagram->DiagramWidth = 600;
oDiagram->DiagramHeight = 300;
oDiagram->AddNode("start", "Start", 240, 20, hcSuccess, nsCircle);
oDiagram->AddNode("work", "Process", 240, 120, hcPrimary, nsRoundedRect);
oDiagram->AddNode("done", "Finish", 240, 220, hcDanger, nsDiamond);
oDiagram->Connect("start", "work", "begin");
oDiagram->Connect("work", "done", "commit");
String html = oDiagram->HTML; // inline <svg> flow diagram
}
__finally
{
delete oDiagram;
}using esegece.sgcWebSockets;
var diagram = new TsgcHTMLComponent_Diagram();
diagram.DiagramWidth = 600;
diagram.DiagramHeight = 300;
diagram.AddNode("start", "Start", 240, 20, TsgcHTMLColor.hcSuccess, TsgcHTMLDiagramNodeShape.nsCircle);
diagram.AddNode("work", "Process", 240, 120, TsgcHTMLColor.hcPrimary, TsgcHTMLDiagramNodeShape.nsRoundedRect);
diagram.AddNode("done", "Finish", 240, 220, TsgcHTMLColor.hcDanger, TsgcHTMLDiagramNodeShape.nsDiamond);
diagram.Connect("start", "work", "begin");
diagram.Connect("work", "done", "commit");
string html = diagram.HTML; // inline <svg> flow diagramEn sık başvurduğunuz üyeler.
Nodes (TsgcHTMLDiagramNodes) kutuları tutar; her TsgcHTMLDiagramNode NodeID, Text, X, Y, Width, Height, Color ve Shape'i sunar.
AddNode(aID, aText, aX, aY, aColor, aShape) bir düğüm ekler ve onu döndürür; aColor bir TsgcHTMLColor, aShape ise bir TsgcHTMLDiagramNodeShape'tir.
TsgcHTMLDiagramNodeShape nsRectangle, nsRoundedRect, nsCircle ve nsDiamond sunar.
Connections (TsgcHTMLDiagramConnections) okları tutar; her TsgcHTMLDiagramConnection FromNode, ToNode, Label_ ve Color'a sahiptir.
Connect(aFromID, aToID, aLabel_), NodeID'leriyle başvurulan iki düğüm arasında etiketli bir ok çizer.
DiagramWidth, DiagramHeight ve DiagramID, SVG'yi boyutlandırır ve tanımlar; HTML, oklar düğümlerin arkasına çizilmiş satır içi <svg>'yi döndürür.