Sha256: 3f3f1d393c91f894a20fb828612414d795285bbcd236f182cb6b0a5040b9ee88

Contents?: true

Size: 1.38 KB

Versions: 1

Compression:

Stored size: 1.38 KB

Contents

## Bubble chart
* This section describes how to create bubble chart with options.
* You can refer to the [Getting started](getting-started.md) for base installation of Toast UI Chart.

***

### Data type
Bubble chart use the coordinate data type.

#### Coordinate data type
Coordinate data type has `x` and `y` values, and it optionally has `r` or `label` values.


```javascript
var rawData = {
    series: [
        {
            name: 'Legend1',
            data: [{
                x: 10,
                y: 30,
                r: 25,
                label: 'Label1'
            }, {
                x: 20,
                y: 20,
                r: 10,
                label: 'Label2'
            }]
        },
        {
            name: 'Legend2',
            data: [{
                x: 5,
                y: 60,
                r: 30,
                label: 'Label3'
            }, {
                x: 50,
                y: 10,
                r: 20,
                label: 'Label4'
            }]
        }
    ]
};
```


***

### Creating a basic chart
A bubble chart displays three dimensions of data.

##### Example

```javascript
tui.chart.bubbleChart(container, rawData);
```

![Bubble chart](https://cloud.githubusercontent.com/assets/2888775/14973926/81e3feba-1129-11e6-86da-430110b240b5.png)

* _[Sample](https://nhnent.github.io/tui.chart/latest/tutorial-example05-01-bubble-chart-basic.html)_

Version data entries

1 entries across 1 versions & 1 rubygems

Version Path
tui_editor-rails-1.0.2.0 vendor/assets/components/tui-chart/docs/wiki/chart-types-bubble.md