Lumira Visualization Extension – Sankey Diagram

In the past year or so, I have presented at various occasions on how to create visualization extensions for SAP Lumira, and all the examples that I demonstrated so far were based on D3. Needless to say, D3 is extremely powerful and flexible, but unfortunately it does not come with built-in charts, so we often have to create a chart from scratch, which could be a daunting task, especially if you want to create an extension that can accommodate various data formats/volume for productive use. This can be even more difficult for someone who is not familiar with D3.

But why do we have to re-invent the wheel if somebody has already created such a chart? I am working on a presentation for the upcoming SABOC conference in Austin (Aug 31 – Sep 2) to demonstrate the use of a high-level charting library that contains built-in charts. The example that I am going to show is a Sankey Diagram based on Google Visualization API. Within a few lines of code, a complex Sankey Diagram visualization is created, and it can handle any number of source/intermediate/target nodes without any extra code. The charting library has done all the heavy lifting for us 🙂 , and we simply just have to instantiate and parameterize the chart.

Just a quick question. Are you in a corporate network where a web proxy is needed to access Internet? As this Sankey Diagram is based on the Google Visualization library, it requires an online connection. If you need a web proxy to access Internet, you should configure it in your Lumira Desktop -> Preferences -> Network.

If that doesn’t solve the issue, please work with Annie to troubleshoot further.

I did configure the proxy with user/password in Lumira Desktop.To make sure the proxy was set correctly, I tried checking for updates and sending feedback, and these worked fine (on our corporate network, these give an error unless the proxy is set).

I think the problem is caused by our corporate network blocking a port or something.The same proxy causes problems with ESRI Geomap charts.

Note: when I run this at home, on my regular network (no proxy), the sankey visualization works perfectly!

Thanks for this great extension. Its worked fine after downloading the zip file.

I tried with creating a new project in Lumira cloud IDE. And in render file I have used same code that you wrote. But nothing is displaying. Height parameter showing error and after setting some constant value to it error is no longer appearing, but no display. Can you please share your thoughts why its behaving like this?

Great visualization … I’d really like to try and use it, but it seems to be failing. I see someone posted at the beginning of the year. I’m on the latest 1.31.0 … and I’m getting a javascript error in the log file:

Thumbnail generation failed – InvalidStateError: Failed to execute ‘drawImage’ on ‘CanvasRenderingContext2D’: The HTMLImageElement provided is in the ‘broken’ state

Currently there is no plan to test (and revise, if needed) the extension for Lumira 2.0, but as the extension is an open-source project (see the Github link in the blog post), you are allowed to modify the extension and make it compatible with Lumira 2.0.