Scrittura del codice di incorporamento per le viste
Il codice di incorporamento per Tableau Server 2022.3 e versioni successive e Tableau Cloud è cambiato per consentire l’uso dell’API di incorporamento v3. Per informazioni aggiornate su come incorporare una vista con l’API di incorporamento v3, consulta Incorporamento di base nella Guida dell’API di incorporamento. Le informazioni in questo argomento si riferiscono a versioni precedenti dell’incorporamento (con l’API JavaScript v1 e v2 Tableau).
Se stai scrivendo il tuo codice di incorporamento, puoi adottare uno dei due approcci seguenti:
Usa JavaScript di Tableau: questo è l’approccio preferito. Usa il codice di incorporamento che Tableau genera come punto di partenza per il tuo codice, aggiungendo o modificando i parametri oggetto che controllano la barra degli strumenti, le schede e altro ancora. Il codice di incorporamento predefinito, che utilizza un file JavaScript di Tableau, è anche l’unico modo per controllare l’ordine di caricamento di più viste incorporate.
Specifica l’URL della vista: incorpora una vista utilizzando un tag iframe o image, dove l’origine è l’URL generato quando fai clic su Condividi su una vista e quindi fai clic su Copia collegamento. Puoi eseguire questa operazione se non puoi usare JavaScript nel tuo sito Web. Possono anche verificarsi situazioni in cui puoi specificare solo un URL.
Quando incorpori una vista, devi definire una larghezza e un’altezza con cui questa verrà visualizzata. In caso contrario, il browser client le sceglierà autonomamente.
Nota: quando è necessario specificare il nome del server per Tableau Cloud nel codice di incorporamento, ad esempio per fare riferimento alla posizione dell’API JavaScript, utilizza l’URL https://online.tableau.com.
Usare il JavaScript di Tableau
Il codice seguente mostra un esempio di codice di incorporamento generato quando fai clic su Condividi su una vista pubblicata. I caratteri speciali nel parametro host_url
sono codificati con URL e quelli presenti nei parametri name
e site_root
sono annotati come riferimenti di caratteri numerici HTML.
Esempio di Tableau Server:
<script type='text/javascript' src='http://myserver/javascripts/api/viz_v1.js'></script> <div class='tableauPlaceholder' style='width:800; height:600;'> <object class='tableauViz' width='800' height='600' style='display:none;'> <param name='host_url' value='http%3A%2F%2Fmyserver%2F' /> <param name='site_root' value=/t/Sales' /> <param name='name' value='MyCoSales/SalesScoreCard/' /> <param name='tabs' value='yes' /> <param name='toolbar' value='yes' /></object></div>
Esempio di Tableau Cloud:
<script type='text/javascript' src='https://online.tableau.com/javascripts/api/viz_v1.js'></script> <div class='tableauPlaceholder' style='width:800; height:600;'> <object class='tableauViz' width='800' height='600' style='display:none;'> <param name='host_url' value='https%3A%2F%2Fonline.tableau.com%2F' /> <param name='site_root' value='/t/Sales' /> <param name='name' value='MyCoSales/SalesScoreCard/' /> <param name='tabs' value='yes' /> <param name='toolbar' value='yes' /> </object> </div>
L’origine del tag <script>
è l’URL del file JavaScript viz_v1.js per Tableau Server e Tableau Cloud. Il file JavaScript gestisce l’assemblaggio dell’URL completo della vista che viene mostrata ai tuoi utenti. I parametri oggetto name
e site_root
sono gli unici parametri obbligatori. Tutti gli altri parametri sono facoltativi.
Specificare l’URL della vista
Ecco un esempio di incorporamento della stessa vista utilizzando un iframe, dove l’origine è l’URL generato quando fai clic su Condividi su una vista e quindi fai clic su Copia collegamento.
Esempio di Tableau Server:
<iframe src="http://myserver/t/Sales/views/MyCoSales/SalesScoreCard ?:embed=yes&:tabs=yes&:toolbar=yes" width="800" height="600"></iframe>
Esempio di Tableau Cloud:
<iframe src="https://online.tableau.com/t/Sales/views/MyCoSales/SalesScoreCard ?:embed=yes&:tabs=yes&:toolbar=yes" width="800" height="600"></iframe>
Il parametro URL embed
è obbligatorio e, in via opzionale, è possibile includere parametri che controllano, fra l’altro, la barra degli strumenti e le opzioni di ripristino. Puoi anche aggiungere filtri all’URL che controllano i dati specifici che vengono visualizzati quando viene caricata una vista.
Suggerimento: quando utilizzi questo metodo, aggiungi l’attributo HTML allowfullscreen="true"
all’elemento iframe per abilitare il pulsante a schermo intero nella vista.