在您自己的应用程序中为用户提供真正的图表编辑器。他们从面板拖出形状，把形状连接起来，就地输入文字，并可撤销任何操作。您只需一次调用就能排列整个图表，把它保存为 JSON，并导出为 PNG 或 SVG，即使在没有窗口的服务器上也可以。
十三项功能，把真正的图表编辑器放进您的应用程序。
用户对图表工具的所有期望，由您放到窗体上的两个组件提供。
用户用得上的编辑器
业务应用程序经常需要由用户自己维护的图表：审批流程、流程图、生产线布局。与其让用户去使用单独的绘图工具，不如把编辑器放进您自己的窗体。放置一个 TsgcVCLDiagramPalette 和一个 TsgcVCLDiagramView，通过面板的 View 属性把它们关联起来，用户就可以把形状拖到画布上，从端口绘制连接线，并就地输入节点文字。FireMonkey、WinForms、WPF 和 Avalonia 也有同样的一对组件。
TsgcVCLDiagramPalette 可通过拖动放置形状，也可以先单击项目再单击视图Tool 在 dgtSelect、dgtPan、dgtConnector 和 dgtShape 之间切换dglRightToLeft 方向会让图表从右侧开始排列
用户用得上的编辑器
商业软件中的大多数图表只用一小套熟悉的图形，sgcDiagram 已经为您准备好。您会得到流程图符号：处理、判断、终止、数据、文档、预定义处理和连接圆，还有基本的矩形、圆角矩形和椭圆、自由文本、图像、可容纳其他节点的容器，以及由 SVG 路径数据生成的自定义轮廓。每种形状都知道自己的轮廓、文字区域、默认端口和主题颜色，因此判断形状无需任何代码就会把端口放在各个角上。用 Left、Top、Width 和 Height 放置节点，用 Angle 旋转节点。
Shape 接受 TsgcDiagramShape 值，例如 dgsDecisiondgsPath 根据 SVG 路径语法的 PathData 绘制任意轮廓dgsContainer 通过 ContainerId 容纳子节点并带着它们一起移动TextAlign 和 TextVAlign 决定自动换行的文字在形状中的位置
用户用得上的编辑器
图表的可读性取决于它的线条。每条连接线都可选择类型：直线或经过路点的折线、由水平和垂直线段组成的正交路径，或用于节点图的平滑曲线。AddConnector 会按文档的 DefaultConnectorKind 创建连接线。两端的箭头、虚线或点线，以及任意数量的标签（可沿线放置，用户也可拖动），能把一条普通的线变成清晰的“是”或“否”分支。在注册版中，正交路由器会绕开节点并把平行线段分开。
Kind 为 dgcStraight、dgcOrthogonal 或 dgcCurvedStartArrow 和 EndArrow 接受 TsgcDiagramArrow，例如 dgaTriangle 或 dgaDiamondLabels 保存任意数量的标签，用 Position 和 Offset 定位Waypoints 让直线和曲线连接线在您想要的位置转折社区版把正交连接线路由为简单的折角，不会绕开节点。
阅读帮助主题用户用得上的编辑器
最让用户沮丧的，莫过于移动一个方框后图表就散架了。每条连接线的端点都是粘附的：粘附到命名端口、节点的轮廓，或者自由地停在某个点上。移动、调整大小或旋转节点时，它的连接线会跟随并重新路由。形状在各边中点自带端口，您也可以添加自己的端口，指定位置、边、流向和标题，节点编辑器中带类型的输入和输出就是这样构建的。ShowPorts 决定端口是始终显示、悬停时显示还是从不显示。
TsgcDiagramPort 具有 Id、X、Y、Side、Flow 和 CaptionFlow 用 dgfIn 把端口设为输入，用 dgfOut 设为输出SourcePortId 和 TargetPortId 把连接线端点粘附到端口ShowPorts 默认为 dgvHover，也可以是 dgvAlways 和 dgvNever让代码完成整理工作：排列图、根据表格构建图表，或用规则连接模块。
自动生成的图表 仅限注册版
由代码生成或由用户快速绘制的图表很少整齐。TsgcDiagramLayeredLayout 采用 Sugiyama 方法把有向图按层排列，因此流程图、业务流程图、状态机和依赖图会从左到右或从上到下排列，连接线交叉很少，长连接线保持笔直。TsgcDiagramTreeLayout 把父节点居中放在其子节点之上，适用于组织结构图和分类树。两者都作为一个撤销步骤运行，因此用户可以尝试一种布局，再用 Ctrl+Z 撤回。SelectionOnly 只排列选中的部分。
Direction 为 dglTopToBottom、dglLeftToRight、dglBottomToTop 或 dglRightToLeftLayerSpacing 和 NodeSpacing 设置间距，默认分别为 60 和 30 个世界单位Execute 之后，Crossings 报告连接线交叉数TreeStyle 设为 dgoCompactLeaves 时，会把一位经理的下属堆叠在同一列在社区版中，节点保持在用户或代码放置的位置。
阅读帮助主题
自动生成的图表 仅限注册版
您的员工、成本中心或产品类别本来就保存在带有键和父级列的表中。TsgcDiagramDataBinding 把这些行变成图表：每一行成为一个节点，每个父键成为一条连接线，再由树形或分层布局排列结果。设置 DataSource、KeyField、ParentField 和 LabelField，把 Target 指向视图，并设置 Active。启用 LiveUpdates 后，提交的编辑、插入或删除会在消息循环的下一轮重建图表，而在行之间移动不会改变选择。
DataSource、KeyField、ParentField 和 LabelField 映射各列OnCreateNode 根据行的任意字段设置每个节点的样式dgbAuto 为树选择树形布局，为有多个父节点的图选择分层布局ParentSeparator 在一个字段中列出多个父节点社区版没有数据绑定：请用 AddNode 和 AddConnector 在代码中构建节点。
阅读帮助主题
自动生成的图表
自动化规则、数据管道和物联网流程最容易理解的方式，就是把模块连接在一起。为每个节点在左侧提供带类型的输入端口，在右侧提供输出端口，把 DefaultConnectorKind 切换为曲线连接线，并在 OnDrawNode 中用标题条和彩色端口点自行绘制模块。OnConnecting 让您在建立连接之前拒绝它，因此数字输出永远不会连到文本输入。NodeEditor 演示正是这样构建的，模块在一个撤销步骤中添加，图连同端口和标题一起保存为 JSON。
OnConnecting 否决连接，例如类型不同的端口之间的连接OnDrawNode 绘制节点，或在默认绘制的基础上追加内容DefaultConnectorKind 设为 dgcCurved 可得到经典的节点图外观Caption 绘制在端口旁边的节点内部为用户提供安全的编辑，为应用程序提供可靠的文档格式和图像输出。
撤销、文件和导出
用户知道可以回退时才敢尝试。文档保留撤销栈和重做栈，用户在视图中的每个操作就是一步。在代码中，BeginTransaction 和 EndTransaction 把任意数量的更改归为一个命名步骤，Rollback 则丢弃它们。复制和粘贴在应用程序内部有效，重复粘贴会有偏移，不会叠在一起。节点移动或调整大小时，它的边缘和中心线会吸附到网格和周围的节点，并显示参考线指示对齐。
BeginTransaction、EndTransaction 和 Rollback 把代码中所做的更改归为一组UndoLimit 默认保留 100 步，UndoCaption 给下一次撤销命名CopyToClipboard、CutToClipboard 和 PasteFromClipboardSnapToGrid、SnapToGuides 和 GridSize 控制对齐辅助
撤销、文件和导出
图表是您的应用程序存储、发送和做版本管理的数据。文档可以按字符串、文件或流保存为 JSON，格式在所有平台和所有版本中都相同：由 Delphi 桌面应用程序保存的文件，可以在 C++ Builder 工具、.NET 服务或社区版构建中打开。输出是规范化的，键顺序固定，默认值省略，因此同一个图表总是得到同样的文本，在源代码管理中比较起来很干净。图像以 PNG 数据的形式包含在文件中。
SaveToFile 和 LoadFromFile，SaveToStream 和 LoadFromStreamSaveToJSON 和 LoadFromJSON，适用于数据库字段或网络请求DiagramJSON 的形式保存其图表
撤销、文件和导出
图表最终会出现在报告、电子邮件、维基页面和幻灯片中。视图把所显示的内容保存为 PNG 或 SVG，可设置缩放系数以获得清晰的图像，并应用其自定义绘制和主题，因此深色图表导出的也是深色。TsgcDiagramRenderer 无需任何视图就能做同样的事：控制台程序、Windows 服务或 Linux64 守护进程可以构建图表、完成布局并写出文件。Headless 演示正是用一张支持工单流程图做到这一点，用 Delphi 13 构建时，它在 Win32、Win64 和 Linux64 上写出相同的字节。
SaveToPNG 和 SaveToSVG，带有每世界单位像素数的缩放TsgcDiagramRenderer 上的 SaveToPNGFile 和 SaveToSVGFile，无需窗口RenderTo 把文档的一部分绘制到任意 sgcUICore 画布上让不应编辑图表的人也能看到它，并保持您应用程序的外观。
查看与样式
并非每个用户都应该编辑流程图。设置 ReadOnly 后，同一个视图就变成了查看器：用户可以选择，用 Ctrl 和滚轮缩放，用鼠标中键或空格键平移，但不会移动、连接或删除任何内容，面板也无法放置形状。指针在项目上方变成手形，OnItemClick 报告点击的是哪一项，因此单击节点可以打开对应的记录。ZoomToFit 可在代码中让整个图表适应视图。如果只想保护图表的一部分，请改为锁定单个项目或整个图层。
ReadOnly 保留选择、缩放和平移，并阻止所有编辑OnItemClick、OnItemDblClick 和 OnHover 报告指针下方的项目ZoomToFit、ZoomToSelection 和 CenterOn 在代码中移动视图Locked 保护单个项目或整个图层查看与样式
图表应该看起来是您应用程序的一部分，而不是粘贴进来的图片。视图、面板和导出都使用 sgcUICore 主题，因此一个 Theme 属性即可在浅色和深色之间切换，并与同一窗体上的 sgcUI 网格、图表和仪表板保持一致。每个节点和连接线都有自己的 Style，包含填充、描边、虚线、圆角半径和文字设置，NodeStyle 和 ConnectorStyle 是新项目的模板。如需完全控制，OnDrawNode 让您自行绘制节点，FontFile 则用您选择的 TrueType 字体绘制文字。
Theme 接受 utDefault（跟随应用程序主题）、utLight、utDark 或 utCustomStyle 设置 Fill、Stroke、StrokeWidth、Dash 和 CornerRadiusNodeStyle 和 ConnectorStyle 为每个新项目设置样式sgcUIARGB 构建颜色，例如企业青色预览显示的内容与打印机和 PDF 得到的完全一致。
打印、预览和 PDF
整个图示都会打印，而不只是滚动到视图中的部分：范围与 PNG 和 SVG 导出相同。视图的缩放和滚动位置不会改变页面，选择、手柄和参考线也不会被打印。
Print 显示打印对话框或直接打印到默认打印机，ShowPrintPreview 打开带有翻页、缩放、页面设置、打印和 PDF 导出的预览PrintSettings 保存纸张、方向、页边距、缩放以及页眉和页脚文字，打印机、预览和 PDF 都使用它ExportToPDF 写出带真正文本的矢量页面，默认是带标签的 PDF/UA，并附上统计形状和连接线数量、列出前 30 个形状文本的替代文本TsgcUIPDFOptions 的 PDFALevel 可为归档加上 PDF/A-2a 或 PDF/A-3a，可单独使用，也可与 PDF/UA 同时使用打印和预览包含在每个版本中，包括免费的社区版，可用于 VCL、FireMonkey、WinForms、WPF 和 Avalonia。在 FireMonkey 中，打印在 Windows 和 macOS 上可用，预览和 PDF 导出则适用于所有平台。PDF 导出需要 sgcUIPDF 桥接和已获许可的 sgcPDF（在 .NET 中为 NuGet 包 esegece.sgcUICore.sgcPDF），因此不包含在社区版中。
面向屏幕阅读器的 UI Automation、键盘和高对比度，无需任何设置。
无障碍
sgcDiagram 将带文字的节点、节点之间的连接线以及形状面板向 Microsoft UI Automation 公开，图表还会用写入无障碍 PDF 的同一段替代文本来描述自己。
无障碍功能在每个版本中默认开启，包括免费的社区版，可用于 VCL（Delphi 和 C++Builder 从 Delphi 7 到 Delphi 13 的每个版本）、Windows 上的 FireMonkey，以及 WinForms、WPF 和 Avalonia。在 Delphi 和 C++Builder 中，AccessibleName 和 AccessibleDescription 设置向 UI Automation 公开的名称和说明，在 .NET 中，各框架标准的无障碍名称和帮助文本起同样的作用。请参见无障碍符合性报告。连接线折点只能用鼠标编辑。
sgcUI 套件演示中的 sgcDiagram：使用内置模拟数据、可离线运行的完整应用程序。
1 号线从储罐到灌装机的工艺图，故障泵 P-201 以红色显示。
Altamira Plant →
枢纽网络图：线路宽度表示货量，颜色表示状态。
Altamira Fleet →
跨项目的里程碑依赖关系，自动布局，关键链接高亮显示。
Altamira PMO →
采购审批工作流，旁边是申请表格及其审批状态。
Altamira ERP →
采购审批、工单升级和入职清单经常变化，而负责这些流程的人并不是程序员。嵌入编辑器后，流程负责人可以绘制带有判断和“是”或“否”标签的流程，把它作为 JSON 保存在您的数据库中，您的应用程序读取同一份文档来驱动真实流程。ReadOnly 把已保存的流程变成供其他所有人查看的流程图。可以从 FlowchartEditor 开始。
人事和 ERP 系统本来就知道谁向谁汇报。用 TsgcDiagramDataBinding 绑定员工表，让紧凑叶节点的树形布局排列经理和员工，并在 OnCreateNode 中按部门为每个方框着色。当人事部门在网格中提交更改时，图表会自动重建，单击节点会选中对应的员工。OrgChart 演示就以这种方式绑定了 60 名员工。
让客户构建数据管道、自动化规则或物联网流程的产品，需要一块把模块连接在一起的画布。带类型的端口、曲线连接线和 OnConnecting 为您提供规则，OnDrawNode 让模块拥有您自己的外观，图则保存为您的引擎可以执行的 JSON。由于文档不依赖用户界面，服务器也可以加载并检查同一个图。
Delphi、C++ Builder 和 C# 中的同一套 API：添加面板和视图，在一个撤销步骤中创建形状和连接线，然后排列它们。布局调用需要注册版或试用版。
uses
Classes, SysUtils, Forms, Controls,
sgcUICore_Theme, sgcDiagram_Types, sgcDiagram_Model, sgcDiagram_Layout,
sgcDiagram_VCL;
type
TFormOrders = class(TForm)
private
FPalette: TsgcVCLDiagramPalette;
FView: TsgcVCLDiagramView;
procedure DoSelectionChange(Sender: TObject);
public
constructor CreateNew(aOwner: TComponent; Dummy: Integer = 0); override;
procedure BuildFlow;
end;
constructor TFormOrders.CreateNew(aOwner: TComponent; Dummy: Integer);
begin
inherited;
FPalette := TsgcVCLDiagramPalette.Create(Self);
FPalette.Parent := Self;
FPalette.Align := alLeft;
FView := TsgcVCLDiagramView.Create(Self);
FView.Parent := Self;
FView.Align := alClient;
FView.ShowPorts := dgvHover;
FView.Theme := utDark;
FView.OnSelectionChange := DoSelectionChange;
FPalette.View := FView;
end;
procedure TFormOrders.DoSelectionChange(Sender: TObject);
begin
Caption := Format('Orders, %d selected', [FView.Diagram.Selection.Count]);
end;
procedure TFormOrders.BuildFlow;
var
oDoc: TsgcDiagramDocument;
oStart, oStock, oPay, oShip: TsgcDiagramNode;
oLayout: TsgcDiagramLayeredLayout;
begin
oDoc := FView.Diagram;
oDoc.BeginTransaction('Order flow');
try
oStart := oDoc.AddNode(dgsTerminator, 0, 0, 140, 50, 'Order received');
oStock := oDoc.AddNode(dgsDecision, 0, 0, 160, 90, 'In stock?');
oPay := oDoc.AddNode(dgsProcess, 0, 0, 140, 60, 'Charge card');
oShip := oDoc.AddNode(dgsPredefinedProcess, 0, 0, 140, 60, 'Ship order');
oPay.Style.Fill := sgcUIARGB($FF, $00, $96, $88);
oDoc.AddConnector(oStart, oStock);
oDoc.AddConnector(oStock, oPay).Labels.Add.Text := 'Yes';
oDoc.AddConnector(oPay, oShip);
oDoc.AddConnector(oStock, oDoc.AddNode(dgsDocument, 0, 0, 140, 60,
'Backorder note')).Labels.Add.Text := 'No';
finally
oDoc.EndTransaction;
end;
// arrange left to right, one undo step
oLayout := TsgcDiagramLayeredLayout.Create(oDoc);
try
oLayout.Direction := dglLeftToRight;
oLayout.Execute;
finally
oLayout.Free;
end;
FView.ZoomToFit;
FView.SaveToPNG(ExtractFilePath(ParamStr(0)) + 'orders.png', 2);
end;#include <vcl.h>
#include "sgcUICore_Theme.hpp"
#include "sgcDiagram_Types.hpp"
#include "sgcDiagram_Model.hpp"
#include "sgcDiagram_Layout.hpp"
#include "sgcDiagram_VCL.hpp"
void BuildOrderFlow(TForm *Form)
{
TsgcVCLDiagramPalette *Palette = new TsgcVCLDiagramPalette(Form);
Palette->Parent = Form;
Palette->Align = alLeft;
TsgcVCLDiagramView *View = new TsgcVCLDiagramView(Form);
View->Parent = Form;
View->Align = alClient;
View->ShowPorts = dgvHover;
View->Theme = utDark;
Palette->View = View;
TsgcDiagramDocument *Doc = View->Diagram;
Doc->BeginTransaction("Order flow");
try
{
TsgcDiagramNode *Start = Doc->AddNode(dgsTerminator, 0, 0, 140, 50, "Order received");
TsgcDiagramNode *Stock = Doc->AddNode(dgsDecision, 0, 0, 160, 90, "In stock?");
TsgcDiagramNode *Pay = Doc->AddNode(dgsProcess, 0, 0, 140, 60, "Charge card");
TsgcDiagramNode *Ship = Doc->AddNode(dgsPredefinedProcess, 0, 0, 140, 60, "Ship order");
TsgcDiagramNode *Note = Doc->AddNode(dgsDocument, 0, 0, 140, 60, "Backorder note");
Pay->Style->Fill = sgcUIARGB(0xFF, 0x00, 0x96, 0x88);
Doc->AddConnector(Start, Stock, "", "");
Doc->AddConnector(Stock, Pay, "", "")->Labels->Add()->Text = "Yes";
Doc->AddConnector(Pay, Ship, "", "");
Doc->AddConnector(Stock, Note, "", "")->Labels->Add()->Text = "No";
}
__finally
{
Doc->EndTransaction();
}
// arrange left to right, one undo step
TsgcDiagramLayeredLayout *Layout = new TsgcDiagramLayeredLayout(Doc);
try
{
Layout->Direction = dglLeftToRight;
Layout->Execute();
}
__finally
{
delete Layout;
}
View->ZoomToFit();
View->SaveToPNG(ExtractFilePath(ParamStr(0)) + "orders.png", 2);
}using System;
using System.IO;
using System.Windows.Forms;
using esegece.sgcDiagram;
using esegece.sgcUICore;
public class OrdersForm : Form
{
readonly TsgcWinFormsDiagramView View;
public OrdersForm()
{
View = new TsgcWinFormsDiagramView { Dock = DockStyle.Fill };
View.ShowPorts = TsgcDiagramShowPorts.dgvHover;
View.Theme = TsgcUITheme.utDark;
View.OnSelectionChange += Sender =>
Text = "Orders, " + View.Diagram.Selection.Count + " selected";
Controls.Add(View);
Controls.Add(new TsgcWinFormsDiagramPalette { Dock = DockStyle.Left, View = View });
BuildFlow();
}
void BuildFlow()
{
TsgcDiagramDocument oDoc = View.Diagram;
oDoc.BeginTransaction("Order flow");
try
{
TsgcDiagramNode oStart = oDoc.AddNode(TsgcDiagramShape.dgsTerminator, 0, 0, 140, 50, "Order received");
TsgcDiagramNode oStock = oDoc.AddNode(TsgcDiagramShape.dgsDecision, 0, 0, 160, 90, "In stock?");
TsgcDiagramNode oPay = oDoc.AddNode(TsgcDiagramShape.dgsProcess, 0, 0, 140, 60, "Charge card");
TsgcDiagramNode oShip = oDoc.AddNode(TsgcDiagramShape.dgsPredefinedProcess, 0, 0, 140, 60, "Ship order");
TsgcDiagramNode oNote = oDoc.AddNode(TsgcDiagramShape.dgsDocument, 0, 0, 140, 60, "Backorder note");
oPay.Style.Fill = sgcUICore_Theme.sgcUIARGB(0xFF, 0x00, 0x96, 0x88);
oDoc.AddConnector(oStart, oStock);
oDoc.AddConnector(oStock, oPay).Labels.Add().Text = "Yes";
oDoc.AddConnector(oPay, oShip);
oDoc.AddConnector(oStock, oNote).Labels.Add().Text = "No";
}
finally
{
oDoc.EndTransaction();
}
// arrange left to right, one undo step
TsgcDiagramLayeredLayout oLayout = new TsgcDiagramLayeredLayout(oDoc);
oLayout.Direction = TsgcDiagramDirection.dglLeftToRight;
oLayout.Execute();
View.ZoomToFit();
View.SaveToPNG(Path.Combine(AppContext.BaseDirectory, "orders.png"), 2);
}
}dotnet add package esegece.sgcDiagram.WinForms每个演示都有同名的 Delphi 和 C++ Builder 版本。.NET 版本包含 FlowchartEditor（WinForms）、FlowchartWpf、FlowchartAvalonia、NodeEditor、OrgChart 和 ConsoleRender。
在代码中构建的订单流程：拖动形状，从端口绘制连接线，切换连接线类型，撤销，运行分层布局，打开和保存 JSON，导出 PNG 和 SVG，切换主题和只读模式。
TDBGrid 中的 60 名员工，绑定到只读的图表视图。提交一次编辑，图表就会重建，含紧凑叶节点、部门颜色、单击选择以及 PNG 和 SVG 导出。
带类型的输入和输出端口，OnConnecting 中的连接规则，曲线连接线，以及在 OnDrawNode 中绘制的模块，连同端口和标题一起保存为 JSON。
基于 FireMonkey 视图和面板的流程图编辑器，适用于 Windows 和 Android，点按放置形状，双指缩放。
不含 VCL 或 FireMonkey 单元的控制台程序，构建流程图，用分层布局排列，并写出 PNG、SVG 和 JSON，也适用于 Linux64。
免费社区版（NuGet 上的 esegece.sgcDiagram.Community）不含自动布局、绕开障碍的路由、数据绑定和多图层。sgcDiagram 没有 sgcWebSockets 桥接。
| 功能 | 社区版（免费） | 注册版 |
|---|---|---|
| 面板、视图和就地编辑 | ✓ | ✓ |
| 14 种形状、端口、分组和容器 | ✓ | ✓ |
| 直线、正交和曲线连接线 | ✓ | ✓ |
| 撤销、剪贴板、吸附和参考线 | ✓ | ✓ |
| JSON 文件、PNG 和 SVG 导出 | ✓ | ✓ |
| 浅色和深色主题、查看器模式 | ✓ | ✓ |
| 分层和树形布局 | − | ✓ |
| 绕开障碍的正交路由 | − | ✓ |
| 数据绑定 | − | ✓ |
| 多个图层 | − | ✓ |
VCL 使用 TsgcVCLDiagramView 和 TsgcVCLDiagramPalette，FireMonkey 使用 TsgcFMXDiagramView 和 TsgcFMXDiagramPalette。
TsgcDiagramDocument、TsgcDiagramNode、TsgcDiagramConnector 和 TsgcDiagramController，不依赖用户界面。
TsgcDiagramRenderer 无需窗口即可写出 PNG 和 SVG。TsgcDiagramLayeredLayout 和 TsgcDiagramTreeLayout 负责排列图表。注册版
TsgcWinFormsDiagramView、TsgcWpfDiagramView 和 TsgcAvaloniaDiagramView，各自带有面板，位于命名空间 esegece.sgcDiagram。
| 目标 | 组件 | 平台 |
|---|---|---|
| Delphi 7 至 13，VCL | TsgcVCLDiagramView, TsgcVCLDiagramPalette | Win32 和 Win64 |
| Delphi XE6 至 13，FireMonkey | TsgcFMXDiagramView, TsgcFMXDiagramPalette | Windows、macOS、iOS 和 Android |
| C++ Builder 2007 至 13 | 相同的组件 | 生成的 .hpp 头文件和静态库 |
| Delphi 10.2 至 13，无界面 | 文档、JSON、路由、布局、PNG 和 SVG 渲染器 | Linux64，例如在服务器上渲染图表 |
| .NET Framework 4.7.2、.NET 8、9 和 10 | WinForms、WPF 和 Avalonia 视图 | Windows、Linux 和 macOS，无界面 JSON、PNG 和 SVG |
可以，视图和面板正是为此而设。用户可以拖动形状，从端口绘制连接线，就地编辑文字，分组，复制和粘贴，并对每个操作进行撤销或重做。当用户只应查看时请设置 ReadOnly，或锁定单个项目和图层来保护图表的一部分，其余部分仍可编辑。
可以，有两种方式。在代码中，在 BeginTransaction 和 EndTransaction 之间使用 AddNode 和 AddConnector 可以把任意图表作为一个撤销步骤构建出来。在注册版中，TsgcDiagramDataBinding 根据带有键和父级列的数据集构建图表，并在数据变化时重建。在 .NET 中，它读取 DataTable。
两种，在注册版和试用版中提供。TsgcDiagramLayeredLayout 把流程图、状态机和依赖图等有向图按层排列，交叉很少。TsgcDiagramTreeLayout 排列组织结构图和分类树等层次结构，并带有紧凑叶节点样式。两者都支持四个方向，并作为一个撤销步骤运行。
1.0 版不支持。图表可以导出为 PNG 和 SVG，可从视图导出，也可以用 TsgcDiagramRenderer 在没有窗口的情况下导出。SVG 缩放无损，因此适合印刷和文档，以 2 倍缩放保存的 PNG 在幻灯片上也保持清晰。打印同样不属于 1.0 版。
四项高级功能：自动布局、绕开障碍的正交路由（社区版绘制简单折角）、数据绑定，以及第一个图层以外的图层。其他一切都有：所有形状、三种连接线类型、端口、容器、撤销、剪贴板、JSON、PNG 和 SVG、主题、吸附和参考线。注册版和试用版拥有全部功能。
可以。JSON 格式在所有平台和所有版本中都相同，因此由 Delphi 或 C++ Builder 应用程序保存的图表可以在 WinForms、WPF 或 Avalonia 应用程序中打开，反之亦然。由注册版保存的文件也可以在社区版构建中打开，并保留其图层名称。
可以。FireMonkey 视图和面板自 Delphi XE6 起可在 Windows、macOS、iOS 和 Android 上运行，FlowchartEditorFMX 演示展示了在 Android 上的触摸编辑。在 .NET 中，Avalonia 视图可在 Windows、Linux 和 macOS 上运行。
