Skip to Content
Product Information
Author's profile photo Michael Jung

KPI-Dashboard with Lumira 2.0 – Demo – Update Lumira 2.2

Introduction

The dashboard at hand is supposed to provide insights into the new Lumira 2.x features: The new composites, the integration of offline data and the adaptive containers are most important to note. Hence, this demo aims at showing how these features work in combination. Moreover, it serves as an inspiration and can be regarded as a template. Data used in dashboard is dummy data only. Visualizations have been chosen randomly to show a variety of chart types (e.g. radar, tag cloud, doughnut). The chosen type may therefore not match the type actually recommended for use for a specific KPI. Feel free to visit this blog regularly to stay up-to-date with the new Lumira innovations. The lumx-file can be downloaded at the end of the page.

Video (without audio):

Features:

  • Offline-data imported via Lumira Discovery
  • KPI-tiles as custom components
  • Fiori 2.0 Look & Feel
  • Details for all KPIs
  • Built-in search functionality for KPIs
  • Freely configurable Home-Page
  • KPI-specific reports incl. map

Update 08.01.2018 (Lumira 2.1):

  • The application has been translated into English (all screenshots in this blog have been replaced)
  • Dynamic creation of tiles for Home-Page
  • Comments
    • Comments application-based (copied from 2.1 Feature Samples) – first icon top right
    • Comments on Crosstabs (copied from 2.1 Feature Samples) – open context menu for crosstab
    • Comments on Members for tab “Description” in details
  • New Scroll-Container

Update 12.01.2018 (Lumira 2.1):

  • Redesign of “Extended Evaluation”
  • Data Labels in Tiles
  • Crosstabs in Tiles

Update 05.07.2018 (Lumira 2.1):

  • New App based on Belize Theme (default app)
  • New help-function, which can be activated by clicking the help-icon top right

Update 16.10.2018 (Lumira 2.2):

  • New area “Sales”
  • New feature for tiles: switch dimension for charts
  • New table configurator. Just bind the composite to a crosstab.
    • Composite in Composite
    • Search for dimensions
    • Sort dimensions
    • Show/hide dimensions

 

If you like this blog, please click on the like-button.

Custom Components for Tiles

The tile composite can be used either with or without chart area. It has the following features / properties:

  • Display of KPI name
  • Display of values, optionally with color code
  • Unit of KPI
  • Trend icon and value
  • Link to KPI details

All relevant elements are binded to the composite properties, so no script is needed here. There is only some script in the formatter functions and for the central function setValues to set the composite properties from outside the composite.

Update 12.01.2018 (Lumira 2.1):

I added the option to show a crosstab instead of chart and data labels for charts:

 

Adaptive Container

Each page of the TabStrip makes use  of an adaptive container. In this demo, the adaptive container was configured in a way that it matches tablets, desktops and large desktop screens. There is also a fourth viewport used for smartphones, but it seems that smartphones does not support composites.

It is important to note, that due to the architecture of the adaptive container, tiles with charts should always be displayed at the beginning of a block in order to enable an optimal design. The different block size decides whether the lower part of the tile (the chart) is displayed or not.

Update 08.01.2018 (Lumira 2.1):

In the 2.0 version I allowed to scroll the page of tab-strip via css. In Lumira 2.1 there is a new component called scroll-container. So every adaptive container is embedded in a scroll container.

Usage of Tiles

Tiles are initialized with the following command:

GS_TILES.calcTile(„1000“, KPI_TILE)

The value “1000” corresponds to the internal ID of the KPI. “KPI_TILE” is the technical name of the tile composite.

The values are read from a central DataSource and transferred to each tile via script. The tile itself does not have a data connection, it rather obtains its data using the consuming app and the respective DataSource. If you use a DataSource in a tile, the DataSource is loaded per instance of tile. Therefore, I would not recommend to use DataSources in Composites if you want to use the same composite more than once per Application.

In order to display chart data in the tile, the function setChartConfig is invoked within the tile. In this step, the type of the chart and the DataSources from the app are transferred to the tile (Update 12.01.2018: data labels can now also be configured).

The original solution was based on BW and the usage of attributes (KPI as main info object). To simulate attributes i decided to store all masterdata concatenated in one field separated by a “|”.

