Chapter 23. Integrating Tableau

Tableau is a Business Intelligence tool. This family of tools aims at adding value to your data. Tableau helps to visualize and understand complex and complete data sets.

Once Tableau is integrated on a DOC project, a user can select a scenario as a reference scenario for the reporting tool and the Tableau visualization widgets will display the reports. When the reference scenario is modified or when another scenario is selected as a reference scenario, the Tableau visualization widgets will be updated. This use case is illustrated by the following figure.

Figure 23.1. Integrating Tableau with DOC
Integrating Tableau with DOC

Here are some helpful links to Tableau resources:

1. Integrating Tableau to the Application

This section describes the main elements of the Tableau integration. To integrate any DOC application with Tableau we can use the Web Data Connector (WDC), which is a web-based technology (HTML and JavaScript) that describes how the data source can be reached by Tableau solutions (Server/Desktop).

The Tableau integration is composed of three parts:

  • the Tableau libraries for the Data Service,

  • the Tableau libraries for the Execution Service, and

  • the Tableau UI components for DOC web application.

[Note]

Note that, in Kubernetes deployments, applications from two different namespaces of the same cluster cannot communicate with each other through their external URLs. This limitation means that DOC application and the Tableau server need to be deployed in different Kubernetes clusters.

1.1. Integrating Tableau to the MongoDB Database

The Tableau add-on uses a MongoDB database, which must be configured in the Docker deployment scripts. To this end, uncomment the following lines in the mongo section of deployment/docker/infra/docker-compose.yml.

      - MONGODB_TABLEAU_USER=tableau
      - MONGODB_TABLEAU_PASSWORD=tableau
      - MONGODB_TABLEAU_DATABASE=tableau-db

For more details, refer to Section Using Docker Configuration Files.

1.2. Integrating Tableau to the Data Service

As Tableau needs to retrieve the data from DOC application, some dedicated HTTP endpoints need to be enabled in DOC.

To add Tableau endpoints in the Data Service, you need to add the dependency to a built-in library. To do so, edit the extensions/data-service-extension/build.gradle Gradle configuration file and enrich the dependency block as in the following example:

dependencies {
    ...
    // Tableau
    implementation "com.decisionbrain.gene:data-tableau-base:${versions.decisionbrain.dbgene}"
}

You also have to create a Java configuration that adds the Tableau HTTP controller to the Data Service. To do so, add a TableauConfiguration class with the @EnableTableau in the data-service-extension as in the following code:

package com.example.caplan.data.configuration;

import com.decisionbrain.gene.tableau.dataservice.EnableTableau;
import org.springframework.context.annotation.Configuration;

@Configuration
@EnableTableau
public class TableauConfiguration { }

Some configurations need to be added to help the Data Service to know how to reach Tableau Server

tableau-client:
  enabled: true
  host: <the-url-of-your-Tableau-server>
  credentials:
    username: tableauUser
    password: tableauPassword

When deploying using a Helm chart, add the following values to your environment values YAML file:

  <your-application-chart-name>:
    dataService:
      env:
        GATEWAY_SERVER_URL:
          value: "https://www.my-application.my-company.com"
        API_KEY_CLIENT_BASE_URL:
          value: "https://www.my-application.my-company.com/api/scenario"

When Tableau retrieves the data from DOC application, it asks for the data associated with the web data connector name. This data is retrieved from scenarios. The scenarios to be associated with a given web data connector are resolved by a component called TableauRefreshLifecycleHandler in DOC application. (As the name suggests, this component also provides hooks that are called and the start and end of the data refresh operations.)

The default implementation of this component associates scenarios with a web data connector, based on the users choice. If you need a different resolution algorithm, you will have to code your own logic as a Spring component in the data-service-extension that implements the TableauRefreshLifecycleHandler interface, and annotate it as @Primary.

Here an example that retrieves all the available scenarios for the user that has created the Web Data Connector.

@Primary
@Component
public class CustomTableauRefreshLifecycleHandler implements TableauRefreshLifecycleHandler {

    private static final Logger LOGGER = LoggerFactory.getLogger(CustomTableauRefreshLifecycleHandler.class);

    private final ScenarioServiceClient scenarioServiceClient;

    @Autowired
    public CustomizedResolveScenarioHandler(ScenarioServiceClient scenarioServiceClient) {
        this.scenarioServiceClient = scenarioServiceClient;
    }

    @Override
    public void refreshStarted(@NonNull String connectorId) throws MultipleWorkbooksException {
        LOGGER.info("Start refresh for WDC {}", connectorId);
    }
        
    @Override
    public void refreshCompleted(@NonNull String connectorId) throws MultipleWorkbooksException {
        LOGGER.info("Completed refresh for WDC {}", connectorId);
    }
        
    @Override
    public void refreshFailed(@NonNull String connectorId, String errorMessage) throws MultipleWorkbooksException {
        LOGGER.error("Failed refresh for WDC {}: {}", connectorId, errorMessage);
    }
        
    
    @Override
    public List<String> resolveScenarioIds(String connectorId) {
        LOGGER.info("Resolving Scenarios for WDC: {}", connectorId);

        var allScenarios = Optional.ofNullable(scenarioServiceClient.getScenarios(null, null).getBody())
                .map(scenarios -> scenarios.stream()
                    .map(PathDTO::getUuid)
                    .filter(Objects::nonNull)
                    .toList()
                ).orElse(List.of());
        // Add your custom logic here
        return allScenarios;
    }
}

1.3. Integrating Tableau to the Execution Service

