In my previous treemap post, I have shown how to connect an ILOG Elixir treemap to a Jira RSS feed. Now let’s try to enhance a bit this AIR application with more AIR and ILOG Elixir features.

One thing you would like to do is that instead of opening a web browser when selecting a given issue in the treemap, you might want to display the information about the issue inside the application itself. The nice thing with AIR is that it provides a web control trough the HTML class and thus we can leverage it in our application!

The first thing to do is to remove the itemClick listener that was calling the navigateToURL function. Once this is done we just create an HTML control and bind the location property of the control to the URL of the currently selected treemap item as in:

<mx:HTML location="{(treemap.selectedItems[0].link != null ?
                                     treemap.selectedItems[0].link : '')}"
  width="100%" height="100%"/>

Doing this is enough to make sure that when one is clicking on a treemap cell, the corresponding issue Jira page is displayed next to the treemap in the AIR application.

Another thing that is missing in our application, is the ability to understand what each color on the treemap is used for. Of course this is pretty obvious that red color means something more important than the green one but you might want to have more detailed information. For this purpose ILOG Elixir is providing you with the TreeMapLegend control. This class can either compute automatically the legend colors based on the color scheme of the treemap or, if the treemap is not using a color scheme (which is corresponding to our case here), you can directly fill it with TreeMapLegendItem. So we end up with something like the following:

<ilog:TreeMapLegend width="540">
  <ilog:TreeMapLegendItem color="{COLORS[0]}" label="blocker"/>
  <ilog:TreeMapLegendItem color="{COLORS[1]}" label="critical"/>
  <ilog:TreeMapLegendItem color="{COLORS[2]}" label="major"/>
  <ilog:TreeMapLegendItem color="{COLORS[3]}" label="minor"/>
  <ilog:TreeMapLegendItem color="{COLORS[4]}" label="trivial"/>
  <ilog:TreeMapLegendItem color="{COLORS[6]}" label="none"/>
  <ilog:TreeMapLegendItem color="{COLORS[7]}" label="unset"/>
</ilog:TreeMapLegend>

Our Jira treemap is starting to be a bit more useful when it comes to monitor your bugs, don’t hesitate to download the full Flex Builder project here and modify the RSS feed URL to point to your own Jira base and look at the result. If you have ideas about other features that could be useful to this application don’t hesitate to comment and I’ll try to come up with a third post to implement them!

Tags: air, ILOG Elixir, jira, rss, Treemap

Posted by Christophe Jolif in AIR, ILOG Elixir, Treemap. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.