Skip to Content
Actions

[HOW TO] Dynamic Positioning of Objects in Xcelsius / Dashboards (In 2 easy steps!)

July 1, 2013 | 80 Views |
 bidashboardsdynamicxcelsius bi
Follow

One of the most common questions regarding Dashboard Design concerns the ability to change an object’s position dynamically.  This opens up a new realm of possibilities with dynamic labels in charts, dials and sliders which move, dragging & dropping objects, and so on.

Instead of answering these questions over and over, I’ve decided to put my answer into a neat little package.  Now I can just link you here whenever you ask!

These steps look a lot more complicated than they really are, because we’ll be manually editing the raw XML files in Notepad.  Be brave, and I’ll try to guide you closely.

1. Add the object you want to move dynamically

First, we add 3 objects to the dashboard:

  1. Icon Component: this is the object we’ll be moving.  This could be anything you want, but I’ll use the Icon because it’s a clear and big green dot.  Set the following properties:
    1. Dynamic Visibility Status: B1
    2. Dynamic Visibility Key: B2

     These bindings are just done for future convenience.  In the next step, we’ll manually edit the text file and bind the ‘x-position’ to B1 and the ‘y-position’ to B2.

   2. Two Value Components: these will control the ‘x’ and ‘y’ position of the object.  Give them the following properties:

    1. Minimum value: 0
    2. Maximum value: 1000
    3. 1st Value component: Data = B1
    4. 2nd Value component: Data = B2

/wp-content/uploads/2013/07/image1_239442.png

2. Edit the raw Xcelsius file (This is where the magic happens)

Now follow these steps closely:

  1. Save and exit your dashboard.  Save it as ‘dashboard.xlf’ on your desktop.
  2. Rename the .xlf file into .zip (e.g., dashboard.xlf –> dashboard.zip)
  3. Open the .zip file; you’ll find a file called “document.xml”.

/wp-content/uploads/2013/07/image2_239443.png

     4. Copy ‘document.xml’ onto your desktop, then right-click and go to Edit.  It will open with Notepad.

Yes, this file looks like a complicated mess, so bear with me.  The file is just a big list of properties for all the objects on my spreadsheet.  There are 3 main blocks of text: one for the Icon component and 2 for the Value components.  If you’re curious, read through it for a few minutes and it will begin to make sense.  If you’re not curious, just follow these steps blindly to continue:

     5. Search for the word “displayStatus” and replace it with “x”

     6. Search for the word “displayKey” and replace it with “y”

/wp-content/uploads/2013/07/image3_239444.png

     7. Now save and exit ‘document.xml’, and copy it back into the dashboard.zip file. 

     8. Close the zip folder, and rename ‘dashboard.zip’ to ‘dashboard.xlf’

     9. Open ‘dashboard.xlf’ with Xcelsius.

You’re done!

Just put values in your two Value boxes and see the Icon button move around.

So what did we just do?

This all went a bit quickly, so here’s what happened:

     1. In Step 1, we bound the dynamic visibility of the Icon component to cells B1 and B2.  By doing this, Xcelsius added a few lines of code to document.xml that we’ll use in Step 2.

     2. When we edited document.xml, we changed this binding: now, instead of binding the dynamic visibility to B1 and B2, we bound the position of the object to B1 and B2.

     3. Since the two Value box components are bound to B1 and B2, you can use them to move the Icon component around at your leisure.

What else can we use this for?

This general principle can be used to move any component dynamically.  Over the next few months, I’ll write a few additional blog posts and technical documents describing some of the more exciting possibilities, such as Bubble Charts with dynamically moving labels, the ability to drag & drop components in the dashboard, or expanding / shrinking menus.

To report this post you need to login first.

18 Comments

You must be Logged on to comment or reply to a post.

  4. Peter Pauen

    not supported by the editing interface at all –> error-prone

    typo or when mistakenly editing the wrong line –> your dasboard is corrupted forever –> dangerous

    maintanence very hard to do, if possible at all

    so, all in all, NOT recommended

    (0) 
    1. Alex Yale Post author

      I would argue that this is no more error-prone or difficult to maintain than programming a php or aspx interface between Xcelsius and your database, or than programming your own dashboard using Javascript, or even than hand-coding the HTML page in which your swf file sits, all of which are extremely common.

      Of course, it would be better if it were supported by the interface, but that’s up to SAP.

      (0) 
    1. Alex Yale Post author

      Hi Harshil,

      If displayStatus and displayValue are not in document.xml, it means that you did not bind the Dynamic Visibility of the Icon Component to the spreadsheet.  See step 1-1.

      (0) 
  11. Steve Bernier

    Hi,

    Thanks for this trick,

    Unfortunately it’s not working on my side the .xlf is not transfer into zip. after renaming it. I tried to send it to and then compressed file and nothing (no xml file) in the .zip. Any ideas?

    Regards,

    Steve

    (0) 

Leave a Reply