A while ago we rolled out the optimized table presentation for SAP Analytics Cloud and for a year it has been the default for any new table added to your stories. Many of you however have not updated your older tables to use the optimized presentation. Since we do not want you to miss out, this blog will give you a quick overview of the advantages you will be profiting from and explain how you can quickly identify all tables that need to be updated.
Scrolling is an important function in tables as we usually display more than a couple of rows or columns. The scrolling behavior was column and row based, now we changed it to pixel based. This feels much smoother and natural for the user, especially on mobile devices. The viewer of a story or application can scroll by hovering over the table and there is no more need to click into the table.
With just one click the values of a measure can be turned into a chart. But the loading times of the little bar charts were a big pain point. Now we have implemented a much-improved solution that gives users an optimal performance.
Row heights sometimes varied when users were drilling down in the table. Now all rows are always equally distributed. Also, the designer can set the row heights in the styling side panel to a custom height or use predefined Fiori heights (Default, Cozy, Condensed) which are adapting automatically to the used font size.
We simplified the responsive logic of columns that all content is always visible. This might lead to wider columns with a horizontal scroll bar. To reduce the width a wrap on the column can be used. In case the columns are not fulfilling the whole table size, the leftover white space is distributed evenly.
The unresponsive logic is made for a pixel perfect design. The designer can resize single, multiple or all columns at the same time and specify the width to an exact pixel value.
The table title will be always shown and does not scroll with the content anymore. Its height is automatically adjusted to the title’s font size. Of course, everyone can still hide the whole title via the context menu if not needed at all.
For tables using linked analysis, CTRL + left mouse click now deselects a member and ESC clears the whole selection.
Open your story in edit mode, go to the "save" menu area, open the dropdown and check the last entry “Enable Optimized View Mode” and then save the story. In case you have any tables in non optimized view mode the following message will be shown:
When you select learn more, you get a list of all the tables you need to optimize with title and the page they are on.
We recommend for you to leave the Optimized View Mode turned on for the story as this allows you to benefit from performance and usability improvements and will also set you up to consume the latest story features. For more information about the Optimized View Mode check out this blog.
In addition to optimizing the view mode, we would recommend to converting your story to Optimized Design Experience which would optimize both the edit and view experience. You can do the conversion under the file menu “Edit Story”. You can find more information about the Optimized Design Experience in this blog post.
Now that you have identified which tables in your story need to be optimized, you can convert them. Select one of the tables that has not yet been optimized and open the builder panel. In the panel you have a checkmark box to turn on the optimized presentation.
After you have checked the optimized presentation for all your tables, do a quick check that it looks good. Two things to look out for are the column height as well as the column width.
By the way, grid pages use non-optimized presentation tables, too. Hence, the content must be converted to run on Optimized Experience. To learn more about converting grid pages into Optimized Presentation Tables click here.
When you have done this for all tables, don’t forget to save the story. Now all users of your tables will benefit from the advantages of the optimized presentation.
- Advantages of the optimized table presentation
- How to identify non-optimized tables
- How to enable the optimized table presentation
Advantages of the Optimized Table Presentation
Smooth scrolling
Scrolling is an important function in tables as we usually display more than a couple of rows or columns. The scrolling behavior was column and row based, now we changed it to pixel based. This feels much smoother and natural for the user, especially on mobile devices. The viewer of a story or application can scroll by hovering over the table and there is no more need to click into the table.
Faster loading In-Cell charts and thresholds
With just one click the values of a measure can be turned into a chart. But the loading times of the little bar charts were a big pain point. Now we have implemented a much-improved solution that gives users an optimal performance.
Consistent row heights
Row heights sometimes varied when users were drilling down in the table. Now all rows are always equally distributed. Also, the designer can set the row heights in the styling side panel to a custom height or use predefined Fiori heights (Default, Cozy, Condensed) which are adapting automatically to the used font size.
Responsive vs. Unresponsive
We simplified the responsive logic of columns that all content is always visible. This might lead to wider columns with a horizontal scroll bar. To reduce the width a wrap on the column can be used. In case the columns are not fulfilling the whole table size, the leftover white space is distributed evenly.
The unresponsive logic is made for a pixel perfect design. The designer can resize single, multiple or all columns at the same time and specify the width to an exact pixel value.
Table title
The table title will be always shown and does not scroll with the content anymore. Its height is automatically adjusted to the title’s font size. Of course, everyone can still hide the whole title via the context menu if not needed at all.
Linked analysis
For tables using linked analysis, CTRL + left mouse click now deselects a member and ESC clears the whole selection.
How to Identify Non-Optimized Tables
Open your story in edit mode, go to the "save" menu area, open the dropdown and check the last entry “Enable Optimized View Mode” and then save the story. In case you have any tables in non optimized view mode the following message will be shown:
Unsupported and Deprecated Features Dialog
When you select learn more, you get a list of all the tables you need to optimize with title and the page they are on.
Dialog showing tables to be optimized
We recommend for you to leave the Optimized View Mode turned on for the story as this allows you to benefit from performance and usability improvements and will also set you up to consume the latest story features. For more information about the Optimized View Mode check out this blog.
In addition to optimizing the view mode, we would recommend to converting your story to Optimized Design Experience which would optimize both the edit and view experience. You can do the conversion under the file menu “Edit Story”. You can find more information about the Optimized Design Experience in this blog post.
How to Enable the Optimized Table Presentation
Now that you have identified which tables in your story need to be optimized, you can convert them. Select one of the tables that has not yet been optimized and open the builder panel. In the panel you have a checkmark box to turn on the optimized presentation.
Optimized presentation turned on for the table
After you have checked the optimized presentation for all your tables, do a quick check that it looks good. Two things to look out for are the column height as well as the column width.
By the way, grid pages use non-optimized presentation tables, too. Hence, the content must be converted to run on Optimized Experience. To learn more about converting grid pages into Optimized Presentation Tables click here.
When you have done this for all tables, don’t forget to save the story. Now all users of your tables will benefit from the advantages of the optimized presentation.
- SAP Managed Tags:
