| Wiki Markup |
|---|
{scrollbar}
h2. |
Area
...
Chart
...
| Anchor | ||||
|---|---|---|---|---|
|
The area chart plots a set of values on a line per series, and fills the background of the plot area with the series color for each series in the given dataset.
Note: Unlike the ChartComponent (jFreeChart based), the Flash Area chart does not stack the area.
Dataset Guidelines
This chart expects its data as a categorical dataset.
Required Properties
The only property an area chart requires is the appropriate chart-type.
| Code Block | ||||
|---|---|---|---|---|
| ||||
<chart-type>AreaChart</chart-type>
{code}
|
The
...
example
...
below
...
contains
...
the
...
full
...
set
...
of
...
additional
...
supported
...
properties
...
with
...
comments
...
on
...
its
...
purpose
...
and
...
valid
...
values.
...
It
...
is
...
recommended
...
that
...
new
...
users
...
start
...
with
...
this
...
example
...
as
...
a
...
starting
...
place
...
for
...
building
...
your
...
first
...
flash
...
chart.
...
Example
The following chart definition will produce the chart you see below:
| Code Block | ||||
|---|---|---|---|---|
| ||||
<chart>
<!-- Define the chart type -->
<chart-type>AreaChart</chart-type>
<!-- Specify the title of the chart -->
<title>Chart Title</title>
<title-font>
<font-family>Arial</font-family>
<size>18</size>
<is-bold>true</is-bold>
</title-font>
<!-- Area Chart properties -->
<line-width>2.0</line-width>
<dot-style>hollow</dot-style> <!-- values: dot, normal, hollow -->
<dot-width>5</dot-width>
<alpha>.95</alpha>
<!-- General Chart Propeties -->
<chart-background type="color">#FFFFFF</chart-background>
<plot-background type="color">#FFFFFF</plot-background>
<!-- X-Axis properties (domain) -->
<domain-title>Domain Title</domain-title>
<domain-title-font>
<font-family>Arial</font-family>
<size>14</size>
<is-bold>true</is-bold>
</domain-title-font>
<domain-color>#000000</domain-color> <!-- color of x-axis -->
<domain-grid-color>#CCCCCC</domain-grid-color> <!-- color of vertical grid lines -->
<domain-stroke>1</domain-stroke> <!-- thickness of x-axis -->
<!-- Y-Axis properties (range) -->
<range-title>Range Title</range-title>
<range-title-font>
<font-family>Arial</font-family>
<size>14</size>
<is-bold>true</is-bold>
</range-title-font>
<range-minimum></range-minimum> <!-- defines minimum starting point for y-axis range -->
<range-maximum></range-maximum> <!-- defines maximum ending point for y-axis range -->
<range-color>#000000</range-color> <!-- color of y-axis -->
<range-grid-color>#CCCCCC</range-grid-color> <!-- color of horizontal grid lines -->
<range-stroke>1</range-stroke> <!-- thickness of y-axis -->
<range-steps>8</range-steps> <!-- specify number of ticks, defaults to auto-calculated number -->
<!-- Specify the color palette for the chart -->
<color-palette>
<color>#DB0000</color>
<color>#B09A6B</color>
<color>#2C00A8</color>
<color>#C52F0D</color>
<color>#123D82</color>
<color>#4A0866</color>
<color>#445500</color>
<color>#FFAA00</color>
<color>#1E8AD3</color>
<color>#AA6611</color>
<color>#772200</color>
<color>#0f3765</color>
<color>#B09A6B</color>
</color-palette>
</chart>
{code}
!flash_area.jpg! |
