Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

Passen Sie das Erscheinungsbild QuickSight eingebetteter Dashboards und Grafiken an

Sie können Amazon QuickSight Embedding SDK (Version 2.5.0 und höher) verwenden, um zur Laufzeit Änderungen am Design Ihrer eingebetteten QuickSight Dashboards und Grafiken vorzunehmen. Runtime-Theming erleichtert die Integration Ihrer SaaS-Anwendung (Software as a Service) in Ihre QuickSight eingebetteten Amazon-Ressourcen. Mit Runtime-Theming können Sie das Design Ihrer eingebetteten Inhalte mit den Themen der übergeordneten Anwendung synchronisieren, in die Ihre QuickSight Assets eingebettet sind. Sie können Runtime-Theming auch verwenden, um Anpassungsoptionen für Leser hinzuzufügen. Änderungen am Design können bei der Initialisierung oder während der gesamten Lebensdauer Ihres eingebetteten Dashboards oder Visuals auf eingebettete Assets angewendet werden.

Weitere Informationen zu Designs finden Sie unter. Themes in Amazon verwenden QuickSight Weitere Informationen zur Verwendung der QuickSight Einbettung SDK finden Sie amazon-quicksight-embedding-sdkunter GitHub.

Voraussetzungen

Bevor Sie beginnen können, stellen Sie sicher, dass Sie die folgenden Voraussetzungen erfüllen.

Terminologie und Konzepte

Die folgende Terminologie kann bei der Arbeit mit eingebettetem Runtime-Theming nützlich sein.

Einrichtung

Stellen Sie sicher, dass Sie die folgenden Informationen bereit haben, um mit der Arbeit mit Runtime-Theming zu beginnen.

SDKMethodenschnittstelle

Setter-Methoden

In der folgenden Tabelle werden verschiedene Setter-Methoden beschrieben, die Entwickler für das Runtime-Theming verwenden können.

Initialisierung eingebetteter Inhalte mit einem Design

Um ein eingebettetes Dashboard oder eine eingebettete Grafik mit einem nicht standardmäßigen Design zu initialisieren, definieren Sie ein themeOptions Objekt in den VisualContentOptions Parametern DashboardContentOptions oder und legen Sie die darin enthaltene themeArn themeOptions Eigenschaft auf das gewünschte Design fest. ARN

Im folgenden Beispiel wird ein eingebettetes Dashboard mit dem Design initialisiert. MIDNIGHT

import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk';

const embeddingContext = await createEmbeddingContext();

const {
    embedDashboard,
} = embeddingContext;

const frameOptions = {
    url: '<YOUR_EMBED_URL>',
    container: '#experience-container',
};
const contentOptions = {
    themeOptions: {
        themeArn: "arn:aws:quicksight::aws:theme/MIDNIGHT"
    }
};

// Embedding a dashboard experience
const embeddedDashboardExperience = await embedDashboard(frameOptions, contentOptions);

Initialisierung eingebetteter Inhalte mit einem Theme-Override

Entwickler können Theme-Overrides verwenden, um das Design eines eingebetteten Dashboards oder Visuals zur Laufzeit zu definieren. Auf diese Weise kann das Dashboard oder das Visual ein Theme von einer Drittanbieteranwendung übernehmen, ohne dass ein Theme darin vorkonfiguriert werden muss. QuickSight Um ein eingebettetes Dashboard oder eine Grafik mit einem Theme-Override zu initialisieren, legen Sie die themeOverride Eigenschaft entweder themeOptions in den DashboardContentOptions Parametern oder fest. VisualContentOptions Im folgenden Beispiel wird die Schriftart eines Dashboard-Designs von der Standardschrift auf überschrieben. Amazon Ember

import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk';

const embeddingContext = await createEmbeddingContext();

const {
    embedDashboard,
} = embeddingContext;

const frameOptions = {
    url: '<YOUR_EMBED_URL>',
    container: '#experience-container',
};
const contentOptions = {
    themeOptions: {
        "themeOverride":{"Typography":{"FontFamilies":[{"FontFamily":"Comic Neue"}]}}
    }
};

// Embedding a dashboard experience
const embeddedDashboardExperience = await embedDashboard(frameOptions, contentOptions);

Initialisierung eingebetteter Inhalte mit vorinstallierten Designs

Entwickler können eine Reihe von Dashboard-Designs so konfigurieren, dass sie bei der Initialisierung vorinstalliert werden. Dies ist besonders nützlich, wenn Sie schnell zwischen verschiedenen Ansichten wechseln möchten, z. B. im Dunkel- und im Hellmodus. Ein eingebettetes Dashboard oder eine eingebettete Grafik kann mit bis zu 5 vorinstallierten Designs initialisiert werden. Um vorinstallierte Designs zu verwenden, legen Sie die preloadThemes Eigenschaft entweder auf DashboardContentOptions oder VisualContentOptions mit einem Array von bis zu 5 Designs fest. themeArns Im folgenden Beispiel werden die Designs Midnight und Rainier Starter-Themen vorab in ein Dashboard geladen.

import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk';

const embeddingContext = await createEmbeddingContext();

const {
    embedDashboard,
} = embeddingContext;

const frameOptions = {
    url: '<YOUR_EMBED_URL>',
    container: '#experience-container',
};
const contentOptions = {
    themeOptions: {
        "preloadThemes": ["arn:aws:quicksight::aws:theme/RAINIER", "arn:aws:quicksight::aws:theme/MIDNIGHT"]
    }
};

// Embedding a dashboard experience
const embeddedDashboardExperience = await embedDashboard(frameOptions, contentOptions);