
Bubble Chart
Plot
The plot is a part of keen.io/charts
package and can be used in React
environment as standalone component.
API
Property | Description | Type | Default |
---|---|---|---|
data | Chart data | Record<string, any> | - |
labelSelector | Name of data object property used to create labels on axis | string | - |
minValue | Minimum value for axis | number or “auto” | “auto” |
maxValue | Maximum value for axis | number or “auto” | “auto” |
valueKey | Key used to calculate the area dimension | string | “value” |
minAreaRadius | Minimum area radius | number | 5 |
maxAreaRadius | Maximum area radius | number | 40 |
xScaleSettings | X Scale settings | ScaleSettings | { type: ‘linear’ } |
yScaleSettings | Y Scale settings | ScaleSettings | { type: ‘linear’ } |
xAxisTitle | Title for X Axis | string | - |
yAxisTitle | Title for Y Axis | string | - |
xDomainKey | Key used to create domain for X scale | string | - |
yDomainKey | Key used to create domain for Y scale | string | - |
theme | Theme used for chart styling | Theme | Keen Theme |
svgDimensions | SVG height and width | Dimension | “auto” |
margins | SVG margins | Margins | { top: 50, right: 20, bottom: 50, left: 40 } |
Theme
List of theme properties supported by Bubble Chart widget.
Property | Description | Type |
---|---|---|
colors | Colors applied on bars | string[] |
axisX | Axis X theme settings | Axis |
axisY | Axis Y theme settings | Axis |
gridX | Grid X theme settings | Grid |
girdY | Grid Y theme settings | Grid |
tooltip | Tooltip settings | Tooltip |