Skip to Content

KPI Speedometer Widget


Recently a number of nice Enterprise Widgets have been presented here on SDN mostly showing us techies some relevant system information or allowing us to interact with the system to query some information.  But what about our managers? Don’t they want to have some useful widgets on their desktops besides their sudoku and weather widgets?  Well here you are. Your generic KPI speedometer widget. Turn the desktop of your PC into your Enterprise Radar Cockpit and see all your relevant performance indicators at one glance. Any system. Real time. 


The widget shown will run on an actual Yahoo Widget Engine. The widget retrieves it’s data from data sources by means of (simple) web services, so every platform supplying a web service runtime supporting SOAP will suffice. For ABAP backends this means 6.40+.

The speedometer widget


The widget resembles a classical speedometer design showing the actual value of a certain parameter. The parameter is queried at a customizable refreh rate directly from the relevant data source. All the data source system has to do is to implement a certain WSDL as follows:

<?xml version="1.0" encoding="utf-8"?>
  <wsdl:definitions targetNamespace="urn:sap-com:document:sap:soap:functions:mc-style"
      <xsd:schema xmlns:xsd=""
                  elementFormDefault="unqualified" attributeFormDefault="qualified">
        <xsd:element name="ZtwSpeedo">
              <xsd:element name="ParameterName" type="xsd:string"/>
        <xsd:element name="ZtwSpeedoResponse">
              <xsd:element name="MaxGauge" type="xsd:string"/>
              <xsd:element name="MinGauge" type="xsd:string"/>
              <xsd:element name="ParameterUnits" type="xsd:string"/>
              <xsd:element name="ParameterValue" type="xsd:string"/>
    <wsdl:message name="ZtwSpeedo">
      <wsdl:part name="parameters" element="tns:ZtwSpeedo"/>
    <wsdl:message name="ZtwSpeedoResponse">
      <wsdl:part name="parameters" element="tns:ZtwSpeedoResponse"/>
    <wsdl:portType name="ZTW_SPEEDO">
      <wsdl:operation name="ZtwSpeedo">
        <wsdl:input message="tns:ZtwSpeedo"/>
        <wsdl:output message="tns:ZtwSpeedoResponse"/>
    <wsdl:binding name="ZTW_SPEEDOSoapBinding" type="tns:ZTW_SPEEDO">
      <soap:binding style="document" transport=""/>
      <wsdl:operation name="ZtwSpeedo">
        <soap:operation soapAction=""/>
          <soap:body use="literal"/>
          <soap:body use="literal"/>
    <wsdl:service name="ZTW_SPEEDOService">
      <wsdl:port name="ZTW_SPEEDOSoapBinding" binding="tns:ZTW_SPEEDOSoapBinding">
        <soap:address location="http://the_server_url:8000/sap/bc/srt/rfc/sap/ZTW_SPEEDO?sap-client=200"/>

As one can see from the WSDL, the service is supposed to accept an input parameter ParameterName and returning the return parameters MaxGauge, MinGauge, ParameterUnits, ParameterValue. Obviously the data source system is responsible for the calibration of the speedometer by means of MinGauge and MaxGauge, in the above screenshot seen as 10 and 40.  The variable input parameter allows one service to return different KPIs. 

The implementation in ABAP

In our ABAP backend we follow an inside-out approach to create a webservice for the widget to use. First we create a function module using input and output parameters according to the above WSDL (and our implicite knowledge on how the web service wizard will convert parameter names)

*"---- ----------------------------------------------------------------- *"
*"Lokale Schnittstelle:
*"---- ----------------------------------------------------------------- 

case parameter_name.
     when 'TEST'.    
          parameter_value = '20'.    
          min_gauge       = '10'.    
          max_gauge       = '40'.    
          parameter_units = 'U/min'.
     when 'ADMISSIONS'.    
          select count(*) from nfal into parameter_value          
               where erdat >= sy-datum.    
          min_gauge       = '0'.    
          max_gauge     = '100'.    
          parameter_units = 'Admissions/Day'.   
     when 'ORDERS'.    
          select count(*) from n1corder into parameter_value
               where erdat >= sy-datum.
          min_gauge       = '0'.    
          max_gauge       = '100'.    
          parameter_units = 'Orders/Day'.   
     when others.    
          parameter_value = '0'.
          min_gauge       = '0'.    
          max_gauge       = '100'.    
          parameter_units = '[1]'.

