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: 

Introducing the all-new Web IDE VizPacker plugin for SAP Lumira! The new VizPacker plugin liberates Lumira visualization extension developers from a limited built-in VizPacker utility and brings them to Web IDE, a modern, full-featured and cloud-based development tool. Well in fact, the plugin was released in December last year and I wrote a "Hello World" blogSAP Lumira Visualization Extension - Hello World from SAP Web IDE about it back then, so it is not really brand new, but I would like to increase your awareness of this fantastic tool in the developer community and elaborate why we as developers should go for it.

First of all, the Web IDE VizPacker plugin is the strategic tool for creating visualzation extentions for SAP Lumira and Design Studio. All the new features and APIs will be implemented in this new tool. If you would like to take advantage of any new APIs (custom color palette, custom property panel, and much more to come), the VizPacker plugin is the right choice.

The Web IDE VizPacker plugin addresses a lot of the limitations we faced when using Lumira's  built-in VizPacker utility. Without going through an exhaustive list of its advantages, I would like to list a couple of lthings I like most:

1. Ease of debugging

As a developer, my code seldom runs correctly without debugging :razz: , so a proper debugger is key to my productivity. Various statistics indicate that about 50% of a developer's time is spent in debugging their code. With the old VizPacker utility, the chart canvas and the corresponding JavaScript are dynamically concatenated to the tool's DOM/code structure, so the debugger never reports errors with the proper line number. I always had to scratch my head to find which exact line of code is causing the problem.

With the Web IDE VizPacker plugin, you can preview your work in a seperate window, i.e. the chart is not embedded or concatenated to an existing parent DOM/code hierarchy. As a result, your browser's debug console is able to report the accurate line number whenver an error occurs. This, in my opinion, is a huge advantage to the old VizPacker utility.

2. A modern JavaScript editor

A proper JavaScript code editor greatly improves developer productivity and reduces errors by assisting the developer with auto-indentation, syntax highlighting, code completion, etc. Web IDE's JavaScript editor offers a much better coding experience than the old VizPacker utility.

For a comprehensive list of the advantages of using Web IDE VizPacker plugin over Lumira's built-in VizPacker utility, refer to my colleague Raz Korn's blogs: SAP Web IDE VizPacker Plugin vs. Lumira VizPacker Utility and New version of the SAP Web IDE and VizPacker is now available.

Over the next few weeks and months, we will work on updating the existing knowledge materials to reflect this change. Follow Lumira - Learn How-To Develop an Extension and stay tuned.

Last but not least, please rest assured that your extensions developed with the old VizPacker utility will continue to work, but if you plan to leverage the new features/APIs brought by the Web IDE VizPacker plugin, you would first need to convert your existing extension project into a Web IDE visualization extension project. I will go over the steps in my next blog.

Thanks for reading this blog post. Till next time.