Implementing Tableau in a Widget

The Platform provides a widget to display any Tableau visualizations. You will need to add the @gene/tableau dependency in the web microservice of your Platform application, then import the Tableau module in the AppModule.

Some further configurations are also required in the web part of the Tableau integration as shown in the following codes.

How to add the @gene/tableau library to the web microservice of the Platform application

Edit the file package.json in the web microservice and add the dependency:

web/package.json

{
    "name": "web",
    "version": "0.1.0-SNAPSHOT",
    ...
    "dependencies": {
        ...
        "@gene/tableau": "4.4.0-SNAPSHOT",
        ...
    },
    ...
}

How to import the Tableau module in the AppModule

Edit the file app.module.ts in the web microservice and import the module:

web/src/app/app.module.ts

import {GeneTableauIntegrationWidgetModule} from "@gene/tableau";
...
@NgModule({
    imports : [
        ...,
    GeneTableauIntegrationWidgetModule,
],
...
})
export class AppModule implements DoBootstrap {
...
}

How to configure the web part of Tableau integration

The first thing you need to do is to add the Tableau Web Data Connector menu.

To do so, open the settings dialog by clicking on the cog icon and the Application Preferences menu item. Then add a new entry by clicking on the + button and set the key INTEGRATION_MENU_SHOW_TABLEAU with the value true.

Application Preferences - INTEGRATION_MENU_SHOW_TABLEAU

The Tableau visualization library resources are loaded from Tableau online by default. However, if your Platform application can't connect to Tableau online, or if you do not want to rely on external resources, you can override the settings and make the library url point to your Tableau server instance. (More information about this library is available here.)

To do so, in the same settings dialog, you need to add a new entry TABLEAU_INTEGRATION_JS_LIBRARY_URL with a value in the following format https://www.YOUR-SERVER/javascripts/api/tableau-2.9.1.min.js.

Application Preferences - TABLEAU_INTEGRATION_JS_LIBRARY_URL

You can add Tableau visualizations to your Platform application by adding a Tableau Integration Widget in a dashboard.

Add a New Widget

Select Tableau Integration Widget

Then you need to set the visualization URL in the following form https://www.<tableau server>/views/<workbook name>/<Viz name>.

Configure the Visualization

You can now display your Tableau visualization within your Platform application.

Tableau Visualization in a Platform Application