PDF Export function in Unified Stories - Charts in SAP Analytics Cloud

[AttilaRitzl]

In this blog, I will demonstrate a seamless way to export a single chart within a Unified Story in SAP Analytics Cloud (SAC) with just a click of a button. We'll leverage a simple trick using custom fonts to create the button and explore the Exporting API to achieve the desired functionality. Let's dive into the process step by step!

Prerequisites

To create the export button, refer to SAP note 2953986 - How to set up Custom Web Fonts on SAP Analytics Cloud which provides details on setting up Custom Web Fonts on SAP Analytics Cloud. For SAP-icons usage, ensure to pass the URL "https://ui5.sap.com/resources/sap/ui/core/themes/base/SAP-icons.css" to SAC during setup.

Once the custom fonts are configured, add a button to the dashboard select an icon from the Icon Explorer. I've chosen the pdf symbol: . Be sure to copy the second option.

Select a symbol, then click the highlighted copy button

1. Paste the copied symbol into the Text property of the button widget in SAC, selecting the "SAP-icons" font type for consistency.

Formatting panel of the button widget

2. Add the Exporting API from the Scripting list to your dashboard to enable chart export functionality.

3. Include two panel widgets—one set to full screen size and the other to fit the chart. Place the full screen panel over the chart panel in the outline and ensure it is at the top of the list. You also need to hide it.

4.Place a chart in the smaller panel with height and width both set to 100%.

Theory

Everything is at hand - now let's clarify what we are going to do.

Rushing to the API and having the export done on the chart will make a simple screenshot of the whole dashboard, but only with the chart on it - in the wrong size, wrong alignment.
We have placed the panels for a quick workaround!

We'll move the chart from its original panel to the full screen one, and refresh the layout by script and then we'll run the export. Sounds easy? It is!

Script

Panel_Fullscreen.moveWidget(Chart_1);

Panel_Fullscreen.setVisible(true);

Chart_1.getLayout().setHeight(LayoutValue.create(100,LayoutUnit.Percent));

Chart_1.getLayout().setWidth(LayoutValue.create(100,LayoutUnit.Percent));

ExportToPDF_1.exportView();

Panel_Chart.moveWidget(Chart_1);

Panel_Fullscreen.setVisible(false);

Result

And what do we get? Let's see:

Dashboard and export result

Lookouts

• Export API - Paper Size
  
  
  
  • If you differ the Auto setting, make sure your layout fits the size you select here. Otherwise, your will turn out readable.
  
  
  • 
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

    A2	~ 7016 x 4961 px
    A3	~ 4961 x 3508 px
    A4	~ 3508 x 2480 px
    A5	~ 2480 x 1748 px

    
    
  
  
  
  


• Export API - Included widgets
  
  
  
  • Ensure that all charts and tables you want to export are opted-in for export. Any widgets added after creating the API won't be included automatically.
  
  
  
  

Conclusion

By following this straightforward approach, you can effortlessly export single charts from your Unified Story in SAP Analytics Cloud. Feel free to share your experiences and challenges in the comments below. Let's continue exploring the potential of SAC together! Happy exporting! 😊