FusionCharts uses XML (eXtensible Markup Language) to
create and manipulate charts. XML is a simple and structured language,
that is easy to read and understand. In case you're not aware of XML as
yet, here are a few basics things to know about an XML document:
- An XML document is a simple text file consisting of tags and data
associated with them.
- You can make up your own tags like <mytag></mytag>
to store data
- Every opening tag requires a matching closing tag like <name>
requires </name>. e.g., <name>John
Doe</name>. If an element has no content, the opening and
closing tags may be combined into a single "shortcut" tag
such as <name/>.
- XML tags are case-sensitive. So <name>
should be closed with </name> and
not </Name> or
</NAME> or any other variant of the same.
- You can define attributes for a tag to render more details. e.g.,
<name isPetName='true'>John Doe</name>. Here isPetName
is an attribute of the name element.
- Special characters like ' (quote), " (double quote), % (percentage)
etc are to be replaced by the XML converts. Like, the character "
(double quote) in a string constant must be denoted as ".
Similarly, %
needs to be replaced by %25.
The entire FusionCharts chart is controlled by XML parameters i.e., you
use XML to define the cosmetic as well as functional properties for the
chart. There are a lot of properties depending on each chart type, that
you can define. However, it is not necessary for you to define all the
possible attributes for a single chart. For an example, if you do not
want to change the default setting of the canvas (color, alpha etc.),
you don't need to define any attributes for the canvas - the pre-assigned
attributes will take over. Thus, each chart can be generated using very
minimal attributes without concern for every finer details. As you become
more proficient in the chart attributes, you could use it to create complex
charts with a wide range of features and an informative appearance.
FusionCharts has a specific XML structure for each chart. Broadly, we
define the XML structure into two types depending on the chart type:
- Single Series Charts
Single Series Charts are those which depict only one set of data on
the chart. Like, our previous example of Monthly sales summary was a
single series chart, as we had just one data set (i.e., say data for
1 year). In that chart, we were not comparing data between two datasets
(e.g., monthly sales comparison between two or more years).
XML for the single series chart are the simplest to understand, as we've
already seen in our previous examples.
- Multi-Series Charts
Multi-series charts are used to compare 2 or more datasets like
monthly comparison for 2 or more years. Under multi-series charts, we
can define the following subcategories:
- Standard Multi-series Charts
The standard multi-series charts, like multi-series column, line,
area etc., are used for straightforward comparison of various datasets
on the chart.
- Stacked Charts
Stacked charts, like stacked column, area etc., are used
to compare cumulative or grouped data. e.g., monthly summary of
sales on a chart. But, we also wanted to show which part of revenue
came from products and which part from services. So, the best chart
to display such data is a stacked chart, where each month represents
a data column and the column is divided into two parts- one representing
service and the other product.
- Combination Charts
Combination Charts are a combination of two or more charts.
- Multi-series XY Plot Charts
XY Plot Charts are charts where both the axes are numeric, like
bubble and scatter chart.
Let's quickly study the XML structure for a single series chart. |