Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà. # Incorporamento di risorse Amazon Quick Sight personalizzate nella tua applicazione Puoi utilizzare l'analisi integrata di Amazon Quick Sight per incorporare nella tua applicazione risorse Amazon Quick Sight personalizzate per soddisfare le tue esigenze aziendali. Per quanto riguarda le dashboard e gli elementi visivi incorporati, gli autori di Amazon Quick Sight possono aggiungere filtri e approfondimenti a cui i lettori possono accedere mentre navigano nella dashboard o nell'immagine. Gli sviluppatori di Amazon Quick Sight possono anche utilizzare Amazon Quick Sight SDKs per creare integrazioni più strette tra le loro applicazioni SaaS e le risorse integrate di Amazon Quick Sight per aggiungere azioni di callback dei datapoint alle immagini su una dashboard in fase di esecuzione. Per ulteriori informazioni su Amazon Quick Sight SDKs, consulta `amazon-quicksight-embedding-sdk` on [GitHub](https://github.com/awslabs/amazon-quicksight-embedding-sdk)o [NPM](https://www.npmjs.com/package/amazon-quicksight-embedding-sdk). Di seguito, puoi trovare le descrizioni su come utilizzare Amazon Quick Sight SDKs per personalizzare le analisi integrate di Amazon Quick Sight. **Topics** + [Aggiungere azioni di callback incorporate in fase di esecuzione in Amazon Quick Sight](embedding-custom-actions-callback.md) + [Filtraggio dei dati in fase di esecuzione per pannelli di controllo e immagini integrati di Amazon Quick Sight](embedding-runtime-filtering.md) + [Personalizza l'aspetto dei pannelli di controllo e degli elementi visivi incorporati di Amazon Quick Sight](embedding-runtime-theming.md) + [Utilizzo dell'SDK Amazon Quick Sight Embedding per abilitare collegamenti condivisibili a visualizzazioni di dashboard integrate](embedded-view-sharing.md) # Aggiungere azioni di callback incorporate in fase di esecuzione in Amazon Quick Sight Usa le azioni di callback integrate nei datapoint per creare integrazioni più strette tra la tua applicazione SaaS (Software as a Service) e i pannelli visivi e i pannelli di controllo incorporati di Amazon Quick Sight. Gli sviluppatori possono registrare punti dati da richiamare con l'SDK di incorporamento Amazon Quick Sight. Quando si registra un'azione di callback per un elemento visivo, i lettori possono selezionare un punto dati sull'elemento per ricevere una callback che fornisce dati specifici per il punto dati selezionato. Queste informazioni possono essere utilizzate per contrassegnare i record chiave, compilare dati non elaborati specifici del punto dati, acquisire record e compilare dati per i processi di back-end. Le callback incorporate non sono supportate per contenuti visivi, caselle di testo o approfondimenti personalizzati. Prima di iniziare a registrare i punti dati per la callback, aggiorna l'SDK di incorporamento alla versione 2.3.0. Per ulteriori informazioni sull'utilizzo di Amazon Quick Sight Embedding SDK, consulta la [amazon-quicksight-embedding-sdk](https://github.com/awslabs/amazon-quicksight-embedding-sdk)pagina. GitHub Un callback datapoint può essere registrato su uno o più elementi visivi in fase di esecuzione tramite Amazon Quick Sight SDK. Puoi anche registrare un callback datapoint per qualsiasi interazione supportata dalla struttura dell'API. [VisualCustomAction](https://docs.aws.amazon.com/quicksight/latest/APIReference/API_VisualCustomAction.html) Ciò consente alla callback di punti dati di iniziare quando l'utente seleziona il punto dati sull'elemento visivo o quando il punto dati viene selezionato dal relativo menu contestuale. L'esempio seguente registra una callback di punti dati che il lettore avvia quando seleziona un punto dati sull'elemento visivo. ``` /const MY_GET_EMBED_URL_ENDPOINT = "https://my.api.endpoint.domain/MyGetEmbedUrlApi"; // Sample URL // The dashboard id to embed const MY_DASHBOARD_ID = "my-dashboard"; // Sample ID // The container element in your page that will have the embedded dashboard const MY_DASHBOARD_CONTAINER = "#experience-container"; // Sample ID // SOME HELPERS const ActionTrigger = { DATA_POINT_CLICK: "DATA_POINT_CLICK", DATA_POINT_MENU: "DATA_POINT_MENU", }; const ActionStatus = { ENABLED: "ENABLED", DISABLED: "DISABLED", }; // This function makes a request to your endpoint to obtain an embed url for a given dashboard id // The example implementation below assumes the endpoint takes dashboardId as request data // and returns an object with EmbedUrl property const myGetEmbedUrl = async (dashboardId) => { const apiOptions = { dashboardId, }; const apiUrl = new URL(MY_GET_EMBED_URL_ENDPOINT); apiUrl.search = new URLSearchParams(apiOptions).toString(); const apiResponse = await fetch(apiUrl.toString()); const apiResponseData = await apiResponse.json(); return apiResponseData.EmbedUrl; }; // This function constructs a custom action object const myConstructCustomActionModel = ( customActionId, actionName, actionTrigger, actionStatus ) => { return { Name: actionName, CustomActionId: customActionId, Status: actionStatus, Trigger: actionTrigger, ActionOperations: [ { CallbackOperation: { EmbeddingMessage: {}, }, }, ], }; }; // This function adds a custom action on the first visual of first sheet of the embedded dashboard const myAddVisualActionOnFirstVisualOfFirstSheet = async ( embeddedDashboard ) => { // 1. List the sheets on the dashboard const { SheetId } = (await embeddedDashboard.getSheets())[0]; // If you'd like to add action on the current sheet instead, you can use getSelectedSheetId method // const SheetId = await embeddedDashboard.getSelectedSheetId(); // 2. List the visuals on the specified sheet const { VisualId } = (await embeddedDashboard.getSheetVisuals(SheetId))[0]; // 3. Add the custom action to the visual try { const customActionId = "custom_action_id"; // Sample ID const actionName = "Flag record"; // Sample name const actionTrigger = ActionTrigger.DATA_POINT_CLICK; // or ActionTrigger.DATA_POINT_MENU const actionStatus = ActionStatus.ENABLED; const myCustomAction = myConstructCustomActionModel( customActionId, actionName, actionTrigger, actionStatus ); const response = await embeddedDashboard.addVisualActions( SheetId, VisualId, [myCustomAction] ); if (!response.success) { console.log("Adding visual action failed", response.errorCode); } } catch (error) { console.log("Adding visual action failed", error); } }; const parseDatapoint = (visualId, datapoint) => { datapoint.Columns.forEach((Column, index) => { // FIELD | METRIC const columnType = Object.keys(Column)[0]; // STRING | DATE | INTEGER | DECIMAL const valueType = Object.keys(Column[columnType])[0]; const { Column: columnMetadata } = Column[columnType][valueType]; const value = datapoint.RawValues[index][valueType]; const formattedValue = datapoint.FormattedValues[index]; console.log( `Column: ${columnMetadata.ColumnName} has a raw value of ${value} and formatted value of ${formattedValue.Value} for visual: ${visualId}` ); }); }; // This function is used to start a custom workflow after the end user selects a datapoint const myCustomDatapointCallbackWorkflow = (callbackData) => { const { VisualId, Datapoints } = callbackData; parseDatapoint(VisualId, Datapoints); }; // EMBEDDING THE DASHBOARD const main = async () => { // 1. Get embed url let url; try { url = await myGetEmbedUrl(MY_DASHBOARD_ID); } catch (error) { console.log("Obtaining an embed url failed"); } if (!url) { return; } // 2. Create embedding context const embeddingContext = await createEmbeddingContext(); // 3. Embed the dashboard const embeddedDashboard = await embeddingContext.embedDashboard( { url, container: MY_DASHBOARD_CONTAINER, width: "1200px", height: "300px", resizeHeightOnSizeChangedEvent: true, }, { onMessage: async (messageEvent) => { const { eventName, message } = messageEvent; switch (eventName) { case "CONTENT_LOADED": { await myAddVisualActionOnFirstVisualOfFirstSheet(embeddedDashboard); break; } case "CALLBACK_OPERATION_INVOKED": { myCustomDatapointCallbackWorkflow(message); break; } } }, } ); }; main().catch(console.error); ``` È inoltre possibile configurare l'esempio precedente per avviare la callback di punti dati quando l'utente apre il menu contestuale. Per l'esempio precedente, imposta il valore di `actionTrigger` su `ActionTrigger.DATA_POINT_MENU`. Una volta registrata la callback di punti dati viene applicata alla maggior parte dei punti dati sugli elementi visivi specificati. Le callback non si applicano ai totali o ai subtotali degli elementi visivi. Quando un lettore interagisce con un datapoint, viene `CALLBACK_OPERATION_INVOKED` inviato un messaggio all'SDK di incorporamento di Amazon Quick Sight. Questo messaggio viene acquisito dal gestore `onMessage`. Il messaggio contiene i valori non elaborati e visualizzati per l'intera riga di dati associata al punto dati selezionato. Contiene anche i metadati delle colonne per tutte le colonne dell'elemento visivo in cui è contenuto il punto dati. Di seguito è illustrato un esempio di messaggio `CALLBACK_OPERATION_INVOKED`. ``` { CustomActionId: "custom_action_id", DashboardId: "dashboard_id", SheetId: "sheet_id", VisualId: "visual_id", DataPoints: [ { RawValues: [ { String: "Texas" // 1st raw value in row }, { Integer: 1000 // 2nd raw value in row } ], FormattedValues: [ {Value: "Texas"}, // 1st formatted value in row {Value: "1,000"} // 2nd formatted value in row ], Columns: [ { // 1st column metadata Dimension: { String: { Column: { ColumnName: "State", DatsetIdentifier: "..." } } } }, { // 2nd column metadata Measure: { Integer: { Column: { ColumnName: "Cancelled", DatsetIdentifier: "..." }, AggregationFunction: { SimpleNumericalAggregation: "SUM" } } } } ] } ] } ``` # Filtraggio dei dati in fase di esecuzione per pannelli di controllo e immagini integrati di Amazon Quick Sight Puoi utilizzare i metodi di filtro nell'SDK di incorporamento Amazon Quick Sight per sfruttare la potenza dei filtri Amazon Quick Sight all'interno della tua applicazione Software as a Service (SaaS) in fase di esecuzione. I filtri di runtime consentono agli imprenditori di integrare la propria applicazione con i pannelli di controllo e gli elementi visivi incorporati di Amazon Quick Sight. A tale scopo, crea controlli di filtro personalizzati nell'applicazione e applicate filtri preimpostati in base ai dati dell'applicazione. Quindi, gli sviluppatori possono personalizzare le configurazioni dei filtri per gli utenti finali durante il runtime. Gli sviluppatori possono creare, interrogare, aggiornare e rimuovere i filtri Amazon Quick Sight su un pannello di controllo o un elemento visivo incorporato dalla loro applicazione con Amazon Quick Sight Embedding SDK. Crea oggetti filtro Amazon Quick Sight nella tua applicazione con il modello di [FilterGroup](https://docs.aws.amazon.com/quicksight/latest/APIReference/API_FilterGroup.html)dati e applicali a dashboard e immagini incorporate utilizzando i metodi di filtro. Per ulteriori informazioni sull'utilizzo di Amazon Quick Sight Embedding SDK, consulta la [amazon-quicksight-embedding-sdk](https://github.com/awslabs/amazon-quicksight-embedding-sdk)pagina. GitHub **Prerequisiti** Prima di iniziare, assicurati di utilizzare Amazon Quick Sight Embedding SDK versione 2.5.0 o successiva. ## Concetti e terminologia La seguente terminologia può essere utile quando lavori con il filtro di runtime incorporato. + *Gruppo di filtri*: un gruppo di filtri individuali. I filtri che si trovano all'interno di un `FilterGroup` vengono introdotti da un operatore OR l'uno con l'altro. I filtri all'interno di a [FilterGroup](https://docs.aws.amazon.com/quicksight/latest/APIReference/API_FilterGroup.html)vengono applicati agli stessi fogli o immagini. + *Filtro*: un singolo filtro. Il filtro può essere di tipo di filtro di categoria, numerico o data/ora. Per ulteriori informazioni sui filtri, consulta [Filtri](https://docs.aws.amazon.com/quicksight/latest/APIReference/API_Filter.html). ## Configurazione Prima di cominciare, assicurati di disporre delle seguenti risorse e informazioni. + L'ID del foglio a cui si desidera applicare l'ambito di `FilterGroup`. Questo può essere ottenuto con il metodo `getSheets` dell'SDK Embedding. + L'identificativo di set di dati e colonna da filtrare. Ciò può essere ottenuto tramite l'operazione [DescribeDashboardDefinition](https://docs.aws.amazon.com/APIReference/API_DescribeDashboardDefinition.html)API. A seconda del tipo di colonna utilizzato, potrebbero esserci restrizioni sui tipi di filtri che possono essere aggiunti a una risorsa incorporata. Per ulteriori informazioni sulle restrizioni dei filtri, consulta [Filtri](https://docs.aws.amazon.com/quicksight/latest/APIReference/API_Filter.html). + L'ID dell'elemento visivo dell'oggetto visivo a cui applicare l'ambito di `FilterGroup`, se applicabile. Questo può essere ottenuto con il metodo `getSheetVisuals` dell'SDK Embedding. Oltre al metodo `getSheetVisuals`, il `FilterGroup` che aggiungi può essere limitato solo al foglio attualmente selezionato. Per utilizzare questa funzionalità, devi già disporre di una dashboard o di un elemento visivo incorporato nell'applicazione tramite Amazon Quick Sight Embedding SDK. Per ulteriori informazioni sull'utilizzo di Amazon Quick Sight Embedding SDK, consulta la [amazon-quicksight-embedding-sdk](https://github.com/awslabs/amazon-quicksight-embedding-sdk)pagina. GitHub ## Interfaccia del metodo SDK **Metodi getter di incorporamento del pannello di controllo** La tabella seguente descrive i diversi metodi getter di incorporamento del pannello di controllo che gli sviluppatori possono utilizzare. | Metodo | Description | | --- | --- | | `getFilterGroupsForSheet(sheetId: string) ` | Restituisce tutto FilterGroups ciò che è attualmente compreso nell'ambito del foglio fornito nel parametro. | | `getFilterGroupsForVisual(sheetId: string, visualId: string)` | Restituisce tutti i `FilterGroups` attualmente compresi nell'ambito del foglio fornito nel parametro. | Se il foglio fornito nel parametro non è il foglio attualmente selezionato del pannello di controllo incorporato, i metodi precedenti restituiscono un errore. **Metodi getter di incorporamento degli elementi visivi** La tabella seguente descrive i diversi metodi getter di incorporamento degli elementi visivi che gli sviluppatori possono utilizzare. | Metodo | Description | | --- | --- | | `getFilterGroups()` | Restituisce tutti i `FilterGroups` che sono attualmente inclusi nell'elemento visivo incorporato. | **Metodi setter** La tabella seguente descrive i diversi metodi setter che gli sviluppatori possono utilizzare per l'incorporamento del pannello di controllo o dell'elemento visivo. | Metodo | Description | | --- | --- | | `addFilterGroups(filterGroups: FilterGroup[])` | Aggiunge e applica il valore fornito **FilterGroups**alla dashboard o alla grafica incorporata. Un `ResponseMessage` che indica se l'aggiunta è avvenuta correttamente. | | `updateFilterGroups(filterGroups: FilterGroup[])` | Aggiorna `FilterGroups` sull'esperienza incorporata che contiene lo stesso `FilterGroupId` del `FilterGroup` fornito nel parametro. Un `ResponseMessage` che indica se l'aggiornamento è avvenuto correttamente. | | `removeFilterGroups(filterGroupsOrIds: FilterGroup[] \| string[])` | Rimuove l'elemento fornito FilterGroups dal pannello di controllo e restituisce un messaggio `ResponseMessage` che indica se il tentativo di rimozione è riuscito. | Il `FilterGroup` che viene fornito deve essere limitato al foglio o all'elemento visivo incorporato attualmente selezionato. # Personalizza l'aspetto dei pannelli di controllo e degli elementi visivi incorporati di Amazon Quick Sight Puoi utilizzare Amazon Quick Sight Embedding SDK (versione 2.5.0 e successive) per apportare modifiche al tema delle dashboard e degli elementi visivi Amazon Quick Sight incorporati in fase di esecuzione. Il tema Runtime semplifica l'integrazione dell'applicazione Software as a Service (SaaS) con le risorse integrate di Amazon Quick Sight. I temi di runtime ti consentono di sincronizzare il tema dei tuoi contenuti incorporati con i temi dell'applicazione principale in cui sono incorporate le tue risorse Amazon Quick Sight. È inoltre possibile utilizzare il tema del runtime per aggiungere opzioni di personalizzazione per i lettori. Le modifiche ai temi possono essere applicate alle risorse incorporate al momento dell'inizializzazione o per tutta la durata del pannello di controllo o dell'elemento visivo incorporato. Per ulteriori informazioni sui temi, consulta [Utilizzo di temi in Amazon Quick Sight](themes-in-quicksight.md). Per ulteriori informazioni sull'utilizzo di Amazon Quick Sight Embedding SDK, consulta la [amazon-quicksight-embedding-sdk](https://github.com/awslabs/amazon-quicksight-embedding-sdk)pagina. GitHub **Prerequisiti** Prima di iniziare, assicurati di soddisfare i seguenti requisiti. + Stai utilizzando Amazon Quick Sight Embedding SDK versione 2.5.0 o successiva. + Autorizzazioni per accedere al tema su cui si desidera lavorare. Per concedere le autorizzazioni a un tema in Amazon Quick Sight, effettua una chiamata `UpdateThemePermissions` API o usa l'icona **Condividi** accanto al tema nell'editor di analisi della console Amazon Quick Sight. ## Concetti e terminologia La seguente terminologia può essere utile quando lavori con il tema di runtime incorporato. + *Tema*: una raccolta di impostazioni che puoi applicare a più analisi e pannelli di controllo che modificano il modo in cui il contenuto viene visualizzato. + *ThemeConfiguration*— Un oggetto di configurazione che contiene tutte le proprietà di visualizzazione di un tema. + *Sovrascrittura del tema*: un oggetto `ThemeConfiguration` che viene applicato al tema attivo per sovrascrivere alcuni o tutti gli aspetti della visualizzazione del contenuto. + *ARN del tema: un* Amazon Resource Name (ARN) che identifica un tema Amazon Quick Sight. Di seguito è riportato un esempio di ARN del tema personalizzato. `arn:aws:quicksight:region:account-id:theme/theme-id` I temi iniziali forniti da Amazon Quick Sight non hanno una regione nell'ARN del tema. Di seguito è riportato un esempio di ARN del tema iniziale. `arn:aws:quicksight::aws:theme/CLASSIC` ## Configurazione Assicurati di disporre delle informazioni seguenti per iniziare a lavorare con i temi del runtime. + Il tema ARNs dei temi che desideri utilizzare. Puoi scegliere un tema esistente oppure crearne uno nuovo. Per ottenere un elenco di tutti i temi e i temi ARNs presenti nel tuo account Amazon Quick Sight, effettua una chiamata all'operazione [ListThemes](https://docs.aws.amazon.com/quicksight/latest/APIReference/API_ListThemes.html)API. Per informazioni sui temi Amazon Quick Sight preimpostati, consulta[Impostazione di un tema predefinito per le analisi di Amazon Quick con Amazon Quick APIs](customizing-quicksight-default-theme.md). + Se utilizzi l'incorporamento di utenti registrati, assicurati che l'utente abbia accesso ai temi che desideri utilizzare. Se utilizzi l'incorporamento anonimo di utenti, passa un elenco di temi ARNs al `AuthorizedResourceArns` parametro dell'`GenerateEmbedUrlForAnonymousUser`API. Agli utenti anonimi viene concesso l'accesso a qualsiasi tema elencato nel parametro `AuthorizedResourceArns`. ## Interfaccia del metodo SDK **Metodi setter** La tabella seguente descrive i diversi metodi setter che gli sviluppatori possono utilizzare per un tema del runtime. | Metodo | Description | | --- | --- | | `setTheme(themeArn: string)` | Sostituisce il tema attivo di un pannello di controllo o di un elemento visivo con un altro tema. Se applicato, la sovrascrittura del tema viene rimossa. Se non hai accesso al tema o se il tema non esiste, viene restituito un errore. | | `setThemeOverride(themeOverride: ThemeConfiguration)` | Imposta un `ThemeConfiguration` dinamico per sovrascrivere il tema attivo corrente. Questo sostituisce la sovrascrittura del tema precedentemente impostato. Tutti i valori che non vengono forniti nel nuovo `ThemeConfiguration` vengono utilizzati di default sui valori del tema correntemente attivo. Se il `ThemeConfiguration` fornito non è valido, viene restituito un errore. | ## Inizializzazione del contenuto incorporato con un tema Per inizializzare un pannello di controllo o un elemento visivo incorporato con un tema non predefinito, definisci un oggetto `themeOptions` nei parametri `DashboardContentOptions` o `VisualContentOptions` e imposta la proprietà `themeArn` all'interno di `themeOptions` sull'ARN del tema desiderato. L'esempio seguente inizializza un pannello di controllo incorporato con il tema `MIDNIGHT`. ``` import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk'; const embeddingContext = await createEmbeddingContext(); const { embedDashboard, } = embeddingContext; const frameOptions = { url: '', container: '#experience-container', }; const contentOptions = { themeOptions: { themeArn: "arn:aws:quicksight::aws:theme/MIDNIGHT" } }; // Embedding a dashboard experience const embeddedDashboardExperience = await embedDashboard(frameOptions, contentOptions); ``` ## Inizializzazione del contenuto incorporato con la sovrascrittura di un tema Gli sviluppatori possono utilizzare le sovrascritture dei temi per definire il tema di un pannello di controllo o di un elemento visivo incorporato durante il runtime. Ciò consente alla dashboard o alla visualizzazione di ereditare un tema da un'applicazione di terze parti senza la necessità di preconfigurare un tema in Amazon Quick Sight. Per inizializzare un pannello di controllo o un elemento visivo incorporato con una sovrascrittura del tema, imposta la proprietà `themeOverride` all'interno di `themeOptions` sui parametri `DashboardContentOptions` o `VisualContentOptions`. L'esempio seguente sostituisce il carattere del tema di un pannello di controllo dal carattere predefinito su `Amazon Ember`. ``` import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk'; const embeddingContext = await createEmbeddingContext(); const { embedDashboard, } = embeddingContext; const frameOptions = { url: '', container: '#experience-container', }; const contentOptions = { themeOptions: { "themeOverride":{"Typography":{"FontFamilies":[{"FontFamily":"Comic Neue"}]}} } }; // Embedding a dashboard experience const embeddedDashboardExperience = await embedDashboard(frameOptions, contentOptions); ``` ## Inizializzazione del contenuto incorporato con temi precaricati Gli sviluppatori possono configurare un set di temi del pannello di controllo da precaricare al momento dell'inizializzazione. Ciò è particolarmente utile per passare rapidamente da una visualizzazione all'altra, ad esempio tra le modalità chiaro e scuro. È possibile inizializzare un pannello di controllo o un elemento visivo incorporato con un massimo di cinque temi precaricati. Per utilizzare temi precaricati, imposta la proprietà `preloadThemes` in `DashboardContentOptions` o `VisualContentOptions` con un array di massimo cinque `themeArns`. L'esempio seguente precarica i temi iniziali `Midnight` e `Rainier` in un pannello di controllo. ``` import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk'; const embeddingContext = await createEmbeddingContext(); const { embedDashboard, } = embeddingContext; const frameOptions = { 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); ``` # Utilizzo dell'SDK Amazon Quick Sight Embedding per abilitare collegamenti condivisibili a visualizzazioni di dashboard integrate Gli sviluppatori di Amazon Quick Sight possono utilizzare Amazon Quick Sight Embedding SDK (versione 2.8.0 e successive) per consentire ai lettori di dashboard incorporati di ricevere e distribuire link condivisibili alla loro visualizzazione di una dashboard incorporata. Gli sviluppatori possono utilizzare l'incorporamento di dashboard o console per generare un link condivisibile alla pagina dell'applicazione con il riferimento di Amazon Quick Sight incapsulato utilizzando l'SDK Amazon Quick Sight Embedding. I lettori di Amazon Quick Sight possono quindi inviare questo link condivisibile ai loro colleghi. Quando il loro collega accede al link condiviso, viene indirizzato alla pagina dell'applicazione che contiene la dashboard Amazon Quick Sight integrata. Gli sviluppatori possono anche generare e salvare link condivisibili di visualizzazioni di dashboard che possono essere utilizzati come segnalibri per lettori anonimi di Amazon Quick Sight quando utilizzano l'incorporamento anonimo. **Prerequisiti** Prima di iniziare, assicurati di utilizzare Amazon Quick Sight Embedding SDK versione 2.8.0 o successiva **Topics** + [Abilitazione della configurazione delle `SharedView` funzionalità per l'analisi integrata di Amazon Quick Sight](embedded-view-sharing-set-up.md) + [Creazione di una visualizzazione condivisa con l'`createSharedView`API Amazon Quick Sight](embedded-view-sharing-sdk-create.md) + [Utilizzo di una visualizzazione condivisa di Amazon Quick Sight](embedded-view-sharing-sdk-consume.md) # Abilitazione della configurazione delle `SharedView` funzionalità per l'analisi integrata di Amazon Quick Sight Quando crei un'istanza incorporata con l'API Amazon Quick Sight, imposta il valore di `SharedView` nel `FeatureConfigurations` payload su`true`, come mostrato nell'esempio seguente. `SharedView`sostituisce le `StatePersistence` configurazioni per gli utenti registrati che accedono ai dashboard incorporati. Se un utente del pannello di controllo ha `StatePersistence` disabilitato e `SharedView` abilitato, il suo stato persisterà. ``` const generateNewEmbedUrl = async () => { const generateUrlPayload = { experienceConfiguration: { QuickSightConsole: { FeatureConfigurations: { "SharedView": { "Enabled": true }, }, }, } const result: GenerateEmbedUrlResult = await generateEmbedUrlForRegisteredUser(generateUrlPayload); return result.url; }; ``` # Creazione di una visualizzazione condivisa con l'`createSharedView`API Amazon Quick Sight Dopo aver aggiornato l'SDK Embedding alla versione 2.8.0 o successiva, utilizza l'API `createSharedView` per creare una nuova vista condivisa. Registra `sharedViewId` e `dashboardId` restituiti dall'operazione. L'esempio seguente crea una nuova vista condivisa. ``` const response = await embeddingFrame.createSharedView(); const sharedViewId = response.message.sharedViewId; const dashboardId = response.message.dashboardId; ``` `createSharedView` può essere chiamato solo quando un utente visualizza un pannello di controllo. Per la creazione di una vista condivisa specifica della console, assicurati che gli utenti siano nella pagina del pannello di controllo prima di abilitare l'azione `createSharedView`. Puoi farlo con l'evento `PAGE_NAVIGATION`, mostrato nell'esempio seguente. ``` const contentOptions = { onMessage: async (messageEvent, metadata) => { switch (messageEvent.eventName) { case 'CONTENT_LOADED': { console.log("Do something when the embedded experience is fully loaded."); break; } case 'ERROR_OCCURRED': { console.log("Do something when the embedded experience fails loading."); break; } case 'PAGE_NAVIGATION': { setPageType(messageEvent.message.pageType); if (messageEvent.message.pageType === 'DASHBOARD') { setShareEnabled(true); } else { setShareEnabled(false); } break; } } } }; ``` # Utilizzo di una visualizzazione condivisa di Amazon Quick Sight Dopo aver creato una nuova vista condivisa, utilizza l'SDK Embedding per rendere la vista condivisa utilizzabile per altri utenti. Gli esempi seguenti configurano una visualizzazione condivisa dei consumabili per un pannello di controllo incorporato in Amazon Quick Sight. ------ #### [ With an appended URL ] Aggiungi `sharedViewId` all'URL di incorporamento, in ` /views/{viewId}`, ed esponi questo URL ai tuoi utenti. Gli utenti possono utilizzare questo URL per accedere alla vista condivisa. ``` const response = await dashboardFrame.createSharedView(); const newEmbedUrl = await generateNewEmbedUrl(); const formattedUrl = new URL(newEmbedUrl); formattedUrl.pathname = formattedUrl.pathname.concat('/views/' + response.message.sharedViewId); const baseUrl = formattedUrl.href; alert("Click to view this QuickSight shared view", baseUrl); ``` ------ #### [ With the contentOptions SDK ] Passa `viewId` a `contentOptions` per aprire l'esperienza con il `viewId` fornito. ``` const contentOptions = { toolbarOptions: { ... }, viewId: sharedViewId, }; const embeddedDashboard = await embeddingContext.embedDashboard( {container: containerRef.current}, contentOptions ); ``` ------ #### [ With the InitialPath property ] ``` const shareView = async() => { const returnValue = await consoleFrame.createSharedView(); const {dashboardId, sharedViewId} = returnValue.message; const newEmbedUrl = await generateNewEmbedUrl(`/dashboards/${dashboardId}/views/${sharedViewId}`); setShareUrl(newEmbedUrl); }; const generateNewEmbedUrl = async (initialPath) => { const generateUrlPayload = { experienceConfiguration: { QuickSightConsole: { InitialPath: initialPath, FeatureConfigurations: { "SharedView": { "Enabled": true }, }, }, } const result: GenerateEmbedUrlResult = await generateEmbedUrlForRegisteredUser(generateUrlPayload); return result.url; }; ``` ------