Category: Component Best Practices

Introducing the Xcelsius Push Button

Written by: Ryan Goodman
Published: December 22nd, 2009
955 views

Since Xcelsius version 3.0 I have tirelessly explained to customers how to manipulate a toggle button to achieve push button functionality. I am happy to say that those days have finally come to an end!

With Xcelsius 2008 SP3, they have introduced a push button component. For a new user who just needs a pushbutton or gurus who have long used icons for transparent hotspots, this is a long awaited addition. In addition to simplifying pushbutton capabilities, this component will allow you to push an entire data range into a destination with the click of a button.

If you ever used transparent icons as hotspots, this will be the new component for achieving the same functionality with less work. In the example below, I saved myself

As you can see in the example, I have shown all 3 examples. The first button pushes a single value into the yellow destination. The second button has a range as the source data and destination. Finally the third image has a transparent pushbutton overlaid. The other nice thing about this component is it will NOT insert on load, so if you have multiple push buttons that insert into the same destination, you no longer have to play with the order in the object browser to get the right result.

Download Source Files
I included the Xcelsius help SWF inside of the dashboard so you can see for yourself how this component is configured. This component should have gone into my top 10, since I have already used it several times with lots of success. Thank you Xcelsius development team for making my life easier and giving me new out of the box functionality to write about!






GMaps Plugin Best Practices

Written by: Ryan Goodman
Published: July 9th, 2009
2899 views

Centigon Solutions GMaps Plugin for Xcelsius 2008 couples basic geographic analysis with BI dashboards without a server-side installation or GIS system. Maps have become a critical element of dashboarding by providing multi-dimensional analysis aligned to business KPIs. Using GMaps Plugin, you can drag and drop a Google Map onto your Xcelsius canvas, and have a sophisticated palette of options to align the map to your needs; all without writing a single line of code.

Below is a movie explaining GMaps Plugin for Xcelsius 2008, to provide a high level explanation.

For those looming questions about the technology, licensing, and everything in-between, you can view the GMaps Plugin FAQ

Finally, to see live explanation and demonstration of GMaps Plugin, you can view the following webinar: Introduction to GMaps Plugin for Xcelsius 2008

With a general understanding of the technology, I wanted to provide some best practices, as you start using GMaps Plugin with Xcelsius. If you obtain a GMaps Plugin trial version, the first thing that you will need to do is obtain a API key. This API key will only work for testing purposes with the trial (covered in the FAQ).

1. Sign up for a Google Maps API key
To obtain a Google Maps API key, you will need to enter a URL for the server where you intend to publish your SWF. If you do not intend to upload your Xcelsius generated SWF to a server for testing, any URL will do for testing inside of Xcelsius or on your local file system. If your using a proxy or do not know your URL, open a web page where you intend to access your SWF and enter the following Javascript into your browser window:


javascript:alert(window.location.host)

The resulting popup window will show the URL that you should provide when you obtain your free Google Maps API key.

2. Format labels using HTML text. GMaps Plugin provides basic controls over text formatting via the Appearance tab. GMaps Plugin labels property supports HTML formatting, allowing you to implement any combination of text formatting, images, or URLs. This HTML formatting is displayed when clicking on any icon on the Google Map. The trick to HTML formatting is to concatenate multiple cells together.

**To implement HTML formatting, all text must be nested within the <HTML> </HTML tags.

Excel Formula
="<HTML>"&F19&"<FONT SIZE='11' face='Verdana'><b>"&H19&"</b><br>
"&I13&TEXT(I19,"$#,###")&"<br>
"&J13&TEXT(J19,"$#,###")&"<br>
"&G19&"<br><br><br></FONT><HTML>"

Actual HTML generated from Concatenate
<HTML>
<img src="http://www.centigonsolutions.com/components/images/
icon_background.jpg" />
<FONT SIZE='11' face='Verdana'><b>UK</b><br>
Last Year: $294,829<br>
This Year: $204,101<br>
<a href="http://ryamgoodman.net?Spain">blog link</a><br><br><br>
</FONT>
<HTML>

Result

Download Source File

