in src/visualComponent/mainChart/chartLabelComponent.ts [71:139]
public render(options: IChartLabelComponentRenderOptions): void {
const {
series,
kpiSettings,
} = options;
this.updateFormatting(this.element, options.kpiSettings);
if (!series || !series.points) {
this.hide();
return;
} else {
this.show();
}
const value: number = series.current ? series.current.y : NaN;
this.renderGroup(
this.headerSelector,
[
{
color: kpiSettings.seriesNameColor,
data: series.name,
fontSizeInPt: kpiSettings.seriesNameFontSize,
isShown: kpiSettings.isSeriesNameShown,
},
],
);
const isVarianceValid: boolean = isValueValid(series.variance);
this.renderGroup(
this.bodySelector,
[
{
color: kpiSettings.valueColor,
data: getFormattedValueWithFallback(value, series.settings.values),
fontSizeInPt: kpiSettings.valueFontSize,
isShown: kpiSettings.isValueShown,
},
{
color: isVarianceValid
? kpiSettings.varianceColor
: kpiSettings.varianceNotAvailableColor,
data: `(${series.formattedVariance})`,
fontSizeInPt: isVarianceValid
? kpiSettings.varianceFontSize
: kpiSettings.varianceNotAvailableFontSize,
isShown: kpiSettings.isVarianceShown,
selector: isVarianceValid || !kpiSettings.autoAdjustFontSize
? undefined
: this.varianceNotAvailableSelector,
},
],
);
this.renderGroup(
this.footerSelector,
[
{
color: kpiSettings.dateColor,
data: `${series.dateDifference} days`,
fontSizeInPt: kpiSettings.dateFontSize,
isShown: kpiSettings.isDateShown,
},
],
);
}