TreeMap
TsgcHTMLComponent_TreeMap — render a squarified treemap as a self-contained, server-generated inline SVG, no charting library required, in Delphi, C++ Builder and .NET.
TsgcHTMLComponent_TreeMap — render a squarified treemap as a self-contained, server-generated inline SVG, no charting library required, in Delphi, C++ Builder and .NET.
Add items with a label and a value (or bind a dataset), pick a colour scheme, then read the HTML property.
TsgcHTMLComponent_TreeMap
Self-contained inline SVG, squarified layout
Delphi, C++ Builder, .NET
Call AddItem for each rectangle, choose a ColorScheme, then read HTML. The layout is computed server-side and needs no client-side library.
uses
sgcHTML_Component_TreeMap;
var
oTreeMap: TsgcHTMLComponent_TreeMap;
begin
oTreeMap := TsgcHTMLComponent_TreeMap.Create(nil);
try
oTreeMap.Width := 640;
oTreeMap.Height := 360;
oTreeMap.ColorScheme := tmCool;
oTreeMap.ShowValues := True;
oTreeMap.AddItem('Engineering', 420000);
oTreeMap.AddItem('Sales', 260000);
oTreeMap.AddItem('Marketing', 140000);
oTreeMap.AddItem('Support', 90000, '#20c997'); // explicit colour overrides the scheme
WebModule.Response := oTreeMap.HTML; // <svg> squarified rectangles, no client-side library
finally
oTreeMap.Free;
end;
end;
// Or bind it straight to a dataset:
oTreeMap.LoadFromDataSet(qryBudget, 'Department', 'Amount');
// One-shot helper, no instance to manage:
Response := TsgcHTMLComponent_TreeMap.Build(['Engineering', 'Sales'], [420000, 260000]);// includes: sgcHTML_Component_TreeMap.hpp
TsgcHTMLComponent_TreeMap *oTreeMap = new TsgcHTMLComponent_TreeMap(NULL);
try
{
oTreeMap->Width = 640;
oTreeMap->Height = 360;
oTreeMap->ColorScheme = tmCool;
oTreeMap->ShowValues = true;
oTreeMap->AddItem("Engineering", 420000);
oTreeMap->AddItem("Sales", 260000);
oTreeMap->AddItem("Marketing", 140000);
oTreeMap->AddItem("Support", 90000, "#20c997"); // explicit colour overrides the scheme
String html = oTreeMap->HTML; // <svg> squarified rectangles, no client-side library
}
__finally
{
delete oTreeMap;
}using esegece.sgcWebSockets;
var treeMap = new TsgcHTMLComponent_TreeMap();
treeMap.Width = 640;
treeMap.Height = 360;
treeMap.ColorScheme = TsgcHTMLTreeMapScheme.tmCool;
treeMap.ShowValues = true;
treeMap.AddItem("Engineering", 420000);
treeMap.AddItem("Sales", 260000);
treeMap.AddItem("Marketing", 140000);
treeMap.AddItem("Support", 90000, "#20c997"); // explicit colour overrides the scheme
string html = treeMap.HTML; // <svg> squarified rectangles, no client-side library
// One-shot helper, no instance to manage:
string quick = TsgcHTMLComponent_TreeMap.Build(new[] { "Engineering", "Sales" }, new[] { 420000d, 260000d });The members you reach for most often.
AddItem(aLabel, aValue, aColor) appends a leaf rectangle; an explicit aColor overrides the active ColorScheme.
Items support a two-level treemap: set ID / ParentID on parent and child items to nest child rectangles inside their faded parent.
LoadFromDataSet(aDataSet, aLabelField, aValueField) loads one flat item per row.
The class function Build(aLabels, aValues) renders a flat treemap straight to a string, with no component instance to manage.
Width, Height, Padding and ColorScheme (default/blue/green/warm/cool/gray) control the canvas and the auto-assigned rectangle colours.
ShowLabels, ShowValues, MinLabelSize and FontSize decide when and how a rectangle's caption is drawn; HTML returns the finished inline <svg>.
| Online HelpFull API reference and usage guide for this component. | Open | |
| All sgcHTML ComponentsBrowse the full feature matrix of 80+ components. | Open | |
| Download Free TrialThe 30-day trial ships the 60.HTML demo projects. | Open | |
| PricingSingle, Team and Site licenses with full source code. | Open |