$.jqplot.BubbleRenderer

Plugin renderer to draw a bubble chart. A Bubble chart has data points displayed as colored circles with an optional text label inside. To use the bubble renderer, you must include the bubble renderer like:

>     <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.bubbleRenderer.js"></script>

Data must be supplied in the form:

>     [[x1, y1, r1, <label or {label:'text', color:color}>], ...]

where the label or options object is optional.

Note that all bubble colors will be the same unless the “varyBubbleColors” option is set to true. Colors can be specified in the data array or in the seriesColors array option on the series. If no colors are defined, the default jqPlot series of 16 colors are used. Colors are automatically cycled around again if there are more bubbles than colors.

Bubbles are autoscaled by default to fit within the chart area while maintaining relative sizes. If the “autoscaleBubbles” option is set to false, the r(adius) values in the data array a treated as literal pixel values for the radii of the bubbles.

Properties are passed into the bubble renderer in the rendererOptions object of the series options like:

>     seriesDefaults: {
>         renderer: $.jqplot.BubbleRenderer,
>         rendererOptions: {
>             bubbleAlpha: 0.7,
>             varyBubbleColors: false
>         }
>     }

Summary

$.jqplot.BubbleRenderer | Plugin renderer to draw a bubble chart.
Properties |
varyBubbleColors | True to vary the color of each bubble in this series according to the seriesColors array.
autoscaleBubbles | True to scale the bubble radius based on plot size.
autoscaleMultiplier | Multiplier the bubble size if autoscaleBubbles is true.
autoscalePointsFactor | Factor which decreases bubble size based on how many bubbles on on the chart.
escapeHtml | True to escape html in bubble label text.
highlightMouseOver | True to highlight bubbles when moused over.
highlightMouseDown | True to highlight when a mouse button is pressed over a bubble.
highlightColors | An array of colors to use when highlighting a slice.
bubbleAlpha | Alpha transparency to apply to all bubbles in this series.
highlightAlpha | Alpha transparency to apply when highlighting bubble.
bubbleGradients | True to color the bubbles with gradient fills instead of flat colors.
showLabels | True to show labels on bubbles (if any), false to not show.

### Properties

### varyBubbleColors

> this.varyBubbleColors = true

True to vary the color of each bubble in this series according to the seriesColors array. False to set each bubble to the color specified on this series. This has no effect if a css background color option is specified in the renderer css options.

### autoscaleBubbles

> this.autoscaleBubbles = true

True to scale the bubble radius based on plot size. False will use the radius value as provided as a raw pixel value for bubble radius.

### autoscaleMultiplier

> this.autoscaleMultiplier = 1.0

Multiplier the bubble size if autoscaleBubbles is true.

### autoscalePointsFactor

> this.autoscalePointsFactor = -0.07

Factor which decreases bubble size based on how many bubbles on on the chart. 0 means no adjustment for number of bubbles. Negative values will decrease size of bubbles as more bubbles are added. Values between 0 and -0.2 should work well.

### escapeHtml

> this.escapeHtml = true

True to escape html in bubble label text.

### highlightMouseOver

> this.highlightMouseOver = true

True to highlight bubbles when moused over. This must be false to enable highlightMouseDown to highlight when clicking on a slice.

### highlightMouseDown

> this.highlightMouseDown = false

True to highlight when a mouse button is pressed over a bubble. This will be disabled if highlightMouseOver is true.

### highlightColors

> this.highlightColors = []

An array of colors to use when highlighting a slice. Calculated automatically if not supplied.

### bubbleAlpha

> this.bubbleAlpha = 1.0

Alpha transparency to apply to all bubbles in this series.

### highlightAlpha

> this.highlightAlpha = null

Alpha transparency to apply when highlighting bubble. Set to value of bubbleAlpha by default.

### bubbleGradients

> this.bubbleGradients = false

True to color the bubbles with gradient fills instead of flat colors. NOT AVAILABLE IN IE due to lack of excanvas support for radial gradient fills. will be ignored in IE.

### showLabels

> this.showLabels = true

True to show labels on bubbles (if any), false to not show.

> this.varyBubbleColors = true

True to vary the color of each bubble in this series according to the seriesColors array.

> this.autoscaleBubbles = true

True to scale the bubble radius based on plot size.

> this.autoscaleMultiplier = 1.0

Multiplier the bubble size if autoscaleBubbles is true.

> this.autoscalePointsFactor = -0.07

Factor which decreases bubble size based on how many bubbles on on the chart.

> this.escapeHtml = true

True to escape html in bubble label text.

> this.highlightMouseOver = true

True to highlight bubbles when moused over.

> this.highlightMouseDown = false

True to highlight when a mouse button is pressed over a bubble.

> this.highlightColors = []

An array of colors to use when highlighting a slice.

> this.bubbleAlpha = 1.0

Alpha transparency to apply to all bubbles in this series.

> this.highlightAlpha = null

Alpha transparency to apply when highlighting bubble.

> this.bubbleGradients = false

True to color the bubbles with gradient fills instead of flat colors.

> this.showLabels = true

True to show labels on bubbles (if any), false to not show.
Close