In the onstartup-Event the function “splitMasterdata” is called. In this function the masterdata is read from the DataSource and splitted among the different arrays.

The following illustration exemplary shows how master data is used:

  • column A: key of kpi
  • column B: description
  • column C: area (used for search-function to find tab)
  • column D: category (not used)
  • column E: sub-category (not used)
  • column F: unit for kpi
  • column G: delta-unit for kpi
  • column H: color of the arrow when the value increases compared to the previous period
  • column I: number of decimal places for kpi
  • column J: scaling factor
  • column K-end: ranges for conditional format of kpi

Details

For each KPI, one can jump to a detail screen. This detail screen consists of the following areas: monthly progress, description and further evaluation of the KPI (if available).

The monthly progress shows the actuals, average and plan values. The description displays a long text for the KPI. The comment field on this page does not have a function. In the original BW-based solution, the text was written back to the BW using a specific planning function type from the BW-IP.

The detailed evaluation is always displayed in the same way. This area surely requires revision. However, it does show how KPI-specific evaluations can be integrated in a dashboard of this kind.

As Lumira 2.0 also provides an enhancement of the map component, a map illustration on the level of buildings was implemented for the KPI “Ø Enegy Costs per Building”:

The map can be found on third tab. Switch to the chart, activate navigation and choose in the chart type picker the map. From technical point of view the chart is set to invisible and the map-component gets visible. Sure, the third tab needs a little bit of rework.

Update 08.01.2018 (Lumira 2.1):

I added a commentary solution to the tab “Description”. It is based on the new comment-function in Lumira 2.1 and the corresponding component “feed list”.

The comments are bound to kpi-members and public.

var text = COMMENTS_TEXT.getValue();
COMMENTS_TEXT.setValue("");
APPLICATION.createInfoMessage(gv_selected_kpi);

var commentId = COMMENTS.create(text,{
    "context": {"(MEASURES_DIMENSION)":"DS:60,MEAS:id_169","DS:60,DIM:id_151":gv_selected_kpi} ,
    "contextType": CommentContextType.MEMBER,
    "dataSource": DS_TRANSACTIONAL_DATA,
    "isPublic": true
	});

COMMENTS_FEEDLIST_GLOBAL.addItem(COMMENTS.getComment(commentId),true);

Update 12.01.2018 (Lumira 2.1):

The “extended evaluation” has been completely redesigned. Some features have been copied from the Generic-Anaylsis-Template.

 

KPI-Search

In the demo data, several KPIs distributed along the four tabs were already illustrated. If  the end user searches for a specific KPI and does not want to click through all of the tabs, he or she can use the search function to directly navigate the desired KPI. The search can alternatively be invoked using CTRL+F.

This is just a very simple search solution based on Stringsearch.

Home

Each user can select and save his favorite KPIs with the Dashboard start page.

Up  to nine tiles can be stored. Tiles can also be deleted using the ‘delete’-symbol. The ordering is displayed in accordance to the time stamp of recording. Here, the new bookmarks from Lumira 2.0 are used. In the background, solely the IDs (1000,1001, etc.) of the selected tiles are saved and the tiles are rebuild with every start.

Update 08.01.2018 (Lumira 2.1):

With Lumira 2.1 it is possible to create components during runtime, composites included. So it is a nice feature to reimplement my home-tab.

I only created an empty adaptive container at design time, the tiles and the plus-sign are created during runtime. Because each tile consists of a block and a custom component we must create in the first step a block and in step 2 the custom component in the previous created block:

block = COMPONENTS.createComponent(ComponentType.Block,ADAPTIVE_LAYOUT_HOME);
// copy properties from an empty block, otherwise the content of block is copied too
COMPONENTS.copyProperties(BLOCK_HOME_EMPTY_TEMPLATE, block);
tile = COMPONENTS.createComponent(ComponentType.LUM_9BB26EB2E9EFB499D479C4E19E5C7AB5_KPI_TILE, block);
// we need the standard script for onClickNewTile... there is no api so we copy from existing newTile
COMPONENTS.copyProperties(KPI_TILE_HOME_TEMPLATE, tile);

