Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
Showing results for 
Search instead for 
Did you mean: 
As announced in the SAP Help Portal we offer with NW SAP_UI 752 a new Generic UI Building Block for displaying charts that is based on the SAPUI5 control sap.viz.ui5.control.vizframe. This control offers 41 different chart types with a variety of different settings, see the corresponding Chart Properties Reference.

The new VizFrame UIBB is being exposed with Web Dynpro component FPM_VIZFRAME_UIBB. As an application developer you can rely on the same ABAP APIs  and data model as before. Thus, you can re-use your existing Chart UIBB Feeder Classes.


You have two possibilities to convert component configurations that you implemented with the Web Dynpro component FPM_CHART_UIBB. You can

  1. Create new VizFrame UIBB configurations on the basis of existing Chart UIBB configurations. For this please run the Guided Activity application FPM_CFG_CONV_CHART_TO_VIZFRAME.

  2. Convert Chart UIBB configurations on-the-fly by applying the URL parameter FPM_CHART_UIBB_CONVERSION=X


On GUIBB level the VizFrame UIBB offers very similar features as the Chart UIBB, see my last SCN blog on this topic: For instance, you can

  1. Export the chart as Portable Network Graphic (PNG)

  2. Personalize with a Basic or Advanced Personalization Dialog

  3. Render the chart as a List UIBB ATS, the so-called Alternative List Rendering

Figure 1: VizFrame UIBB test application FPM_TEST_VIZFRAME_PERS

Design Time

In the configuration environment (FLUID) you can easily try different chart types. Add, change, remove measures or dimensions, and apply different chart setttings and CSS colors.

Figure 2: Component Configuration FPM_TEST_VIZFRAME_1 within FLUID

Test Applications

To quickly come into the topic, please check out the following test applications:

  • FPM_TEST_VIZFRAME_PERS: Chart types, events and personlization dialog

  • FPM_TEST_VIZFRAME_SELECTION: Selection and Deselection

  • FPM_TEST_VIZFRAME_CQREF: Currency and Amount reference


  • FPM_TEST_VIZFRAME_ASYNC_LOAD: Asynchronous Loading of Chart Data

  • FPM_TEST_CHART_SADL_SBOOK: Flight bookings drill-down with SAP HANA