It can be necessary to refresh Tableau visualization with your latest DOC application data. A task is available to achieve this goal.

  • You need to add the dependency to a built-in library. To do so, edit the extensions/execution-service-extension/build.gradle Gradle configuration file and enrich the dependency block as in the following example:

    dependencies {
        ...
        // Tableau
        implementation "com.decisionbrain.gene:execution-tableau-base:${versions.decisionbrain.dbgene}"
    }
  • You also have to create a Java configuration that adds the Tableau refresh task in the Execution Service. To do so, add a TableauTasks class with the @EnableTableauExecution in the execution-service-extension as in the following code:

    package com.example.caplan.data.configuration;
    
    import com.decisionbrain.gene.tableau.execution.EnableTableauExecution;
    import org.springframework.context.annotation.Configuration;
    
    @Configuration
    @EnableTableauExecution // Adds tableau refresh tasks
    public class TableauTasks { }
  • And add the following properties in the Execution Service extension. Edit the file extensions/execution-service-extension/src/main/resources/application.yml and add the following content.

    tableau-client: 
       enabled: true 
       host: '<the-url-of-your-Tableau-server>'
  • For the local development, you will have to add the environment variables to the run configuration of the Execution Service.

      TABLEAU_CLIENT_PERSONAL_ACCESS_TOKEN_NAME='fill-me'
      TABLEAU_CLIENT_PERSONAL_ACCESS_TOKEN_SECRET='fill-me'
  • For Helm deployment, you must add the following values to your environment values file values-my-cluster-name.yaml. For example:

    <your-application-chart-name>:
      executionService:
        env:
          TABLEAU_CLIENT_PERSONAL_ACCESS_TOKEN_NAME:
            value: 'fill-me'
          TABLEAU_CLIENT_PERSONAL_ACCESS_TOKEN_SECRET:
            value: 'fill-me'

1.4. Integrating Tableau to the Web Client

1.4.1. Configuring Tableau in the Gateway

To enable the Tableau web integration in DOC application, it is required to customize the content-security-policy. DOC provides a property named tableau.server-domain to set up the required policies in the Gateway configuration. You can set up this property in the application.yml file or as an environment variable on the Gateway Service.

The two following examples assign the value *.tableau.com to the property or the environment variable:

  • Through theapplication.yml file:

      tableau:
        server-domain: "*.tableau.com"
  • Through the environment variable:

    TABLEAU_SERVER_DOMAIN=*.tableau.com

1.4.2. Implementing Tableau in a Widget

DOC provides a widget to display any Tableau visualizations. You will need to add the @gene/tableau dependency in the web microservice of your DOC 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 DOC 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.5.0",
        ...
    },
    ...
}

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.

Figure 23.2. Enabling the Tableau Integration Widget from the Application Preferences
Enabling the Tableau Integration Widget from the Application Preferences

The Tableau visualization library resources are loaded from Tableau online by default. However, if your DOC application cannot 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.

Figure 23.3. Setting the Tableau Server URL from the Application Preferences
Setting the Tableau Server URL from the Application Preferences

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

Figure 23.4. Adding a New Widget
Adding a New Widget
Figure 23.5. Selecting the Tableau Integration Widget
Selecting the Tableau Integration Widget

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

Figure 23.6. Configuring the Tableau Visualization
Configuring the Tableau Visualization

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

Figure 23.7. Displaying a Tableau Visualization in the Application
Displaying a Tableau Visualization in the Application

1.4.3. Setting Tableau Polling Delays

When DOC triggers a refresh of the visualization in Tableau, it will start monitoring the refresh job status in order to refresh the view in DOC web page. You may need to customize the delay and timeout of the job monitoring depending on your application datasets and Tableau visualizations.

  • You can configure the polling delay and timeout of this monitoring by editing the following properties in the execution-service-extension. Edit the file extensions/execution-service-extension/src/main/resources/application.yml and add the following content:

         tableau-client:
           polling:
             job-status:
               delay-seconds: 5
               timeout-seconds: 300
  • For local development, you must add the environment variables to the run configuration of the Execution Service.

     TABLEAUCLIENT_POLLING_JOBSTATUS_DELAYSECONDS=5
     TABLEAUCLIENT_POLLING_JOBSTATUS_TIMEOUTSECONDS=300
  • For Helm deployment, you must add the following values to your environment values file values-my-cluster-name.yaml. For example:

    <your-application-chart-name>:
      executionService:
        env:
          TABLEAUCLIENT_POLLING_JOBSTATUS_DELAYSECONDS:
            value: 5
          TABLEAUCLIENT_POLLING_JOBSTATUS_TIMEOUTSECONDS:
            value: 300

2. Integrating with Tableau

Once you have completely followed the indications in Section Integrating Tableau to the Application, you will want to export some DOC scenarios to Tableau desktop, and import some Tableau visualizations from the Tableau server to DOC application.

Creating a Web Data Connector allows exporting some scenarios from DOC application to Tableau.

[Note]

Note that, to create Web Data Connectors in DOC application, the logged user needs to have one of the following roles: API_KEY_BACKOFFICE or API_KEY_ADMIN.

For more details, refer to Section Managing User Roles.

To create a Web Data Connector, you need to launch the wizard by clicking on the cog menu, and then integrations > Tableau Web Data Connector menu item. The wizard will ask you to name your Web Data Connector.

Figure 23.8. Setting the WDC Name
Setting the WDC Name

You can click on the create button and obtain the Web Data Connector link by clicking on the copy paste button on the next screen.

Figure 23.9. Copying the WDC URL
Copying the WDC URL

Use this link in Tableau Desktop to add a new Web Data Connector and create your visualizations.

[Note]

Note that,every time you create a Web Data Connector in DOC application, an API Key is generated. It can be managed, along others in a dedicated view.

For more details, refer to Section Deleting an API Key.

Figure 23.10. Displaying a WDC API Key
Displaying a WDC API Key