Aug 27, 2021
Configuring and using the Tableau Viz LWC component – Integration, Authentication, and Tableau Viz LWC-2
To add our demonstrator example to your Salesforce org, follow these steps:
- Go to the URL: https://public.tableau.com/app/profile/p.padham/viz/SuperstoreDashboard_16709573699130/SuperstoreDashboard. This is a dashboard based on the Superstore dataset often used to demonstrate Tableau capabilities and is shown in the following screenshot:
Figure 7.9: Superstore Dashboard on Tableau Public
- Click on the share icon and copy the public link, as shown in Figure 7.10:
Figure 7.10: Sharing public link for Superstore Dashboard
- Back in your developer org, go back to your Sales Home Page, click the gear icon, and select Edit Page.
- We will now replace the Quarterly Performance chart with the Sales Dashboard from Tableau Public. Start by clicking the delete icon on the Quarterly Performance chart, as shown below:
Figure 7.11: Deleting existing visualization
- Now drag the Tableau Visualization component into the empty slot and replace the URL in the component settings with the URL you copied from Tableau Public. You can see this in the following screenshot:
Figure 7.12: Configuring new Tableau Visualization component
- This should result in a view like the following figure:
Figure 7.13: Superstore Dashboard added
- We want to show a larger dashboard, so set the height to 950, save and go back to the Sales Home Page. The view should now look like the following:
Figure 7.14: Expanded view of dashboard
- The dashboard still cuts off on the right, so let us go back to edit mode and change the template. Click Change on the button next to the template and select the template Home Template One Region, as shown below:
Figure 7.15: Changing page template
- Leave the default values, click Done, save, and go back to the Sales Home Page, which should now look like the following:
Figure 7.16: Dashboard with new template
- The normal interactive features of the dashboard will work just fine within Salesforce, so try to click the table icon to see order details. This will change the view as per the following screenshot:
Figure 7.17: Interactive features of dashboard
- You can also go to a full screen view by clicking the button in the lower right corner. This is shown in the following screenshot:
Figure 7.18: Full screen view of dashboard
The process for configuring a visualization is nearly the same whether it is hosted on Tableau Public, on Tableau Online, or on your own Tableau Server. You will, however, be required to log in when accessing protected resources.