public render()

in src/visualComponent/plotComponent.ts [94:226]


    public render(options: IVisualComponentRenderOptions): void {
        const {
            x,
            margin,
            groups: [firstGroup, secondGroup],
            viewport,
            settings: {
                xAxis,
                yAxis,
                secondaryYAxis,
            },
        } = options.data;

        if (!firstGroup && !secondGroup) {
            this.hide();

            return;
        }

        this.show();

        this.updateViewport(viewport);

        const reducedViewport: powerbi.IViewport = {
            height: viewport.height,
            width: Math.max(0, viewport.width - this.additionalWidthOffset),
        };

        this.xAxisComponent.preRender({
            additionalMargin: null,
            axis: x,
            margin: null,
            settings: xAxis,
            viewport: null,
        });

        this.yAxisComponent.preRender({
            axis: firstGroup && firstGroup.y,
            margin: null,
            settings: yAxis,
            viewport: null,
        });

        this.secondaryYAxisComponent.preRender({
            axis: secondGroup && secondGroup.y,
            margin: null,
            settings: secondaryYAxis,
            viewport: null,
        });

        const xAxisViewport: IVisualComponentViewport = this.xAxisComponent.getViewport();

        const maxYAxisHeight: number = Math.max(
            this.yAxisComponent.getViewport().height,
            this.secondaryYAxisComponent.getViewport().height,
        );

        const height: number = Math.max(
            0,
            reducedViewport.height - xAxisViewport.height - maxYAxisHeight,
        );

        this.yAxisComponent.render({
            axis: firstGroup && firstGroup.y,
            margin,
            settings: yAxis,
            viewport: {
                height,
                width: reducedViewport.width,
            },
        });

        this.secondaryYAxisComponent.render({
            axis: secondGroup && secondGroup.y,
            margin,
            settings: secondaryYAxis,
            viewport: {
                height,
                width: reducedViewport.width,
            },
        });

        const yAxisViewport: IVisualComponentViewport = this.yAxisComponent.getViewport();
        const secondaryYAxisViewport: IVisualComponentViewport = this.secondaryYAxisComponent.getViewport();

        const leftOffset: number = this.getOffset(xAxisViewport.width, yAxisViewport.width);
        const rightOffset: number = this.getOffset(xAxisViewport.width2, secondaryYAxisViewport.width);

        const width: number = Math.max(0,
            reducedViewport.width
            - yAxisViewport.width
            - secondaryYAxisViewport.width
            - leftOffset
            - rightOffset,
        );

        this.xAxisComponent.render({
            additionalMargin: {
                bottom: 0,
                left: yAxisViewport.width + leftOffset,
                right: 0,
                top: 0,
            },
            axis: x,
            margin,
            settings: xAxis,
            viewport: {
                height: reducedViewport.height,
                width,
            },
        });

        this.svgComponent.render({
            additionalMargin: {
                bottom: 0,
                left: leftOffset,
                right: 0,
                top: 0,
            },
            data: {
                ...options.data,
                margin,
                viewport: {
                    height,
                    width,
                },
            },
            xTicks: this.xAxisComponent.getTicks(),
            yTicks: this.yAxisComponent.getTicks(),

            secondaryYTicks: this.secondaryYAxisComponent.getTicks(),
        });
    }