Sdílet prostřednictvím


Vykreslování událostí ve vizuálech Power BI

Aby bylo možné vizuál certifikovat, musí obsahovat události vykreslování. Tyto události umožňují naslouchacím procesům (především export do PDF a exportu do PowerPointu) zjistit, kdy se vizuál vykresluje a kdy je připravený k exportu.

Důležité

Každý vizuál, který exportuje data (například do powerpointového nebo .pdf souboru), musí obsahovat události vykreslování, aby se zajistilo, že export nezačne před dokončením vykreslování vizuálu.

Rozhraní API událostí vykreslování se skládá ze tří metod, které by se měly volat při vykreslování:

  • renderingStarted: Kód vizuálu Power BI volá metodu renderingStarted , která označuje, že proces vykreslování byl spuštěn. Tato metoda by měla být vždy prvním řádkem metody aktualizace, protože to je místo, kde proces vykreslování začíná.

  • renderingFinished: Po úspěšném dokončení vykreslování kód vizuálu Power BI volá metodu renderingFinished , která upozorní naslouchací procesy, že je obrázek vizuálu připravený k exportu. Tato metoda by měla být posledním řádkem kódu, který se spustí při aktualizaci vizuálu. Obvykle je to ale ne vždy poslední řádek metody aktualizace.

  • renderingFailed: Pokud během procesu vykreslování dojde k problému, vizuál Power BI se úspěšně nevykreslí. Pokud chcete naslouchacím procesům oznámit, že proces vykreslování nebyl dokončen, měl by kód vizuálu Power BI volat metodu renderingFailed . Tato metoda také poskytuje volitelný řetězec pro poskytnutí důvodu selhání.

Poznámka:

Vykreslování událostí je požadavkem na certifikaci vizuálů. Bez nich nebude váš vizuál schválen Partnerským centrem pro publikování. Další informace najdete v požadavcích na certifikaci.

Jak používat rozhraní API pro vykreslování událostí

Pokud chcete volat metody vykreslování, musíte je nejprve importovat z IVisualEventService.

  1. Do souboru vložte visual.ts řádek:

    import IVisualEventService = powerbi.extensibility.IVisualEventService;
    
  2. IVisual Do třídy patří řádek:

    private events: IVisualEventService;
    
  3. constructor V metodě IVisual třídy

    this.events = options.host.eventService;
    

Nyní můžete volat metody , a tam, kde je to vhodné v metodě aktualizace.this.events.renderingFailed(options); this.events.renderingFinished(options);this.events.renderingStarted(options);

Příklad 1: Vizuál bez animací

Tady je příklad jednoduchého vizuálu, který používá rozhraní API událostí vykreslování.

    export class Visual implements IVisual {
        ...
        private events: IVisualEventService;
        ...

        constructor(options: VisualConstructorOptions) {
            ...
            this.events = options.host.eventService;
            ...
        }

        public update(options: VisualUpdateOptions) {
            this.events.renderingStarted(options);
            ...
            this.events.renderingFinished(options);
        }

Příklad 2: Vizuál s animacemi

Pokud vizuál obsahuje animace nebo asynchronní funkce pro vykreslování, renderingFinished měla by se metoda volat za animací nebo uvnitř asynchronní funkce, i když není posledním řádkem metody update .

    export class Visual implements IVisual {
        ...
        private events: IVisualEventService;
        private element: HTMLElement;
        ...

        constructor(options: VisualConstructorOptions) {
            ...
            this.events = options.host.eventService;
            this.element = options.element;
            ...
        }

        public update(options: VisualUpdateOptions) {
            this.events.renderingStarted(options);
            ...
            // Learn more at https://github.com/d3/d3-transition/blob/master/README.md#transition_end
            d3.select(this.element).transition().duration(100).style("opacity","0").end().then(() => {
                // renderingFinished called after transition end
                this.events.renderingFinished(options);
            });
        }