In this section, we'll create a simple bullet graph to show the process involved in the same. |
||||||||||||
Steps | ||||||||||||
The following tasks involved to create a a bullet graph:
Let's now explain how to perform each of these. |
||||||||||||
Creating the XML |
||||||||||||
Defining the color range | ||||||||||||
We'll plot a simple horizontal bullet graph to show the revenue figures for a fictional company. To do so, we need to first decide the qualitative ranges of revenue performance for that company. Let's assume it to something as shown below: |
||||||||||||
|
||||||||||||
Also, we intend to plot the following values: Intended revenue: $80,000 |
||||||||||||
Converting to XML | ||||||||||||
We will be creating a XML called Data.xml in the same location as our MXML apllication. The XML for the above data would look similar to the one shown below: | ||||||||||||
<chart lowerLimit='0' upperLimit='100' caption='Revenue' subcaption='US $ (1,000s)' numberPrefix='$' numberSuffix='K' showValue='1' > <colorRange> <color minValue='0' maxValue='50' color='A6A6A6'/> <color minValue='50' maxValue='75' color='CCCCCC'/> <color minValue='75' maxValue='100' color='E1E1E1'/> </colorRange> <value>78.9</value> <target>80</target> </chart> |
||||||||||||
As you see in the above code we have performed the following tasks:
When you now run this XML against the horizontal bullet graph, you'll get a chart similar to the figure shown below: |
||||||||||||
![]() |
||||||||||||
Building the ChartWe will assume that you already have a project open and an MXML application, where you are ready to insert your chart. Begin by switching to the
The equivalent code in <?xml version="1.0" encoding="utf-8"?> The file Data.xml is our previously created XML file. The file should be present in the same location as your MXML file. If not, you should specify the path of the file in the FCDataURL property. If you do not wish to create a separate XML data file, you can also bind the data as a string to the FCDataXML property. |