| Wiki Markup |
|---|
{scrollbar}
h2. |
Bar\Line
...
Combination
...
Chart
...
| Anchor | ||||
|---|---|---|---|---|
|
The bar\line
...
combination
...
chart
...
plots
...
a
...
set
...
of
...
values
...
as
...
bars
...
for
...
each
...
specified
...
series
...
in
...
the
...
given
...
dataset.
...
This
...
chart
...
will
...
also
...
plot
...
specified
...
series
...
as
...
lines,
...
using
...
the
...
right
...
axis
...
as
...
a
...
range
...
axis
...
for
...
the
...
line
...
series,
...
and
...
the
...
left
...
axis
...
as
...
the
...
range
...
axis
...
for
...
the
...
bars.
...
Dataset
...
Guidelines
...
This
...
chart
...
expects
...
its
...
data
...
as
...
a
...
...
...
.
Required Properties
The following properties are required:
chart-type
| Code Block | ||||
|---|---|---|---|---|
| ||||
<chart-type>BarLineChart</chart-type>
{code}
* |
bar-series
...
Add
...
one
...
series
...
element
...
per
...
series
...
that
...
should
...
be
...
plotted
...
as
...
bars.
...
| Code Block |
|---|
<bar-series>
<series>actual</series>
<series>budget</series>
</bar-series>
{code}
* |
line-series
...
Add
...
one
...
series
...
element
...
per
...
series
...
that
...
should
...
be
...
plotted
...
as
...
lines.
...
| Code Block |
|---|
<line-series>
<series>variance</series>
</line-series>
{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 in the example below.
| Code Block | ||||
|---|---|---|---|---|
| ||||
<chart>
<!-- Define the chart type -->
<chart-type>BarLineChart</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>
<!-- Map Series to Chart Type -->
<bar-series>
<series>TOTAL</series>
<series>COST</series>
</bar-series>
<line-series>
<series>MARGIN</series>
</line-series>
<!-- General Chart Attributes -->
<orientation>vertical</orientation>
<is-stacked>false</is-stacked>
<is-3D>false</is-3D>
<height-3d>1</height-3d>
<is-glass>false<glass>true</is-glass>
<is-sketch>false</is-sketch>
<!-- additional properties specific to sketch charts -->
<fun-factor>10</fun-factor>
<outline-color-palette>
<color>#FF0000</color>
<color>#00ff00</color>
</outline-color-palette>
<!-- General Chart Formatting Propeties -->
<chart-background type="color">#FFffff</chart-background>
<plot-background type="color">#ffffff</plot-background>
<alpha>.70</alpha>
<!-- Define what to display in hover tips -->
<!-- <tooltip> -->
<!-- #top# -->
<!-- #bottom# -->
<!-- #val# -->
<!-- #x_label# -->
<!-- #key# -->
<!-- </tooltip> -->
<!-- X-Axis properties (domain)-->
<domain-title>Domain Title</domain-title>
<domain-title-font>
<font-family>Arial</font-family>
<size>14</size>
<is-bold>false</is-bold>
</domain-title-font>
<domain-color>#000000</domain-color>
<domain-grid-color>#ffffff</domain-grid-color>
<domain-stroke>1</domain-stroke>
<!-- Y-Axis properties (range) -->
<range-title>Range Title</range-title>
<range-title-font>
<font-family>Arial</font-family>
<size>14</size>
<is-bold>false</is-bold>
</range-title-font>
<range-minimum></range-minimum>
<range-maximum></range-maximum>
<range-color>#000000</range-color>
<range-grid-color>#eaeaea</range-grid-color>
<range-stroke>1</range-stroke>
<range-steps>6</range-steps>
<!-- Secondary Y-Axis properties (line-range) -->
<lines-range-minimum>0<minimum>40</lines-range-minimum>
<lines-range-maximum>100<maximum>60</lines-range-maximum>
<lines-range-color>#000000</lines-range-color>
<lines-range-stroke>1</lines-range-stroke>
<line-range-steps>6</line-range-steps>
<!-- Specify the color palette for the chart -->
<color-palette>
<color>#0f3765</color>
<color>#880a0f</color>
<color>#B09A6B</color>
<color>#772200</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>#8b2834</color>
</color-palette>
</chart>
{code} |
