Gauge
TsgcHTMLComponent_Gauge — erzeugen Sie ein halbkreisförmiges SVG-Messgerät, das einen Wert relativ zu seinem Min und Max mit Niedrig-, Mittel- und Hoch-Farbschwellen darstellt, in Delphi, C++ Builder und .NET.
TsgcHTMLComponent_Gauge — erzeugen Sie ein halbkreisförmiges SVG-Messgerät, das einen Wert relativ zu seinem Min und Max mit Niedrig-, Mittel- und Hoch-Farbschwellen darstellt, in Delphi, C++ Builder und .NET.
Eine KPI-Komponente, die einen eigenständigen Inline-<svg>-Halbkreis ausgibt. Setzen Sie Wert, Bereich und Einheit und lesen Sie dann die HTML-Eigenschaft — die Bogenfarbe wechselt automatisch, sobald der Wert die Mittel- und Hoch-Schwellen überschreitet.
TsgcHTMLComponent_Gauge
Inline-<svg>-Halbkreis-Messgerät
Delphi, C++ Builder, .NET
Setzen Sie Value, MinValue und MaxValue, wählen Sie die Schwellen und lesen Sie dann HTML. Für ein einmaliges Messgerät verwenden Sie den statischen Build-Helfer.
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, "%");Die Member, die Sie am häufigsten verwenden.
Value, MinValue und MaxValue (alle Double) bestimmen, wie weit der Bogen gefüllt wird; der Wert wird automatisch auf den Bereich begrenzt.
Title wird unter dem Messgerät angezeigt und Unit_ neben dem Wert; Min und Max werden an den Enden des Bogens gezeichnet.
ThresholdMid und ThresholdHigh (Double) entscheiden, welche Farbe der Wertbogen verwendet, während der Messwert steigt.
ColorLowStyle, ColorMidStyle und ColorHighStyle (TsgcHTMLColor) setzen die Schwellenfarben; die Zeichenketten ColorLow/ColorMid/ColorHigh überschreiben mit einer wörtlichen CSS-Farbe. BackgroundArcColorStyle färbt die Bahn.
Width (px, Standard 200), ArcStrokeWidth, ValueFontSize, UnitFontSize, LabelFontSize und SvgViewBox passen das gerenderte SVG an.
HTML gibt das Inline-<svg>-Messgerät zurück. Das statische Build(aTitle, aValue, aMin, aMax, aUnit, aGaugeID) gibt dasselbe Markup in einem einzigen Aufruf zurück.
| Alle sgcHTML-KomponentenDurchsuchen Sie die vollständige Funktionsmatrix von über 60 Komponenten. | Öffnen | |
| Kostenlose Testversion herunterladenDie 30-Tage-Testversion enthält die 60.HTML-Demoprojekte. | Öffnen | |
| PreiseSingle-, Team- und Site-Lizenzen mit vollständigem Quellcode. | Öffnen |