ERP의 경영진 및 영업 대시보드
ERP의 시작 페이지는 매출, 미결 주문, 연체 청구서, 이탈률을 추세 화살표가 있는 KPI 카드로 보여 주고, 아래 타일에는 영업 차트와 상위 고객 그리드를 둡니다. 매일 밤 서비스가 같은 카드를 경영진 이메일용 PNG로 렌더링하며, 화면과 같은 숫자와 색상을 사용합니다.
- KPI 카드
- 타일 안의 모든 컨트롤
- 헤드리스 KPI 이미지
- 테마
레이아웃 코드 없이 비즈니스 대시보드를 만드세요. 12열 그리드에 타일을 놓고 각 타일에 KPI 카드, 차트, 지도, 보고서 미리보기를 넣으며, 속성 하나로 화면 전체를 다크 테마로 바꾸고, 사용자가 직접 드래그하고 크기를 조절하고 레이아웃을 저장하게 하세요.
네 개 그룹의 열한 가지 기능이며, 실제 컴포넌트와 속성 이름, 각 도움말 항목 링크를 담았습니다. Registered로 표시된 기능은 무료 .NET Community 빌드에 포함되지 않습니다.
타일을 대신 배치하는 그리드와 숫자를 보여 주는 카드.
레이아웃과 콘텐츠
대시보드는 어떤 창 크기와 DPI에서도 깔끔하게 유지되어야 하는 타일 그리드입니다. 폼에 대시보드를 올려 놓고 타일을 추가한 다음 각 타일에 열, 행, 스팬을 지정하세요. 그리드는 사용 가능한 너비에서 열 너비를 계산하고, 모니터 DPI에 맞춰 간격과 행 높이를 조정하며, 타일에 필요한 행이 더 많으면 세로로 스크롤합니다. 겹치는 타일은 한 행씩 아래로 밀려나므로 서로 위에 겹쳐지지 않습니다. 레이아웃이 하나의 엔진에 있으므로 같은 타일 셀은 VCL, FireMonkey, .NET 뷰에서 동일한 배치를 만듭니다.
Columns(기본값 12), RowHeight(120), Gap, Padding(12)을 갖춘 TsgcVCLDashboardCol, Row, ColSpan, RowSpan을 갖춘 TsgcVCLDashboardTileLayout.PlacedCell과 Layout.Rect에서 읽을 수 있습니다
레이아웃과 콘텐츠
대시보드의 내용이 사용자나 데이터에 따라 달라진다면 좌표를 계산하고 싶지 않을 것입니다. 타일의 열과 행을 -1로 두면 자동 배치가 위에서부터 행을, 왼쪽에서부터 열을 훑어 처음 비어 있는 자리에 놓습니다. 열만 고정하면 타일은 그 열에서 처음 비어 있는 행에 놓입니다. 같은 대시보드에서 고정 타일과 자동 배치 타일을 섞어 사용할 수 있습니다.
AutoFlow는 기본적으로 켜져 있으며, 새 타일은 Col과 Row -1, 스팬 3 x 2로 시작합니다TsgcDashboardLayout이 VCL, FireMonkey, .NET을 구동합니다
레이아웃과 콘텐츠
타일은 선택적 헤더가 있는 컨테이너이므로 차트, 그리드, 지도, PDF 뷰어, 보고서 미리보기, 일반 메모 등 화면에 필요한 무엇이든 담을 수 있습니다. 컨트롤의 부모를 타일로 지정하고 클라이언트 영역에 맞춰 정렬하세요. Suite 데모는 sgcCharts, sgcMaps, sgcPDF, sgcReports를 하나의 대시보드에 담으며 모두 대시보드 테마를 따릅니다. 타일은 헤더를 없애 여백 없는 깔끔한 차트로 쓰거나 제목 표시줄로 유지할 수 있습니다. 타일을 추가하면 대시보드는 행이 늘어나고 세로로 스크롤됩니다.
Title과 ShowHeaderParentTheme으로 타일이 대시보드를 따르게 하거나 자체 Theme을 유지하게 합니다TsgcFMXDashboardTile에서도 동일하게 동작합니다
레이아웃과 콘텐츠
모든 대시보드는 중요한 숫자의 행으로 시작합니다. 매출, 주문, 이탈률, 응답 시간 같은 것들입니다. KPI 카드는 큰 값, 아이콘, 텍스트가 있는 추세 화살표, 바닥글 줄, 최근 값의 작은 스파크라인을 하나의 컴포넌트로 보여 줍니다. 새 수치가 도착할 때마다 AddValue를 호출하면 스파크라인이 스크롤되며, MaxPoints가 보관할 이력의 양을 정합니다. AccentColor로 측정 대상에 맞게 카드 색을 정할 수 있고, 카드는 자신이 놓인 대시보드의 라이트 또는 다크 테마를 따릅니다.
Title, Value, Icon, FooterText, AccentColor를 갖춘 TsgcVCLKPICardTrend: ktUp, ktDown, ktNeutral, 텍스트는 TrendValueAddValue, ClearValues, MaxPointsAddValue는 스레드에 안전하므로 작업자 스레드가 데이터를 공급할 수 있습니다사용자가 자신의 시작 페이지를 배치하고 보관하게 하고, 네트워크에서 데이터를 공급합니다.
사용자 레이아웃과 실시간 데이터 Registered 에디션 전용
공유 시작 페이지에서는 사용자마다 앞에 두고 싶은 숫자가 다릅니다. 드래그를 켜면 사용자가 헤더로 타일을 옮기고, 크기 조절을 켜면 모서리의 그립이 스팬을 바꿉니다. 마우스를 움직이는 동안 타일 아래에 대상 셀이 표시되고 타일이 그리드에 맞춰집니다. Esc 키로 취소합니다. 잠금으로 표시한 타일은 움직이지 않습니다. 아래의 저장된 레이아웃과 함께 사용하면 어떤 타일이 존재할지는 개발자가 정하면서도 사용자는 자신이 배치한 시작 페이지를 유지합니다.
AllowDrag와 AllowResizeLocked는 타일을 제자리에 고정합니다OnLayoutChanged는 드래그나 크기 조절이 끝날 때마다 발생합니다Community는 코드에서 고정 레이아웃을 만들며, 런타임 드래그와 크기 조절은 Registered 에디션 기능입니다.
도움말 항목 읽기사용자 레이아웃과 실시간 데이터 Registered 에디션 전용
사용자가 배치한 레이아웃은 재시작 후에도 돌아와야 합니다. 호출 한 번으로 그리드 측정값과 이름이 있는 모든 타일의 셀과 표시 여부를 간결한 JSON으로 쓰고, 다른 호출로 적용합니다. 타일은 이름으로 대응되고 알 수 없는 이름은 무시되며 텍스트에 없는 타일은 자신의 셀을 유지하므로, 새 버전에서 타일을 추가해도 이전에 저장한 레이아웃을 그대로 불러올 수 있습니다. JSON은 작고 읽기 쉬우므로 기본 레이아웃을 애플리케이션과 함께 배포하고 이를 다시 불러오는 초기화 버튼을 제공할 수 있습니다.
SaveLayout과 LoadLayout은 JSON 문자열을 반환하고 적용합니다SaveLayoutToFile, LoadLayoutFromFile, SaveLayoutToStream, LoadLayoutFromStream사용자 레이아웃과 실시간 데이터 Registered 에디션 전용
운영 화면은 매초 바뀌는 값을 보여 줍니다. sgcDashboardWS 브리지는 sgcWebSockets 클라이언트의 모든 JSON 메시지에서 숫자를 읽어 스파크라인과 함께 카드에 넣습니다. 추세 화살표는 이전 값을 따라 저절로 바뀝니다. Delphi 2010 이상에서는 텍스트 업데이트가 메인 스레드에서 실행되므로 클라이언트는 어떤 스레딩 모드든 사용할 수 있습니다. 유효한 JSON이 아니거나 경로가 숫자가 아닌 메시지는 무시되므로 잡음이 많은 피드가 화면을 망가뜨리지 않습니다.
TsgcDashboardSource_WebSocket, TsgcDashboardSource_MQTT(Topic 포함), TsgcDashboardSource_SSEdata.items[0].value 같은 ValuePath, 기본값이 %.2f인 ValueFormatTitlePath와 TrendValuePath는 더 많은 필드를 카드에 복사합니다OnValue 이벤트브리지에는 sgcWebSockets가 필요합니다. Community에서는 Value와 AddValue로 코드에서 카드에 데이터를 공급하세요.
도움말 항목 읽기화면 전체에 하나의 룩, 이미지로 쓰는 같은 카드, 모든 대상에서 같은 디자인.
테마, 이미지, 플랫폼
어두운 관제실과 밝은 사무실은 같은 화면을 두 가지 룩으로 필요로 합니다. 대시보드 테마를 설정하면 모든 타일, 모든 KPI 카드, 그 안의 sgcUI 컨트롤에 적용되어 차트, 게이지, 그리드가 함께 바뀝니다. 테마 유형은 모든 sgcUI 제품이 사용하는 것과 같으므로 애플리케이션 전체가 하나의 설정을 따를 수 있습니다. 눈에 띄어야 하는 타일은 자체 테마를 유지하고 나머지 대시보드는 전역 테마를 따르게 할 수 있습니다.
Theme := utDark 또는 utLightParentTheme으로 따라가거나 자체 Theme을 유지합니다테마, 이미지, 플랫폼
대시보드의 숫자는 아침 보고서 이메일, 인트라넷 페이지, PDF 등 다른 곳에서도 필요한 경우가 많습니다. TsgcDashboardKPI는 창, VCL, FireMonkey 없이 같은 카드를 렌더링하므로 콘솔 프로그램, Windows 서비스, Linux64 서버에서도 만들 수 있습니다. 너비와 높이는 논리 픽셀이며 배율 계수로 선명한 고해상도 이미지를 얻습니다. 예약 보고서에 활용하여 대시보드와 같은 쿼리로 카드를 만들고 이미지를 메시지에 첨부하세요.
SaveToPNG, 예를 들어 배율 2에서 320 x 160으로 640 x 320 이미지SaveToSVGCard.KPI.SaveToPNG는 화면의 카드가 보여 주는 내용을 저장합니다테마, 이미지, 플랫폼
대시보드를 한 번 작성하고 디자인을 재사용하세요. FireMonkey 대시보드, 타일, KPI 카드는 Windows, macOS, iOS, Android에서 실행되며, .NET 포트는 WinForms, WPF, Avalonia용으로 같은 클래스를 제공합니다. 하나의 레이아웃 엔진이 모든 곳에서 셀을 계산하므로 저장된 레이아웃은 모든 대상에서 같은 의미를 갖습니다. 데모는 모든 대상에 같은 구성으로 제공됩니다. Delphi와 C++ Builder는 Basic, LiveKPI, SaveLayout, Suite이며 .NET에는 WinForms, WPF, Avalonia 버전이 있습니다.
TsgcFMXDashboard, TsgcFMXDashboardTile, TsgcFMXKPICardTsgcWinFormsDashboard, TsgcWinFormsKPICard과 이들의 WPF 및 Avalonia 대응 컴포넌트미리 보기에는 프린터와 PDF가 받는 내용이 그대로 표시됩니다.
인쇄, 미리 보기, PDF
대시보드는 보드 전체의 그림으로 한 페이지에 인쇄됩니다. 숨겨지지 않은 모든 타일이, 스크롤로 보이지 않는 타일까지 포함해 화면과 같은 배치로 출력됩니다. 타일 안의 sgcUI 컨트롤은 각자의 렌더러로 그려지므로 KPI 카드, 차트, 게이지, 그리드, 피벗 그리드, 플래너 보기, 다이어그램이 모두 인쇄됩니다. 메모나 레이블처럼 타일 안의 다른 컨트롤은 비어 있게 됩니다.
Print는 인쇄 대화 상자를 표시하거나 기본 프린터로 바로 인쇄하고, ShowPrintPreview는 페이지 이동, 확대/축소, 페이지 설정, 인쇄, PDF 내보내기를 갖춘 미리 보기를 엽니다PrintSettings는 용지, 방향, 여백, 배율, 머리글과 바닥글 텍스트를 담고 있으며, 프린터, 미리 보기, PDF가 모두 이를 사용합니다ExportToPDF는 페이지를 태그가 지정된 그림 하나(기본 192 dpi)로 기록하며, 타일 제목을 읽는 순서대로 나열하는 대체 텍스트를 붙입니다TsgcUIPDFOptions의 PDFALevel은 보관용으로 PDF/A-2a 또는 PDF/A-3a를 추가하며, 단독으로도 PDF/UA와 함께도 사용할 수 있습니다인쇄와 미리 보기는 무료 Community 에디션을 포함한 모든 에디션에서 VCL, FireMonkey, WinForms, WPF, Avalonia에서 사용할 수 있습니다. FireMonkey에서는 인쇄가 Windows와 macOS에서, 미리 보기와 PDF 내보내기는 모든 플랫폼에서 동작합니다. PDF 내보내기에는 sgcUIPDF 브리지와 라이선스가 있는 sgcPDF(.NET에서는 NuGet 패키지 esegece.sgcUICore.sgcPDF)가 필요하므로 Community 에디션에는 포함되지 않습니다.
UI Automation을 통한 화면 읽기 프로그램, 키보드, 고대비 지원, 별도 설정이 필요 없습니다.
접근성
sgcDashboard는 대시보드와 타일을 제목과 위치와 함께, 각 타일에 호스팅된 컨트롤과, 제목, 값, 단위, 추세가 있는 KPI 카드를 Microsoft UI Automation에 노출합니다.
접근성은 무료 Community 에디션을 포함한 모든 에디션에서 기본으로 켜져 있으며, Delphi 7부터 Delphi 13까지 모든 Delphi 및 C++Builder 버전의 VCL, Windows의 FireMonkey, 그리고 WinForms, WPF, Avalonia에서 지원됩니다. Delphi와 C++Builder에서는 AccessibleName과 AccessibleDescription이 UI Automation에 노출되는 이름과 설명을 설정하고, .NET에서는 각 프레임워크의 표준 접근성 이름과 도움말 텍스트가 같은 역할을 합니다. 접근성 적합성 보고서를 참조하세요.
sgcUI 제품군 데모 속의 sgcDashboard: 내장 시뮬레이션 데이터로 오프라인에서 실행되는 완전한 애플리케이션입니다.
스파크라인이 있는 KPI 카드, 알람 타일, 트리맵, VaR 게이지를 대시보드 타일로 배치.
Altamira Markets →
공정 다이어그램 주위에 스파크라인이 있는 OEE 카드, 병 카운터, 알람 타일.
Altamira Plant →
ERP 대시보드: 스파크라인이 있는 KPI 카드, 매출 차트, 게이지, 고객 지도.
Altamira ERP →
한 페이지에 스파크라인이 있는 포트폴리오 KPI 카드, 상태 게이지, 차트.
Altamira PMO →
ERP의 시작 페이지는 매출, 미결 주문, 연체 청구서, 이탈률을 추세 화살표가 있는 KPI 카드로 보여 주고, 아래 타일에는 영업 차트와 상위 고객 그리드를 둡니다. 매일 밤 서비스가 같은 카드를 경영진 이메일용 PNG로 렌더링하며, 화면과 같은 숫자와 색상을 사용합니다.
공장의 벽면 화면은 라인 처리량, 온도, 경보 수를 보여 줍니다. MQTT 소스가 측정값이 도착하는 대로 해당 카드에 넣고, 스파크라인은 최근 몇 분을 보여 주며, 다크 테마는 밤에도 관제실을 차분하게 유지합니다. 인접한 타일의 게이지와 차트도 같은 테마를 따릅니다.
여러 역할이 사용하는 데스크톱 클라이언트에서 각 사용자는 중요한 타일을 위로 끌어 올리고, 가장 많이 보는 차트의 크기를 조절하고, 나머지는 숨깁니다. 레이아웃은 사용자별 JSON으로 저장되어 다음 로그인 때 복원되며, 업데이트로 추가된 새 타일은 빈 공간에 자연스럽게 배치됩니다.
The same API in Delphi, C++ Builder and C#: tiles on the grid, a KPI card with a sparkline in each, a dark theme and a saved layout. Dragging and layout files need the Registered edition.
Tiles on the 12 column grid with a KPI card in each, a dark theme, and the layout saved to a file. Dragging and layout files need the Registered edition.
uses
SysUtils, Controls, sgcUICore_Theme, sgcDashboard_KPI, sgcDashboard_VCL, sgcDashboard_KPI_VCL;
procedure AddKPI(aDash: TsgcVCLDashboard; const aName, aTitle, aValue,
aChange: string; aCol: Integer; aTrend: TsgcDashboardKPITrend);
var
oTile: TsgcVCLDashboardTile;
oCard: TsgcVCLKPICard;
begin
oTile := TsgcVCLDashboardTile.Create(aDash.Owner);
oTile.Name := aName;
oTile.Parent := aDash;
oTile.Col := aCol;
oTile.ColSpan := 4;
oTile.Title := aTitle;
oCard := TsgcVCLKPICard.Create(aDash.Owner);
oCard.Parent := oTile;
oCard.Align := alClient;
oCard.Value := aValue;
oCard.Trend := aTrend;
oCard.TrendValue := aChange;
oCard.AddValue(47);
oCard.AddValue(52);
end;
procedure BuildDashboard(aOwner: TWinControl);
var
oDash: TsgcVCLDashboard;
begin
oDash := TsgcVCLDashboard.Create(aOwner);
oDash.Parent := aOwner;
oDash.Align := alClient;
// drag, resize and layout files need the Registered edition
oDash.AllowDrag := True;
AddKPI(oDash, 'tileRevenue', 'Revenue', '12,480 USD', '+4.2 %', 0, ktUp);
AddKPI(oDash, 'tileOrders', 'Orders', '1,284', '+8.1 %', 4, ktUp);
oDash.Theme := utDark;
if FileExists('layout.json') then
oDash.LoadLayoutFromFile('layout.json');
oDash.SaveLayoutToFile('layout.json');
end;The same dashboard in C++ Builder with the generated headers.
#include <vcl.h>
#include "sgcUICore_Theme.hpp"
#include "sgcDashboard_KPI.hpp"
#include "sgcDashboard_VCL.hpp"
#include "sgcDashboard_KPI_VCL.hpp"
void AddKPI(TsgcVCLDashboard *aDash, const String aName, const String aTitle,
const String aValue, const String aChange, int aCol,
TsgcDashboardKPITrend aTrend)
{
TsgcVCLDashboardTile *oTile = new TsgcVCLDashboardTile(aDash->Owner);
oTile->Name = aName;
oTile->Parent = aDash;
oTile->Col = aCol;
oTile->ColSpan = 4;
oTile->Title = aTitle;
TsgcVCLKPICard *oCard = new TsgcVCLKPICard(aDash->Owner);
oCard->Parent = oTile;
oCard->Align = alClient;
oCard->Value = aValue;
oCard->Trend = aTrend;
oCard->TrendValue = aChange;
oCard->AddValue(47);
oCard->AddValue(52);
}
void BuildDashboard(TWinControl *aOwner)
{
TsgcVCLDashboard *oDash = new TsgcVCLDashboard(aOwner);
oDash->Parent = aOwner;
oDash->Align = alClient;
// drag, resize and layout files need the Registered edition
oDash->AllowDrag = true;
AddKPI(oDash, "tileRevenue", "Revenue", "12,480 USD", "+4.2 %", 0, ktUp);
AddKPI(oDash, "tileOrders", "Orders", "1,284", "+8.1 %", 4, ktUp);
oDash->Theme = utDark;
if (FileExists("layout.json"))
oDash->LoadLayoutFromFile("layout.json");
oDash->SaveLayoutToFile("layout.json");
}The WinForms version in C#, with the same class names as Delphi.
using System.Windows.Forms;
using esegece.sgcDashboard;
using esegece.sgcUICore;
public static class KpiDashboard
{
// One KPI tile with a sparkline, placed on the dashboard grid.
static void AddKPI(TsgcWinFormsDashboard aDash, string aName, string aTitle,
string aValue, string aChange, int aCol, TsgcDashboardKPITrend aTrend)
{
var oTile = new TsgcWinFormsDashboardTile();
oTile.Name = aName;
oTile.Title = aTitle;
oTile.Col = aCol;
oTile.ColSpan = 4;
var oCard = new TsgcWinFormsKPICard();
oCard.Dock = DockStyle.Fill;
oCard.Value = aValue;
oCard.Trend = aTrend;
oCard.TrendValue = aChange;
oCard.AddValue(47);
oCard.AddValue(52);
oTile.Controls.Add(oCard);
aDash.Controls.Add(oTile);
}
public static void Build(Form aForm)
{
var oDash = new TsgcWinFormsDashboard();
oDash.Dock = DockStyle.Fill;
oDash.Theme = TsgcUITheme.utDark;
oDash.AllowDrag = true; // drag and layout files: Registered edition
AddKPI(oDash, "tileRevenue", "Revenue", "12,480 USD", "+4.2 %", 0, TsgcDashboardKPITrend.ktUp);
AddKPI(oDash, "tileOrders", "Orders", "1,284", "+8.1 %", 4, TsgcDashboardKPITrend.ktUp);
AddKPI(oDash, "tileChurn", "Churn", "2.4 %", "-0.3 %", 8, TsgcDashboardKPITrend.ktDown);
aForm.Controls.Add(oDash);
if (System.IO.File.Exists("layout.json"))
oDash.LoadLayoutFromFile("layout.json");
oDash.SaveLayoutToFile("layout.json");
}
}dotnet add package esegece.sgcDashboard.WinFormsDelphi와 C++ Builder용 데모 4개와 .NET용 데모 6개가 컴파일된 데모 다운로드에 모두 들어 있습니다.
12열 그리드에 타일 6개와 KPI 카드 4개가 있고, 나머지 타일에는 로그와 목록이 있습니다. 레이아웃 엔진과 테마 전환을 가장 빠르게 확인할 수 있습니다.
sgcDashboardWS 브리지로 KPI 카드에 데이터를 공급하며, 메시지가 도착할 때마다 값이 바뀌고 스파크라인이 늘어납니다. sgcWebSockets가 필요합니다.
헤더로 타일을 드래그하고 그립으로 크기를 조절하며, 레이아웃을 JSON으로 저장하고, 데모를 다시 시작하여 복원되는 것을 확인합니다.
다른 sgcUI 제품의 차트, 지도, PDF 뷰어, 보고서 미리보기, KPI 카드를 하나의 테마가 적용된 대시보드에 담았습니다.
WinForms, WPF, Avalonia용 Basic, BasicWpf, BasicAvalonia, LiveKPI, SaveLayout, Suite.
sgcDashboard는 sgcUI Professional과 Enterprise에 포함되며 단독으로도 판매됩니다. 또한 All-Access 번들에도 포함되어 있습니다.
무료 Community 에디션(NuGet의 esegece.sgcDashboard.Community)에는 그리드, 타일, 스파크라인이 있는 KPI 카드, 헤드리스 PNG 및 SVG, 테마가 포함됩니다. 런타임 드래그와 크기 조절, SaveLayout과 LoadLayout, sgcDashboardWS 브리지는 포함되지 않습니다.
| 기능 | Community (무료) | Registered 에디션 |
|---|---|---|
| 스팬과 자동 배치가 있는 타일 그리드 | ✓ | ✓ |
| 추세와 스파크라인이 있는 KPI 카드 | ✓ | ✓ |
| 라이트 및 다크 테마 | ✓ | ✓ |
| PNG와 SVG로 출력하는 헤드리스 KPI 카드 | ✓ | ✓ |
| 타일의 런타임 드래그와 크기 조절 | − | ✓ |
| SaveLayout과 LoadLayout | − | ✓ |
| sgcDashboardWS 실시간 소스(WebSocket, MQTT, SSE) | − | ✓ |
| 컴포넌트 | 설명 |
|---|---|
| TsgcVCLDashboard, TsgcFMXDashboard | VCL과 FireMonkey용 그리드 컨테이너. |
| TsgcVCLDashboardTile, TsgcFMXDashboardTile | 제목이 있고 모든 컨트롤을 담을 수 있는 타일. |
| TsgcVCLKPICard, TsgcFMXKPICard | 추세, 바닥글, 스파크라인이 있는 KPI 카드. |
| TsgcDashboardKPI | PNG 및 SVG 내보내기를 지원하는 프레임워크 중립 헤드리스 KPI 카드. |
| TsgcDashboardLayout | Linux64에서도 사용할 수 있는 레이아웃 엔진. |
| TsgcDashboardSource_WebSocket, _MQTT, _SSE | sgcDashboardWS 브리지의 실시간 KPI 소스(Registered 에디션 전용). |
| 대상 | 컴포넌트 | 플랫폼 |
|---|---|---|
| Delphi 7부터 13, VCL | TsgcVCLDashboard | Win32 및 Win64 |
| Delphi XE6부터 13, FireMonkey | TsgcFMXDashboard | Windows, macOS, iOS, Android |
| C++ Builder 2007부터 13 | TsgcVCLDashboard, TsgcFMXDashboard | 생성된 .hpp 헤더와 정적 라이브러리 |
| Delphi 10.2부터 13, 프레임워크 중립 | TsgcDashboardLayout, TsgcDashboardKPI | Linux64, 레이아웃 엔진과 헤드리스 KPI 카드 |
| .NET Framework 4.7.2, .NET 8, 9, 10 | TsgcWinFormsDashboard와 WPF 및 Avalonia 대응 컴포넌트 | WinForms, WPF, Avalonia |
예, Registered 에디션에서 가능합니다. AllowDrag와 AllowResize로 사용자가 헤더로 타일을 옮기고 그립으로 크기를 조절할 수 있으며, SaveLayoutToFile 또는 SaveLayout이 결과를 JSON으로 저장합니다. LoadLayout은 타일 이름으로 복원하므로 애플리케이션의 새 버전에서도 레이아웃이 유지됩니다.
모든 컨트롤입니다. 타일은 컨테이너이므로 컨트롤의 부모를 타일로 지정하고 클라이언트 영역에 맞춰 정렬하세요. Suite 데모는 차트, 지도, PDF 뷰어, 보고서 미리보기를 담고 있으며, 타일 안의 sgcUI 컨트롤은 대시보드 테마를 따릅니다.
코드에서 Value를 설정하고 스레드에 안전한 AddValue를 호출합니다. Registered 에디션과 sgcWebSockets가 있으면 sgcDashboardWS 소스가 ValuePath로 각 WebSocket, MQTT, SSE 메시지에서 숫자를 읽어 카드와 추세를 자동으로 업데이트합니다.
대시보드와 타일, 자동 배치가 있는 그리드 레이아웃, 스파크라인이 있는 KPI 카드, 헤드리스 PNG 및 SVG, 테마입니다. 런타임 드래그와 크기 조절, SaveLayout과 LoadLayout, sgcDashboardWS 브리지는 포함되지 않습니다. 에디션을 참조하세요.
예. TsgcFMXDashboard, 타일, KPI 카드는 Delphi XE6부터 Windows, macOS, iOS, Android의 FireMonkey에서 VCL 대시보드와 같은 레이아웃 엔진으로 실행됩니다. 크기는 장치 독립적이며 폼 배율을 따릅니다.
예. TsgcDashboardKPI는 창, VCL, FireMonkey 없이 카드를 그리고 PNG 또는 SVG를 파일이나 스트림에 씁니다. Linux64를 포함한 모든 플랫폼에서 빌드되므로 서비스나 웹 서버가 이미지를 만들 수 있습니다.
예. 모든 크기는 장치 독립 픽셀입니다. VCL 대시보드는 모니터 PPI를 96으로 나눈 값으로, FireMonkey 대시보드는 폼 배율로 조정하므로 타일, 간격, 행 높이는 어떤 모니터에서도 비율을 유지합니다.