Bubble Chart
A bubble chart draws bubbles for each point in a series. The chart expects three values per bubble: the domain (commonly the X-axis) value, the range (commonly the y-axis) value, and a third value (the Z value) that determines the size of the bubble to draw around the point.
The size of the bubble is derived from an algorithm that takes the Z value, divides it by the maximum Z value in the dataset, then multiplies that number by the max-bubble-size property value. See the section on required properties below for more information on the max-bubble-size property.
Dataset Guidelines
This chart expects its data as an XYZ dataset.
Required Properties
The following properties are required:
chart-type
<chart-type>BubbleChart</chart-type>
dataset-type
<dataset-type>XYZSeriesCollection</dataset-type>
max-bubble-size
The max-bubble-size property is defaulted to zero, so in order to see your bubbles, you'll need to set this property! The value should be between 1 and 100, as a percentage of smaller to larger.
<max-bubble-size>90</max-bubble-size>
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.
<chart> <!-- Define the chart type --> <chart-type>BubbleChart</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> <!-- General Chart Attributes --> <dataset-type>XYSeriesCollection</dataset-type> <!-- formatted label, using {0} - series name, {1} - x , {2} - y, {3} - z --> <bubble-label-content>{0} {1} In Stock {2} Ordered {3} Total Price</bubble-label-content> <bubble-label-z-format>$#,###</bubble-label-z-format> <!-- formatted using java decimal format, ie #,### --> <!-- General Chart Formatting Propeties --> <chart-background type="color">#FFffff</chart-background> <plot-background type="color">#ffffff</plot-background> <alpha>.70</alpha> <!-- 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> <!-- 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>
Unable to render embedded object: File (sample_bubble_chart.png) not found.