The function module does some query depending on the input parameter and returns the expected values (the examples ‘ADMISSIONS’ and ‘ORDERS’ are from the healthcare industry solution so you have to adjust those queries to your needs). Of course, there’s no limit to the logic for calculating your KPI here as long as you return one parameter per when-statement in the end.   The calibration parameters should be set statically to some reasonable values according to performance or other business expectations.  The last step ist to run the web service wizard and release it for the SOAP runtime. 

Customizing the widget

Start the widget, right click on it and set some customizing settings. 


The dialog should be self-explaining. You have to tell the widget the service’s base URL, your credentials, which parameter you want to query and finally what caption you want to have on your widget. Immediately after you save your settings, the widget will make it’s first attempt to connect to the specified service.  If the widget is unable to connect to the service you will get an error message like the one in the following screen


In this example we get a 504 error, which points to some proxy problem. 

Multiple instances

‘Well’ you say, ‘nice, but what a cool key performance indicator must that be, being sufficient to jugde my enterprise’s state in solitude?’.  You might be trying to load a second instance but that doesn’t work. But here comes the simple trick: copy the .widget file to a new name in your widgets directory, start this copy and you’ll see that it tells you that you haven’t used that widget yet. Do your customization as explained above and you’ll get this 


The Enterprise Radar Cockpit

Now that we know that we can create a number of instances of the KPI Speedometer, we can go out to all of our SAP and legacy systems, tell the responsible people to implement that trivial web service and get back to us with the connection parameters once done. If there are slight adoptions necessary to the widget, it can easily be decompiled and those adoptions can be programmed in the file main.js.  Once our services and adoptions are in place our Enterprise Radar Cockpit might look like this: 


A Little Drawback and Hacker Challenge

Each instance of the KPI speedometer widget consumes abbout 10MB of memory. i have been testing and trying with a number of widgets but wasn’t able to find out what causes that memory consumption. Moreover I didn’t understand at all what determines the memory consumption of any widget. To me this looks some kind of random but this may well be attributed to my know-how.

So, maybe someone has a spare minute and debug it and find a way to reduce the memory consumption. Although some OS vendors force us to buy 4 gig minimum machines I think it’s strange that 10 widgets in the cockpit consume 100MB of memory.

Apart from that, have fun with the KPI Speedometer widget, downloadable here.

You must be Logged on to comment or reply to a post.
  • Anton, your gauge widget is a really nice solution.  I like the way it’s customizable for someone to hook it up and measure whatever data they prefer.  These type of handy tools are usually the ones that take off.  Great job!


  • Since metrics and KPIs are definately something to track in any business process improvement activity, I would think these aren’t just management widgets but also live BPX widgets as well.
    This looks very promising.  Thanks!
    Wouldn’t it be great if they could also indicate data that indicated revenue impacts…as in: look at how much this business process improvement saved.
    • Hi,

      sure it’s useful for the BPX too. As soon as you find significant parameters describing the actual efficiency/performance/state of your processes you can visualize it using this widget.

  • Hi Anton,
    I’m interesting in widget you’ve developed but I’m not able to download it from the url that you’ve posted.

    Stefano Pirola

    • hi stefano,

      glad you like to give it a try.

      Concerning your problem I don’t really undrestand it. I had several people who were not able to download it and much more people who have no problem downloading it.

      I tried it myself this moment and had no problem. It simply is a file on a webserver. The only special thing about it is the fact that it has a .widget extension and maybe your browswer tries to execute it instead of downloading it or there is some security measure on your client.

      I think right-clicking the file and “Save target as … ” should do the trick.

      If that does’t help please give me more info on what your browser says the problem is.

      regards, anton

      • Thanks Anton,
        it works; I’ve downloaded as changing the extension and everythink is ok.

        Thank you more for your promptly reply… now I do some tests.

        Stefano P.