Gauge
TsgcHTMLComponent_Gauge — Delphi, C++ Builder 및 .NET에서 최소 및 최대값 대비 값을 낮음, 중간 및 높음 색상 임계값으로 표시하는 반원형 SVG 게이지를 렌더링합니다.
TsgcHTMLComponent_Gauge — Delphi, C++ Builder 및 .NET에서 최소 및 최대값 대비 값을 낮음, 중간 및 높음 색상 임계값으로 표시하는 반원형 SVG 게이지를 렌더링합니다.
독립적인 인라인 <svg> 반원을 내보내는 KPI 컴포넌트입니다. 값, 범위 및 단위를 설정한 다음, HTML 속성을 읽습니다 — 값이 중간 및 높음 임계값을 넘으면 호 색상이 자동으로 전환됩니다.
Value, MinValue 및 MaxValue를 설정하고, 임계값을 선택한 다음, HTML을 읽습니다. 일회성 게이지에는 정적 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, "%");가장 자주 사용하게 되는 멤버.
Value, MinValue 및 MaxValue(모두 Double)는 호가 채워지는 정도를 정의합니다. 값은 자동으로 범위로 제한됩니다.
Title은 게이지 아래에 출력되고 Unit_은 값 옆에 출력됩니다. 최소와 최대는 호의 양 끝에 그려집니다.
ThresholdMid와 ThresholdHigh(Double)는 측정값이 올라감에 따라 값 호가 사용하는 색상을 결정합니다.
ColorLowStyle, ColorMidStyle 및 ColorHighStyle(TsgcHTMLColor)이 임계값 색상을 설정합니다. ColorLow/ColorMid/ColorHigh 문자열은 리터럴 CSS 색상으로 이를 재정의합니다. BackgroundArcColorStyle은 트랙에 색을 입힙니다.
Width(px, 기본값 200), ArcStrokeWidth, ValueFontSize, UnitFontSize, LabelFontSize 및 SvgViewBox가 렌더링된 SVG를 조정합니다.
HTML은 인라인 <svg> 게이지를 반환합니다. 정적 Build(aTitle, aValue, aMin, aMax, aUnit, aGaugeID)는 단일 호출로 동일한 마크업을 반환합니다.