widgets/implementations/info-gauge/radial-gauge/radial-gauge.component.ts
OnChanges
OnDestroy
AfterViewInit
host | { |
providers |
MeasurementRealtimeService
RadialGaugeService
{ provide: NGX_ECHARTS_CONFIG, useFactory: () => ({ echarts: () => import() }) }
|
selector | c8y-radial-gauge |
standalone | true |
imports |
AsyncPipe
NgxEchartsModule
|
templateUrl | ./radial-gauge.component.html |
Properties |
Methods |
Inputs |
constructor()
|
activeDatapointGauge |
Type : KPIDetails
|
fractionSize |
Type : number
|
Default value : 2
|
gaugeOptions |
Type : GaugeOptions
|
measurement |
Type : IMeasurementValue
|
selectedPresetId |
Type : string
|
Default value : ''
|
ngAfterViewInit |
ngAfterViewInit()
|
Returns :
void
|
ngOnChanges | ||||||
ngOnChanges(changes: SimpleChanges)
|
||||||
Parameters :
Returns :
void
|
ngOnDestroy |
ngOnDestroy()
|
Returns :
void
|
ngOnInit |
ngOnInit()
|
Returns :
void
|
onChartInit | ||||||
onChartInit(ec: ECharts)
|
||||||
Parameters :
Returns :
void
|
chart |
Type : ElementRef
|
Decorators :
@ViewChild('chart', {static: false})
|
chartOptions$ |
Type : Observable<GaugeOptions>
|
echartsInstance |
Type : ECharts
|
gaugeOptionsColors |
Type : GaugeOptionsColors
|
rangeColors |
Type : object
|
Default value : { default: '#E8EBED', yellow: '#ff8800', red: '#d70f0f' }
|
<div
class="p-absolute fit-w fit-h"
data-cy="c8y-radial-gauge--chart"
#chart
echarts
[options]="chartOptions$ | async"
(chartInit)="onChartInit($event)"
></div>