Skip to Content

Lumira - Learn How-To Develop an Extension

Learn how to develop custom extension for Lumira - visualizations and data access connectors!

OverviewEnterpriseExtensionsTutorialsEvents
OverviewLearn How-ToViz Gallery I

Viz Gallery II

OS Data Access

SAP LUMIRA - DESIGNED WITH THE DEVELOPER IN MIND

Build custom visualizations and connectors to tell unique data stories

Learn how to develop by extensions type - Visualizations or Data Connectors

We have plenty of content that gets you going with developing your own extensions. Below you find the best resources, grouped extension type. Whenever you are stuck, make sure you check the official SAP Lumira Developer Guide.

And don't miss our Developer webinars - a great chance to connect with our experts!

Develop Visualization Extensions


PREREQUISITES

What you need to know before you begin

The Visualization SDK

Skills to keep you afloat

About VizPacker

  • A data visualization platform standard within SAP

  • Provides charting and SDK for most SAP BI tools, Fiori and HANA applications, including Lumira

  • Provides APIs and utilies (i.e VizPacker) to help creating unique visualizations of your own

To be able to create visualization extensions you need to have a good understanding of:

  1. D3.js (Data Driven Documents)

  2. JavaScript

  3. HTML5

  4. CSS

  5. SVG

  • A utility for developing visualization extensions

  • Auto-generates several pre-defined code snippets based on your configuration, and saves time in building extensions

  • For Lumira, VizPacker is used as a plugin for Web IDE and as part of the SDK

  • Also used for Design Studio

ABOUT THE VIZ PACKER PLUGIN FOR SAP WEB IDE

SAP recommends this environment for building new viz extensions. Web IDE has all the capabilities of the SDK, but supports developing in additional browsers, is easier to debug, beautifies your code, has code completion - and more good stuff! All future innovations will be in WebIDE exclusively. Here's some resources for more information:

VizPacker: WebIDE Plugin vs. Lumira SDK

Latest version of Web IDE Plugin

The All-New Visualization IDE for Lumira
By @Raz KornBy @Raz KornBy Dong Pan

Blog Post

Blog Post

Blog Post

DEVELOPING VIZ EXTENSIONS WITH THE SAP WEB IDE

There are some great resources to learn how to develop visualization extensions using SAP Web IDE:

Two examples of Lumira Viz Extensions, migrated to Web IDE:

Bullet Chart

By Matt Lloyd | Migrated by Raz Korn

Blog Post

  • Web IDE Overview (3:09)
  • Demo: Create a New Viz Extension (11:58)
  • Demo: Managing Extensions in Lumira (38:00)
  • Q&A (46:20)

    Football Heatmap

    By Mustafa Aydogdu | Migrated by Annie Niangneihoi

Blog Post

MIGRATING YOUR SDK-BASED VIZ EXTENSION TO AN SAP WEB IDE-BASED EXTENSION

Learn how to migrate an existing SDK-based viz extension to one based on SAP Web IDE and compatible with the latest release of SAP Lumira!

Migrate VizPacker-based Lumira Visualization extensions to Web IDE

By Dong Pan

Blog Post

 

NEW TO SAP WEB-IDE?

SAP Web IDE is the environment for building HTML5 apps, based on SAP's Hana Cloud Platform (HCP) and it comes with free developer accounts.

Sign up for a free Developer Account    Choose another HCP
account type   
Featuring the latest:
Free HCP packages   

<span style="color: #ffffff;">Tutorials, guides & webinars<br/></span>Analytics with
SAP Web IDE
Official Documentation for
Web IDE

USING LUMIRA SDK

Really, we do recommend that you use Web IDE, not the SDK

You might want to maintain your SDK based extensions though, for which we of course still ship the SDK as part of the Lumira Desktop download. Here's some of the key enablement assets for the Lumira SDK:

    Official Documentation for SAP Lumira

Read More

    How to Develop a Custom Visualization Extension for SAP Lumira



ADDITIONAL INSPIRATION FOR GREAT LOOKING VISUALIZATIONS

Visualizing BigData

Harvard Visualization Course

D3 Gallery on GitHub
Jay Thoden van Velzen blogs - Visualize BigData within LumiraA visualization course at HarvardA gallery of visualizations on GitHub to get you inspired!

Learn More

Learn More

Learn More

nin

nin

Data Visualization and D3.js on Udacity

OpenDataCity ExamplesInteractive Data Visualization for the Web
A virtual classroom: Learn D3.js in 7 chapters, with hands-on exercises

A gallery of visualizations from OpenDataCity (German)

An eBook by Scott Murray, showing you how to best represent your data

Learn More

Learn More

Learn More

    Develop Data Access Extensions

USING SAP LUMIRA DATA ACCESS EXTENSION SDK


An Introduction to Creating Data Access Extensions for SAP Lumira

By Vamsi Alluri

In this SAP Lumira Expert Series webinar replay, Vamsi Alluri, will give you an introduction to developing data access extensions that bring data from third-party data sources directly into SAP Lumira. Starting with an overview of the new features of V2 Data Access Extension SDK, Vamsi’s presentation then shifts to a demonstration of how to build a Web API connector to import historical stock quotes data from Quandl.com into SAP Lumira directly. The session concludes by completing your extension by generating a custom logo.

  • Introduction

  • Overview of the SDK – 00:48

  • New Features of the SDK – 05:17

    • Extension Manager – 05:23

    • Selecting an Extension – 06:00

    • SDK Architecture – 07:01

    • Flexible User Interface – 08:27

  • Extension Demonstration : Stock Price Data Access Extension – 11:17

  • How-to Guide : Building a Data Access Extension – 15:28

  • Debugging the Extension – 42:05

  • Creating a Custom Logo for Your Extension – 45:19

  • Resources – 46:39

Brought to you by Product Management SAP Analytics