Gauge
TsgcHTMLComponent_Gauge — renderizza un indicatore SVG semicircolare che traccia un valore rispetto al suo minimo e massimo con soglie di colore basso, medio e alto, in Delphi, C++ Builder e .NET.
TsgcHTMLComponent_Gauge — renderizza un indicatore SVG semicircolare che traccia un valore rispetto al suo minimo e massimo con soglie di colore basso, medio e alto, in Delphi, C++ Builder e .NET.
Un componente KPI che emette un semicerchio <svg> inline autonomo. Imposta il valore, l’intervallo e l’unità, quindi leggi la proprietà HTML — il colore dell’arco cambia automaticamente quando il valore supera le soglie media e alta.
TsgcHTMLComponent_Gauge
Inline <svg> semicircular gauge
Delphi, C++ Builder, .NET
Imposta Value, MinValue e MaxValue, scegli le soglie, quindi leggi HTML. Per un indicatore occasionale usa l’helper statico Build.
uses
sgcHTML_Enums, sgcHTML_Component_Gauge;
var
oGauge: TsgcHTMLComponent_Gauge;
begin
oGauge := TsgcHTMLComponent_Gauge.Create(nil);
try
oGauge.Title := 'CPU Load';
oGauge.Value := 72;
oGauge.MinValue := 0;
oGauge.MaxValue := 100;
oGauge.Unit_ := '%';
oGauge.ThresholdMid := 50;
oGauge.ThresholdHigh := 80;
oGauge.ColorLowStyle := hcSuccess;
oGauge.ColorMidStyle := hcWarning;
oGauge.ColorHighStyle := hcDanger;
WebModule.Response := oGauge.HTML; // inline <svg> semicircle
finally
oGauge.Free;
end;
end;
// Or one line with the static Build helper:
Result := TsgcHTMLComponent_Gauge.Build('CPU Load', 72, 0, 100, '%');// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Gauge.hpp
TsgcHTMLComponent_Gauge *oGauge = new TsgcHTMLComponent_Gauge(NULL);
try
{
oGauge->Title = "CPU Load";
oGauge->Value = 72;
oGauge->MinValue = 0;
oGauge->MaxValue = 100;
oGauge->Unit_ = "%";
oGauge->ThresholdMid = 50;
oGauge->ThresholdHigh = 80;
oGauge->ColorLowStyle = hcSuccess;
oGauge->ColorMidStyle = hcWarning;
oGauge->ColorHighStyle = hcDanger;
String html = oGauge->HTML; // inline <svg> semicircle
}
__finally
{
delete oGauge;
}
// Or one line with the static Build helper:
String html = TsgcHTMLComponent_Gauge::Build("CPU Load", 72, 0, 100, "%");using esegece.sgcWebSockets;
var gauge = new TsgcHTMLComponent_Gauge();
gauge.Title = "CPU Load";
gauge.Value = 72;
gauge.MinValue = 0;
gauge.MaxValue = 100;
gauge.Unit_ = "%";
gauge.ThresholdMid = 50;
gauge.ThresholdHigh = 80;
gauge.ColorLowStyle = TsgcHTMLColor.hcSuccess;
gauge.ColorMidStyle = TsgcHTMLColor.hcWarning;
gauge.ColorHighStyle = TsgcHTMLColor.hcDanger;
string html = gauge.HTML; // inline <svg> semicircle
// Or one line with the static Build helper:
string html = TsgcHTMLComponent_Gauge.Build("CPU Load", 72, 0, 100, "%");I membri che utilizzerai più spesso.
Value, MinValue e MaxValue (tutti Double) definiscono fino a dove si riempie l’arco; il valore viene limitato automaticamente all’intervallo.
Title viene stampato sotto l’indicatore e Unit_ accanto al valore; il minimo e il massimo sono disegnati alle estremità dell’arco.
ThresholdMid e ThresholdHigh (Double) decidono quale colore usa l’arco del valore man mano che la lettura cresce.
ColorLowStyle, ColorMidStyle e ColorHighStyle (TsgcHTMLColor) impostano i colori delle soglie; le stringhe ColorLow/ColorMid/ColorHigh li sovrascrivono con un colore CSS letterale. BackgroundArcColorStyle colora la traccia.
Width (px, predefinito 200), ArcStrokeWidth, ValueFontSize, UnitFontSize, LabelFontSize e SvgViewBox regolano l’SVG renderizzato.
HTML restituisce l’indicatore <svg> inline. Lo statico Build(aTitle, aValue, aMin, aMax, aUnit, aGaugeID) restituisce lo stesso markup con una singola chiamata.