Personalisieren der wichtigsten Insights-Präsentation

Die Persönliche Einblicke Showcase im Power BI Embedded Analytics Playground (Vorschau) verwendet die benutzerdefinierte Layout-API, damit Benutzer auswählen können, welche Visualisierungen und Layouts während ihrer Berichtsanzeigesitzung angezeigt werden sollen.

Eingebettete Power BI-benutzerdefinierte Berichtslayouts steuern die Größe, Position und Sichtbarkeit visueller Elemente auf einer Berichtsseite. Verwenden Sie benutzerdefinierte Layouts, um unterschiedliche Ansichten für unterschiedliche Benutzer darzustellen oder benutzern das Personalisieren eigener Ansichten zu ermöglichen. Benutzerdefinierte Layouts helfen Benutzern, sich auf ihre wichtigsten Visualisierungen und Einblicke zu konzentrieren.

Sie können auch benutzerdefinierte Layouts verwenden, um die Größe visueller Elemente zu ändern, wenn sich die Fenstergröße ändert, oder um verschiedene Layouts für Desktop-, Tablet- oder mobile Bildschirme darzustellen.

Benutzerdefinierte Layout-Showcase-Oberfläche

In der Persönliche Einblicke Showcases verwendet ein imaginäres Konglomerat namens Contoso einen eingebetteten Power BI-Bericht, um Geschäftsdaten ihren Projektbeteiligten anzuzeigen. Der eingebettete Bericht wird geladen, wobei alle neun verfügbaren Visualisierungen in einem zweispaltigen Layout angezeigt werden.

Visuelle Elemente auswählen

Wenn Sie nur die visuellen Elemente auswählen möchten, die sie am häufigsten anzeigen möchten, wählen Sie die Schaltfläche Visuelles auswählen aus. Das Auswahl visueller Elemente Dropdown-Listenfeld wird geöffnet, wobei alle neun verfügbaren visuellen Elemente ausgewählt sind.

Benutzer können die Kontrollkästchen neben den visuellen Elementen deaktivieren, die sie nicht sehen möchten. Nur die ausgewählten visuellen Elemente werden im Bericht für den Rest dieser Anzeigesitzung angezeigt.

Screenshot mit dem Dialogfeld

Wenn Sie Wählen Sie visuelle Elemente aus, wird das Dropdownfeld erneut geschlossen. Benutzer können Auswählen von visuellen Elementen erneut auswählen, um verschiedene visuelle Elemente oder alle neun visuellen Elemente auszuwählen.

Auswählen eines Layouts

Benutzer können auch Layout auswählen auswählen, um eine Palette von fünf verschiedenen Visualisierungslayoutoptionen auflisten zu können. Wenn Sie eine Layoutoption auswählen, wird das ausgewählte Layout angewendet und die Palette geschlossen.

Screenshot mit der Layoutpalette mit ausgewähltem und angewendetem dreispaltigen Layout.

Visuelle Und Layoutinteraktion

Die Visuelle Elemente auswählen und Layout auswählen Steuerelemente im Anwendungscode sind unabhängig, aber sie interagieren. Wenn beispielsweise nur ein visuelles Element angezeigt wird, zeigt das Einspaltenlayout das Visuelle mit einer größeren Größe als das dreispaltige Layout an.

Screenshot mit einem einzelnen visuellen Element in einem einspaltigen Layout.

Screenshot mit einem einzelnen visuellen Element in einem dreispaltigen Layout.

Benutzerdefinierter Layout-Showcase-Code

Der Code für die Implementierung der Showcase-Anwendung befindet sich im PowerBI-Embedded-Showcases GitHub-Repository.

  • Die Anwendung HTML-Code erstellt den Berichtscontainer, Schaltfläche Schaltfläche und Dropdownliste auswählen und Schaltfläche und Dropdownpalette auswählen Layout auswählen.

  • Der Bericht JavaScript bettet den Bericht ein, berechnet und konfiguriert die benutzerdefinierten Layoutobjekte und implementiert die standard- und personalisierten benutzerdefinierten Layouts.

Zum Erstellen eines benutzerdefinierten Berichtslayouts übergeben Sie ein benutzerdefiniertes Layoutobjekt an die settings Eigenschaft des Berichts Einbettungskonfiguration. Um benutzerdefinierte Layouts zu aktivieren, verwendet der Bericht JavaScript die layoutType-Eigenschaft mit dem Wert models.LayoutType.Custom.

Das customLayout-Objekt gibt die Seitengröße des Berichtsbereichs, die Canvasskalierung und das Seitenlayout an. Seitenlayouts geben ein standardmäßiges visuelles Layout für den Bericht und visuelle Layouts für jedes visuelle Element an.

let settings = {
    ...
    layoutType: models.LayoutType.Custom,
    customLayout: {
        pageSize: {
            type: models.PageSizeType.Custom,
            width: reportWidth - 10,
            height: reportHeight - 20
        },
        displayOption: models.DisplayOption.FitToPage,
        pagesLayout: pagesLayout
    }
};

Um ausgewählte Visualisierungen und Layouts anzuzeigen, erstellt das Showcase-JavaScript dynamisch das settings-Objekt und aktualisiert die Einbettungskonfiguration. Der Bericht wird geladen, wobei die ausgewählten visuellen Elemente angezeigt werden und das benutzerdefinierte Layout implementiert ist.