When SAP announced some of the new features with Webi in BI 4.2 one new feature jumped out at me, Custom Elements. This is the ability to extend Web Intelligence's charting and visualization capabilities with 3rd party addons. This tied in so well with the work we've been doing with Xcelsius in creating extensions and modern visualizations for dashboards. Now we have an opportunity to bring these same visualizations to Web Intelligence too.

As this is a new feature there isn't much information on the web about other developers experiences, the only information I could find was someone developing a custom element using node.js. Whilst this proved the concept that custom elements worked, I didn't want to go down the node.js route. My ulitmate intention was to develop visualizations that could be deployed at customer sites, and I am not aware of many production BO environments running node.js. So I set about exploring the capabilities leveraging a more traditional web landscape route.

customelementsFirst up was PHP. I was able to take the SAP developer documentation and create the required endpoints for the Customer Elements to communicate through. My first attempt at a Custom Element was to re-create our Xcelsius "multi chart" component. This is a d3 chart that you can dynamically change the type (Line, Spline, Step, Bar, etc). You can see a screen shot of this first demo to the left.  And a video of it in action below.

Click Here to Watch the Video

This worked great, and I was really impressed with how well the visualization integrated with the report. The downside was that I was only able to get the chart to appear when you viewed the report in a browser, I couldn't get the element to work when trying to output the report to PDF or excel. But for a PoC it showed what was possible.

However, putting my enterprise deployment hat back on again, how many companies have a PHP web server in their BI environment?  We needed to find a solution that not only provided the custom visualizations for interactive viewing and exporting to PDF / Excel, but also would be a simple deployment to production Business Objects environments.  Our focus shifted to Tomcat.  This is the default web server for Business Objects so if we could create a Java custom element, then people could deploy this to their BO Tomcat server and be up and running very quickly.

Our three objectives in a Custom Element are:

  • Interactive viewing of visualization
  • Export support of visualization
  • Tomcat deployment

We have successfully converted the basic visualization to a java webapp and can add this to our BI 4.2 Tomcat environment. So that is two our of three of objectives complete.  Next we need to work out how to make the visualization so that when you export to excel / PDF that the visualization is rendered within the document.

This is the part we struggled with the most. The custom element requires you to provide an image of the visualization so that it can be embedded within the PDF / Excel output, rather than HTML, which the interactive viewing uses.  We could try and write code to draw out the visualization as an image, but how do we make sure that the image looks identical to the chart you viewed interactively?  The solution was to use the same HTML that you see on the screen and then convert that to an image in the java.  With this approach the image that is created is identical to the visualization you would see on the screen. We now have a solution to our 3rd objective.

Now to see it all in action.    Click Here to Watch the Video


This is the same d3 chart shown in Excel (left) and interactively inside Web Intelligence (right)

Our three objectives are now met:

  • Interactive viewing of visualization
  • Export support of visualization
  • Tomcat deployment

Our proof of concept has been successful and we're getting close to be able to create a polished marketable custom visualization for Web Intelligence.  The next steps for us is to refine our code a little, and put it through some real life testing.  But I'm also looking to the community as a whole to try and understand the sort of visualizations you would like to see in Web Intelligence.  Now we have the means, the possibilities are endless.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>