Because there is no API to config the block via Script I copied the settings from a blank block (BLOCK_HOME_EMPTY_TEMPLATE) which was configured in design time. Same for my tile component because after dynamic creation the script for my interface function “openPopup” is empty. The function copyProperties also copies this type of properties.

With the new feature of dynamic creation of components and this new approch there is no limit for tiles on the home-page.

 

Misc

Download

Please do not rename the lumx-file to avoid script errors during lumira 2.x runtime. Just copy it to your lumira documents folder.

LUMX-File

If you want to upload the lumx-file to your BIP, please keep in mind to change the following:

GS_TILES->calcTile looks like:

I_TILE.as(ComponentType.LUM_C88EE0E557C0A60833590B6DAD6626FA_KPI_TILE).setValues(Convert.floatToStringUsingLocale(actual_value.value / scaling_factor,number_decimal_places), description, unit, delta, deltaValue , time, I_KPI, valueCondFormat, details, deltacolor,xxl_text);

“LUM_C88EE0E557C0A60833590B6DAD6626FA_KPI_TILE” is generated by Lumira Designer so you have to change it. Please use content assistant to find the right one (should be begin with LUM*).

Same in GS_TILES-> calcAllTiles. Replace all occurrences of “LUM_C88EE0E557C0A60833590B6DAD6626FA_KPI_TILE” with your new Tile-ID.

There are a few more places where the ID schould be replaced:

  • GS_SEARCH–> select
  • ICON_HOME_TILE_1_DELETE – ICON_HOME_TILE_9_DELETE -> onClick
  • TIMER_SEARCH -> onTime

In 2.0 SP2 PL1 it looks like there is an issue with composites as type in input paramaters of functions so I decided to use generic type “component” and cast it to the right type via “as”.

Update 08.01.2018 (Lumira 2.1):

I added a new file to the share for Lumira 2.1. In same folder there is also the “old” 2.0 version if you are running 2.0 (but sure, without new features).

Update 16.10.2018 (Lumira 2.2):

I did not change the name of the file for 2.2.