3. Dynamic Icon Colors
By default, GMaps Plugin provides control over all icons within a series. If you decide to implement alert icons or need to control each icon's color independently, you can utilize the dynamic color property, located on the General Tab. Color is controlled using basic hexadecimal color coding, with a 0X prefix. The following are example hexadecimal codes that can be utilized to dynamically change icon color:

Red= 0XDD0000
Yellow 0XEEEE44
Green 0X00BB55

Sample alert logic if A1 is the value
=IF(A1>20.01,”0X00BB55”,IF(AND(
A1<20,A1>15),”0XEEEE446”,”0X00BB55”))

Download Source File

4. Bind a Destination cell The map component functions as a selector, but only supports the Position insertion method. That means you will need to couple this plugin with Excel logic or a Source Data component to drive functionality. A nice trick that I use was outlined in a previous article, where I use a hidden selector combined with a map to drive dashboard interactivity. Click here to view article.

I will continue to refine this posting with screen shots and practices to assist you in development. The included documentation actually does a pretty good job of outlining some of theses concepts. If you have any specific challenges, let me know and I will document workarounds and best practices and log enhancement requests for you.






Xcelsius 2008 Image Component

Written by: Ryan Goodman
Published: August 8th, 2008
3925 views

Xcelsius 2008 supports several new image formats using the image component. For those of you who are not familiar with the image component, it is located in Art and Backgrounds and provides the ability to import and embed your own artwork or logos.

Xcelsius 2008 supports new image formats including JPG, GIF, PNG and BMP. Here are a few basic tips to choose the correct image format...

You want to gravitate toward JPG and GIF rather than BMP because they are compressed formats that will not bloat the size of your SWF. PNG is nice because you can create images with transparent backgrounds that look much nicer than GIF files. The problem with the Xcelsius image component is that GIF and PNG transparency does not work, meaning you still get a white border around your images.

If your artwork originates as a vector image, you may want to import that into Flash and create a SWF. If you are trying to import your logo, you may want to check with you marketing department to see if they can export it to a SWF. Adobe Illustrator has an export to SWF option which will give you the cleanest looking logo.






Xcelsius 2008 Dual Axis Chart

Written by: Ryan Goodman
Published: May 22nd, 2008
6558 views

Xcelsius 2008 introduced a global dual axis chart capability that works quite well. I put together a simple example below, illustrating the technology. A dual axis chart is relevant when you are trying to draw indirect correlations between two different measures. I have never seen an effective use of dual axis charts where same measure is displayed on both y axis. The Y Axis toggle in Xcelsius is locate in the general tab for most vertical oriented charts.

Here are a few best practices that make these charts easier to visually digest in Xcelsius:

  1. Always include vertical axis labels for the left and right Y axis.
  2. Always show the legend on the top or bottom of the chart to ensure there is enough room for both vertical axis labels and titles.
  3. Use colors that make it easy to differentiate between each series.

Xcelsius 2008 dual axis chart

Download Source Files






Using the Xcelsius 2008 Color Scheme Builder

Written by: Ryan Goodman
Published: May 14th, 2008
3469 views

Xcelsius 2008 features a robust color scheme management. Those of you who used the style creator in Xcelsius 4.5, you may have written off the Color Scheme builder, but I have found it extremely useful. It is quite obvious that the Xcelsius dev team put a lot of time and effort into making the global aesthetics management much more powerful with Xcelsius 2008. The one thing they did not provide is some type of indication of what the base colors do. Here is a reference to how changing the colors in the Color Scheme window will affect your dashboard. As you explore the Advanced Settings, changing the base colors will trickle down, and then you can have granular control over individual components. At the end of the day, I have found this to be a valuable time saver when developing multiple dashboards for the same customer.
Xcelsius 2008 Color Scheme

  1. Text Color
  2. Default Button Colors, Chart Background Colors, Map Color
  3. Canvas Color, Chart Axis Color
  4. Background Component Color, Chart Gridlines Color, Mouse Over Color
  5. Chart Series 1 Color, Single Value Marker Color, Active Selector Color
  6. Chart Series 2 Color
  7. Chart Series 3 Color
  8. Chart Series 4 Color
  9. Chart Series 5 Color
  10. Disabled Items, Single Value Track Color





1 2 >>

©2010 by Ryan Goodman •

Contact • Credits: blog software | hosting