Componente TreeMap — sgcHTML | eSeGeCe

TreeMap

TsgcHTMLComponent_TreeMap — renderize um treemap squarified como um SVG inline autocontido, gerado no servidor, sem necessidade de biblioteca de gráficos, em Delphi, C++ Builder e .NET.

Visão geral

TsgcHTMLComponent_TreeMap

Adicione itens com um rótulo e um valor (ou vincule um dataset), escolha um esquema de cores e então leia a propriedade HTML.

Classe do componente

TsgcHTMLComponent_TreeMap

Renderiza

SVG inline autocontido, layout squarified

Família

Gráficos & Visualização

Linguagens

Delphi, C++ Builder, .NET

QuickStart

Adicione itens, renderize

Chame AddItem para cada retângulo, escolha um ColorScheme e então leia HTML. O layout é calculado no servidor e não precisa de nenhuma biblioteca no lado do cliente.

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 });

Referência

Principais propriedades & métodos

Os membros que você usa com mais frequência.

Itens / AddItem

AddItem(aLabel, aValue, aColor) adiciona um retângulo folha; um aColor explícito sobrepõe o ColorScheme ativo.

Hierarquia

Items suporta um treemap de dois níveis: defina ID / ParentID nos itens pai e filho para aninhar os retângulos filhos dentro do seu pai esmaecido.

Vinculação a dataset

LoadFromDataSet(aDataSet, aLabelField, aValueField) carrega um item plano por linha.

Helper de uso único

A função de classe Build(aLabels, aValues) renderiza um treemap plano diretamente em uma string, sem instância de componente a gerenciar.

Dimensões & paleta

Width, Height, Padding e ColorScheme (default/blue/green/warm/cool/gray) controlam a área de desenho e as cores atribuídas automaticamente aos retângulos.

Rótulos

ShowLabels, ShowValues, MinLabelSize e FontSize decidem quando e como a legenda de um retângulo é desenhada; HTML retorna o <svg> inline finalizado.

Recursos

Continue explorando

	Ajuda onlineReferência completa da API e guia de uso para este componente.	Abrir
	Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 80 componentes.	Abrir
	Baixar Versão de Avaliação GratuitaA avaliação de 30 dias inclui os projetos de demonstração 60.HTML.	Abrir
	PreçosLicenças Single, Team e Site com código-fonte completo.	Abrir