Assigned tags

      141 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Josh Euesden
      Josh Euesden

      Hi Michael

       

      Great document and explanation of the component feature!

      We are implementing something similar to your dashboard but are having some performance problems (run time of circa 1 minute).  We have a BW on HANA system.

      We have 1 composite which is used multiple times to display different values at different navigational states; the composite itself does not have a datasource assigned.

      I believe our issue is that as we show a numeric value in the tile from 1 datasource and then a chart showing the same measure but with a dimension in the drilldown, for example fiscal period.  In order to achieve that we have had to use an extra datasource from the same query.

      Have you come across performance problems with your dashboard? Any thoughts on how we can reduce the number of datasources yet keep the information displayed the same with no performance issues?

      Author's profile photo Alex Cruickshank
      Alex Cruickshank

      This is brilliant! Excellent effort!

      How is the global variable of ga_kpi_key filled? this is used to fll the dropdown for selecting a new tile for the homepage, i just wanted to find out how it knew what tiles were available to be used?

      Author's profile photo Rick Kruyf
      Rick Kruyf

      I am trying to publish the sample using Lumira Designer 2.2 patch 2.  The file can be run in designer and it works with no script errors.  When the document is published, there are script errors when viewed and when the file is downloaded there are a number of script errors.

      Author's profile photo Maulin Doshi
      Maulin Doshi

      After upgrading to Lumira 2.2, we get suddenly error on global variable method as below: Did anybody face this? This works very fine in 2.1 Lumira Designer version.

       

      Description Location Event Script Component Application Type
      There is a potential endless loop in path "GLOBAL_SCRIPTS.openDetailView > g_pagebook.onSelect" Line 3 openDetailView GLOBAL_SCRIPTS [Lumira Documents] KPI_TILE_V2 BIAL Script Problem

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      Try the updated lumx-file from this blog. Should be fixed via workaround in my dashboard.

       

      Author's profile photo Maulin Doshi
      Maulin Doshi

      Hi Michael,

      Pagebook is not used in your lumx file.

      Pagebook onselect -Global script function for composite is not working in our lumira document

      It is only working for the component.

       

       

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      Pagebook? I did not used a pagebook whether in application or component.

       

      Author's profile photo michael van
      michael van

      Hi Maulin,

      Could you please share the downloaded files or send them to my email box within my account? I can not download them.

      Thanks a lot.

      Best regards,

      Michael Van

      Author's profile photo Utku SANCAKTAR
      Utku SANCAKTAR

      Hello Micheal,

      This is a great document. Thank you for sharing. The download link is expired. Can you renew it?

      Thank you

      Author's profile photo André Jost
      André Jost

      It seems that the download link is expired

      Author's profile photo Naveen Kumar
      Naveen Kumar

      Hi Michael,

      Could you please explain how the chart visualization changes for different dimension ,I am getting blank cell for drop down component

       

      Regards,

      NK

      Author's profile photo Shane Burns
      Shane Burns

      Hi Michael,

      Could you share again the Lumx file? It seem to be expired.

      Thanks,

      Shane

      Author's profile photo Maulin Doshi
      Maulin Doshi

      Hello,

      Is there any option for Power Point export for all the tiles ?

       

       

       

      Author's profile photo Naveen Kumar
      Naveen Kumar

      In HR tile

      is there any sorting applied for

      No of Entries
      Potential Separations
      Sickness Rate etc....

      Is it coming randomly or any possibilities of sorting for each HR KPI tiles

      Regards

      NK

      Author's profile photo Rainer Gstöhl
      Rainer Gstöhl

       

      Hi Michael,

      your Dashboard is great, we downloaded the Document and would love to use it as a template. However I have problems to replace the offline data by online data. Somehow I can't customize the template. For some help I would be grateful.

      Regards Rainer

      Author's profile photo Furqan Baig
      Furqan Baig

      Hi, is it possible to share the downloaded version of Michael as the link is not working.

      Author's profile photo michael van
      michael van

      Hi, Baig,

      The download link is not working now. Could you please share the downloaded file with me via my email within my account?

      Thanks a lot.

      Michael.Van

      Author's profile photo michael van
      michael van

      Hi, Rainer,

      The download link is not working now. Could you please share the downloaded file with me via my email within my account?

      Thanks a lot.

      Michael.Van

      Author's profile photo Dimitris Emmanoulopoulos
      Dimitris Emmanoulopoulos

      Very interesting.

      Thank you!

       

      Dimitris

      Author's profile photo Shailaja Naik
      Shailaja Naik

      Hi Michael,

      Could you share again the Lumx file? It seem to be expired.

      Thank you!

      Shailaja

      Author's profile photo Shailaja Naik
      Shailaja Naik

      Hi Michael,

      Our Lumira version is 2.1. Do you have older version of this dashboard please.

      Thank you!

      Shailaja

       

      Author's profile photo Gabriel Motor
      Gabriel Motor

      Hi,

      I have the same issue.

      If I import the document with name Lumix 2.1, I get the error that my installed Lumira Version ist du old. But I have limits 2.1 SP2.

      Can you please upload a Lumix File how is working with lumira 2.1.

      Thanks a lot

       

      Br

      Gabriel

      Author's profile photo Marco Nieuwenhuis
      Marco Nieuwenhuis

      Hi Michael,

      We aim to use Lumira Designer software, which is never used before (only for some small testing purposes), for corporate dash-boarding/high level KPI reporting. Your blog and the LUMX demo download is really great and gives lots of insights what the product is capable of. Very impressive! Thanks for sharing this all! Actually the dashboard looks that fine that we could use it as dashboard with a few adjustments.

      My JavaScript/Lumira Designer skills are not yet up to standard (a rookie…). I hope you, or someone with the knowledge, could help me out with a ‘problem’ I’m facing. I want to assign source data row results to global variables (i.e.: gv_year_current). I searched a lot to find a solution but didn’t found what I’m looking for. Also purchased the SAP Lumira Designer Edition book (SAP PRESS). No answers yet…

      So what I’m trying to achieve is to dynamically set the global variables for current year/current week etc. based on an Universe UNX data source. In your demo file the gv_current_year is set with a static default string value (“2011”). I want to determine/set the global variables based on the UNX source result within the ‘OnStartup’ script if possible…

      The query- & results for year looks like this.

      SELECT
      Convert(varchar(4), Dwh.ZZZ_DATE_DIM.BOOKYEAR_NUM)
      FROM
      Dwh.ZZZ_DATE_DIM
      WHERE
      Dwh.ZZZ_DATE_DIM.WEEKS_AGO = -1

      The DB field type is INTEGER for Dwh.ZZZ_DATE_DIM.BOOKYEAR_NUM. I’m doing the convert in the statement to retrieve a string type format.

      In the GS_EVENTS / onStartup script event I tried numerous things to set the value but no satisfying results yet. Below some things I tried a long the way….

      // get current year
      var year_current = DS_YWM.getMembers(“_WC3r4XDKEemAWchIGHC3Kg”, 1);
      gv_year_current = year_current;

      // get current year (from crosstab)
      gv_year_current = CT_YEAR.getSelectedMember(“_WC3r4XDKEemAWchIGHC3Kg”).text;

      Also tried the code/principle in this blog https://blogs.sap.com/2016/08/18/maximum-of-a-dimension-values-dates/

      Hope you or someone else could help me on this.

      Thanks in advance!

      Regards, Marco

      Author's profile photo michael van
      michael van

      Hello Marco!

      Could you please share the file with me?

      Best regards,

      Michael

      Author's profile photo Gabriel Motor
      Gabriel Motor

      Hi Michael Jung ,

      I have the same issue.

      If I import the document with name Lumix 2.1, I get the error that my installed Lumira Version ist du old. But I have limits 2.1 SP2.

      Can you please upload a Lumix File how is working with lumira 2.1.

      Thanks a lot

      BR

      Gabriel

      Author's profile photo Avetis Ovakimyan
      Avetis Ovakimyan

      Just wow! great application. Unfortunately, I'm new to Lumira designer (shifted from Power BI, as my current employer has purchased SAP products) and it's very hard to navigate in the application itself. is it possible to make a lumx template or make it easier to assign datasources to the tiles ?

      Author's profile photo Burcu Aksoy
      Burcu Aksoy

      Hi Michael,
      Thank you for this informative blog. I developed custom composites. I have a situation, you may have some opinion about this one.

      Firstly my Lumira document is on BI Platform, with Offline datasources. (To be able to schedule)
      As I mentioned, created custom composites as a template. Then I used COMPONENTS.createComponent /Copy properties etc. etc. scripts for that custom composites.
      Document works perfectly, no script problems or logic problems exists.

      Now, I'm scheduling my lumira designer document on BI Platform. Schedule succeed, but when I check on BI Platform scripts doesn't work properly. I see default values.(Feels like internal ID has changed)

      So this situation brings a question. Does scheduling affect internal ID/document’s CUID? (Since its uploaded to BI Platform)

      Author's profile photo Furqan Baig
      Furqan Baig

      Hi Michael Jung,

      Firstly, i like to thank you for sharing all this information in detail, it helped alot. Secondly, i have a similar requirement for which i was trying to download your Lumx file but the link is not working, can you please re-share.

       

      thanks

      Furqan

      Author's profile photo Iksit Gadhia
      Iksit Gadhia

      Hi, Great info!

       

      Not sure if the download is being shared directly but I am also interested in a copy.

       

      Please get in touch!

      Author's profile photo Sebastian Spiegler
      Sebastian Spiegler

      Hi Michael Jung,

      Also not sure if you share the link directly.

      Can you send it to me.

      Or Upload a new Link ?

      Thanks for your work.

      Best regards

      Sebastian

      Author's profile photo Denny Cai
      Denny Cai

      Great post. Can anyone re-share the .lumx file please?  Many thanks!

      Author's profile photo Jorge Juarez
      Jorge Juarez

      Hi Michael! Your post is very interesting. I tried to download the lumx flie but the link doesn't work.

      Could you please send it to me or re-share the file ?

      Many thanks.

      Author's profile photo Sarah Al Amoudi
      Sarah Al Amoudi

      Hi,

      this is awesome

      can u share it with me. Link is expired:(

       

      thanks

       

      Author's profile photo Tomasz Pietrzak
      Tomasz Pietrzak

      Hi Michael, is possible to share link once again ?

      Post very impressive.

      Thanks a lot!

      Best regards,

      Tomasz

      Author's profile photo Christoph Kretner
      Christoph Kretner

      Link has been fixed now

      Author's profile photo Norah Alkhaldi
      Norah Alkhaldi

      Still I can't download the document. Could you please fix it again

      Author's profile photo Vaishali Bedi
      Vaishali Bedi

      Thanks Michael.

      Really very interesting post.

      Request you to please share the link once again.

       

      Best Regards

      Vaishali

      Author's profile photo Norah Alkhaldi
      Norah Alkhaldi

      Thanks Michael.

       

      Could you please share the link again as it seems that the link is already expired!

       

      Thank you again

      Author's profile photo Ramona-Teodora Nagy
      Ramona-Teodora Nagy

      Could you please share the link again.

       

      Thank you!

      Author's profile photo Rahcak Thor
      Rahcak Thor

      Hi the link does not work. Please share again.

       

      Thanks

      Author's profile photo michael van
      michael van

      Hi, Jung,

      Great document!

      Could you please update the download link or send it to my email box within my account? I was noticed that It's expired when I clicked the download link.

      Thanks a lot.

      Best regards,

      Michael Van

      Author's profile photo jr ho
      jr ho

      Hi,

      Can pm me with the link please?

      Author's profile photo Smijoe Augustine
      Smijoe Augustine

      hi Micheal / Friends,

       

      can you please share the link again, its not active

       

      Regards

      Smijoe

      Author's profile photo Olaf Gärtner
      Olaf Gärtner

      It would be nice if the link can be shared again.

      Author's profile photo Rob Weeks
      Rob Weeks

      Does anyone have a copy of the LUMX file?  The link is broken and I can't locate the copy I used to have.

      Author's profile photo Johannes Esser
      Johannes Esser

      I would also appreciate if the Template could be made available for download again.

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      available again.

      Author's profile photo Johannes Esser
      Johannes Esser

      Thank you very much Michael and Have a nice Day.

      Author's profile photo Tomasz Pietrzak
      Tomasz Pietrzak

      Thanks a lot Michael, great job! I'm going to test now 😉

      Author's profile photo Adem Baykal
      Adem Baykal

      Thank you really much for resharing your KPI Dashboard Michael.

      Author's profile photo Smijoe Augustine
      Smijoe Augustine

      thank you so much.

       

      Regards

      Smijoe

      Author's profile photo David Lai
      David Lai

      Hi Michael,

      Is it possible if you can kindly make the template available for download again?

       

      Thanks

      David

      Author's profile photo Benjamin Masahud
      Benjamin Masahud

      Thanks Michael,

      The Dashboard look and feel is great!

      We would like to try and see what we can do with our current Dashboards based on your KPI template.

      Can you make your template available for download once more?

       

      Regards,

      Benji

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      done

      Author's profile photo Benjamin Masahud
      Benjamin Masahud

      Thanks very much!

      Regards,

      Benji

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      you're welcome.

      Author's profile photo Can Yemen
      Can Yemen

      Is it possible to have different KPIs refresh at different times? If a tab (specific module) data is updated weekly and other tab (another module) is updated daily, is it possible to keep this in the dashboard?

      This is when using online datasources

      Author's profile photo unisoft functionals
      unisoft functionals

      Hi Michael,

      I really appreciate your efforts.. Could you please provide the access to download the file.

       

      Regards,

      Ajay Emmadi

      Author's profile photo Robert Goldgruber
      Robert Goldgruber

      Hi,

      very nice dashboard. Unfortunately the download link is not working, can you please update the link?

      Thanks,

      Robert

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      try again...

      Author's profile photo Can Yemen
      Can Yemen

      Hi Michael,

      Is it possible to have different KPIs refresh at different times? If a tab (specific module) data is updated weekly and other tab (another module) is updated daily, is it possible to keep this in the dashboard?

      This is when using online datasources

      Author's profile photo Rahul SINGH
      Rahul SINGH

      Hello,

       

      Great document!

      Can you please make the file avialable for download?

       

      Thanks,

      Rahul

      Author's profile photo Aleksandra Yolgina
      Aleksandra Yolgina

      Link doesn't work

      Author's profile photo Michael Jung
      Michael Jung
      Blog Post Author

      try again