public render()

in src/visualComponent/kpi/valueKPIComponent.ts [58:125]


    public render(options: IVisualComponentRenderOptions): void {
        const { series, settings, variance } = options.data;
        const captionDetailsKPIComponentOptions: ICaptionKPIComponentOptions = { ...options } as ICaptionKPIComponentOptions;

        let caption: string = "";
        let details: string = "";
        let title: string = "";

        if (options.data.series
            && options.data.series[0]
            && options.data.series[0].current
            && !isNaN(options.data.series[0].current.y)
        ) {
            const formatter: valueFormatter.IValueFormatter = valueFormatter.valueFormatter.create({
                displayUnitSystemType: displayUnitSystemType.DisplayUnitSystemType.WholeUnits,
                format: options.data.series[0].format || this.valueFormat,
                precision: settings.actualValueKPI.precision,
                value: settings.actualValueKPI.displayUnits || series[0].domain.max,
            });

            const value: number = options.data.series[0].current.y;

            title = `${value}`;
            caption = formatter.format(value);
            details = options.data.series[0].name;
        }

        const valueCaption: ICaptionKPIComponentOptionsValueSettings = {
            settings: settings.actualValueKPI,
            title: details || title,
            value: caption,
        };

        const labelCaption: ICaptionKPIComponentOptionsValueSettings = {
            settings: settings.actualLabelKPI,
            value: details,
        };

        captionDetailsKPIComponentOptions.captions = [
            [valueCaption],
            [labelCaption],
        ];

        const isVarianceKPIAvailable: boolean = series
            && series.length > 0
            && series[0]
            && series[0].current
            && !isNaN(series[0].current.kpiIndex);

        let currentAlign: AlignEnum = AlignEnum.alignCenter;

        if (!settings.dateLabelKPI.show && !settings.dateValueKPI.show) {
            currentAlign = AlignEnum.alignLeft;
        } else if (((!settings.kpiIndicatorValue.show || isNaN(variance[0]))
            && (!settings.kpiIndicatorLabel.isShown()
                || (isNaN(variance[0]) && series[0] && series[0].current && isNaN(series[0].current.kpiIndex))
            )
            && (!isVarianceKPIAvailable || !settings.kpiIndicator.show))
            && (!settings.secondKPIIndicatorValue.show && !settings.secondKPIIndicatorLabel.isShown()
                || isNaN(variance[1]))
        ) {
            currentAlign = AlignEnum.alignRight;
        }

        captionDetailsKPIComponentOptions.align = currentAlign;

        super.render(captionDetailsKPIComponentOptions);
    }