Legg til en målside i visualobjektet Power BI visualobjektet

En Power BI målsiden for visualobjektet gjør det mulig å vise informasjon Power BI visuelle kortet før det lastes med data. Her er noen eksempler på hva målsiden for et visualobjekt kan vise:

  • Tekst som forklarer hvordan du bruker visualobjektet
  • En kobling til nettstedet ditt
  • En kobling til en video

Et eksempel på en målside vises i følgende bilde:

skjermbilde av målside

Denne artikkelen forklarer hvordan du utformer en målside for visualiseringen. Målsiden vises når visualobjektet ikke har noen data.

Obs!

Utforming av Power BI og målside for visualobjekter støttes fra API-versjon 2.3.0. Hvis du vil finne ut hvilken versjon du bruker, kan du kjøre pbiviz -V kommandoen .

Opprette en målside

Bestemte funksjoner må angis i filen for å opprette en capabilities.json målside.

  • Aktiver for at målsiden skal supportsLandingPage fungere.
  • For at målsiden skal vises i visningsmodus eller for at visualobjektet skal være interaktivt, selv når det ikke er i datarollemodus,aktiverer du supportsEmptyDataView .
    {
        "supportsLandingPage": true,
        "supportsEmptyDataView": true,
    }

Eksempel på et visualobjekt med en målside

Følgende kode viser hvordan en målside kan legges til stolpediagram-visualobjekt.

export class BarChart implements IVisual {
    //...
    private element: HTMLElement;
    private isLandingPageOn: boolean;
    private LandingPageRemoved: boolean;
    private LandingPage: d3.Selection<any>;

    constructor(options: VisualConstructorOptions) {
            //...
            this.element = options.element;
            //...
    }

    public update(options: VisualUpdateOptions) {
    //...
        this.HandleLandingPage(options);
    }

    private HandleLandingPage(options: VisualUpdateOptions) {
        if(!options.dataViews || !options.dataViews.length) {
            if(!this.isLandingPageOn) {
                this.isLandingPageOn = true;
                const SampleLandingPage: Element = this.createSampleLandingPage(); //create a landing page
                this.element.appendChild(SampleLandingPage);
                this.LandingPage = d3.select(SampleLandingPage);
            }

        } else {
                if(this.isLandingPageOn && !this.LandingPageRemoved){
                    this.LandingPageRemoved = true;
                    this.LandingPage.remove();
                }
        }
    }

Neste trinn