# data

Chart-specific data. Use the input structure for the chart, such as a tree, nodes and links, or OHLC records. Not every type in this union applies to every chart.

Canonical: https://chart.syidax.com/docs/options/data/

<a id="definition"></a>

## Definition

| Item | Value |
| --- | --- |
| JavaScript property | `data` |
| HTML attribute | Pass objects, arrays, and callbacks as JavaScript properties |
| Type | `RadarChartData \| FunnelChartData \| ReadonlyArray<DumbbellDatum> \| ReadonlyArray<DotPlotDatum> \| ReadonlyArray<TornadoDatum> \| ReadonlyArray<VariwideDatum> \| ChordData \| NetworkGraphData \| TreemapData \| SankeyData \| ErrorBarData \| WaterfallData \| BubbleData \| BoxPlotData \| CandlestickData \| CalendarHeatmapData \| SpectrogramInput \| DensityMapInput \| HeatmapData \| SunburstData \| IcicleData \| GanttData \| ParallelCoordinatesData \| DendrogramData \| GeoMapData \| Surface3DData \| Scatter3DData \| FlowLinesData \| ThemeRiverData \| Bar3DData` |
| Default | `undefined` |

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

- [RadarChartData](https://chart.syidax.com/docs/types/RadarChartData.md) — Type definition
- [FunnelChartData](https://chart.syidax.com/docs/types/FunnelChartData.md) — Type definition
- [DumbbellDatum](https://chart.syidax.com/docs/types/DumbbellDatum.md) — Type definition
- [DotPlotDatum](https://chart.syidax.com/docs/types/DotPlotDatum.md) — Type definition
- [TornadoDatum](https://chart.syidax.com/docs/types/TornadoDatum.md) — Type definition
- [VariwideDatum](https://chart.syidax.com/docs/types/VariwideDatum.md) — Type definition
- [ChordData](https://chart.syidax.com/docs/types/ChordData.md) — Type definition
- [NetworkGraphData](https://chart.syidax.com/docs/types/NetworkGraphData.md) — Type definition
- [TreemapData](https://chart.syidax.com/docs/types/TreemapData.md) — Type definition
- [SankeyData](https://chart.syidax.com/docs/types/SankeyData.md) — Type definition
- [ErrorBarData](https://chart.syidax.com/docs/types/ErrorBarData.md) — Type definition
- [WaterfallData](https://chart.syidax.com/docs/types/WaterfallData.md) — Type definition
- [BubbleData](https://chart.syidax.com/docs/types/BubbleData.md) — Type definition
- [BoxPlotData](https://chart.syidax.com/docs/types/BoxPlotData.md) — Type definition
- [CandlestickData](https://chart.syidax.com/docs/types/CandlestickData.md) — Type definition
- [CalendarHeatmapData](https://chart.syidax.com/docs/types/CalendarHeatmapData.md) — Type definition
- [SpectrogramInput](https://chart.syidax.com/docs/types/SpectrogramInput.md) — Type definition
- [DensityMapInput](https://chart.syidax.com/docs/types/DensityMapInput.md) — Type definition
- [HeatmapData](https://chart.syidax.com/docs/types/HeatmapData.md) — Type definition
- [SunburstData](https://chart.syidax.com/docs/types/SunburstData.md) — Type definition
- [IcicleData](https://chart.syidax.com/docs/types/IcicleData.md) — Type definition
- [GanttData](https://chart.syidax.com/docs/types/GanttData.md) — Type definition
- [ParallelCoordinatesData](https://chart.syidax.com/docs/types/ParallelCoordinatesData.md) — Type definition
- [DendrogramData](https://chart.syidax.com/docs/types/DendrogramData.md) — Type definition
- [GeoMapData](https://chart.syidax.com/docs/types/GeoMapData.md) — Type definition
- [Surface3DData](https://chart.syidax.com/docs/types/Surface3DData.md) — Type definition
- [Scatter3DData](https://chart.syidax.com/docs/types/Scatter3DData.md) — Type definition
- [FlowLinesData](https://chart.syidax.com/docs/types/FlowLinesData.md) — Type definition
- [ThemeRiverData](https://chart.syidax.com/docs/types/ThemeRiverData.md) — Type definition
- [Bar3DData](https://chart.syidax.com/docs/types/Bar3DData.md) — Type definition

<a id="example"></a>

## Configuration example

```javascript
// Register sy-bubble-chart and create the element before configuring it.
chart.data = [
  {
    "x": 20,
    "y": 70,
    "z": 30,
    "name": "A"
  },
  {
    "x": 45,
    "y": 55,
    "z": 60,
    "name": "B"
  },
  {
    "x": 75,
    "y": 80,
    "z": 45,
    "name": "C"
  },
  {
    "x": 60,
    "y": 30,
    "z": 20,
    "name": "D"
  }
];
```

- [Bubble · Complete examples and API](https://chart.syidax.com/docs/components/bubble.md)

<a id="related"></a>

## Related documentation

A property with the same name may have different types and defaults across charts. When using a direct tag, follow that chart's documentation below.

- [Shared facade and direct tags](https://chart.syidax.com/docs/concepts.md)
- [sy-bubble-chart](https://chart.syidax.com/docs/components/bubble.md#property-data)
- [sy-polar-chart](https://chart.syidax.com/docs/components/polar.md#property-data)
- [sy-radar-chart](https://chart.syidax.com/docs/components/radar.md#property-data)
- [sy-dumbbell-chart](https://chart.syidax.com/docs/components/dumbbell.md#property-data)
- [sy-tornado-chart](https://chart.syidax.com/docs/components/tornado.md#property-data)
- [sy-dot-plot-chart](https://chart.syidax.com/docs/components/dot-plot.md#property-data)
- [sy-variwide-chart](https://chart.syidax.com/docs/components/variwide.md#property-data)
- [sy-waterfall-chart](https://chart.syidax.com/docs/components/waterfall.md#property-data)
- [sy-box-plot-chart](https://chart.syidax.com/docs/components/box-plot.md#property-data)
- [sy-error-bar-chart](https://chart.syidax.com/docs/components/error-bar.md#property-data)
- [sy-heatmap](https://chart.syidax.com/docs/components/heatmap.md#property-data)
- [sy-calendar-heatmap](https://chart.syidax.com/docs/components/calendar-heatmap.md#property-data)
- [sy-density-map](https://chart.syidax.com/docs/components/density-map.md#property-data)
- [sy-spectrogram](https://chart.syidax.com/docs/components/spectrogram.md#property-data)
- [sy-funnel-chart](https://chart.syidax.com/docs/components/funnel.md#property-data)
- [sy-funnel-chart](https://chart.syidax.com/docs/components/pyramid.md#property-data)
- [sy-tilemap](https://chart.syidax.com/docs/components/tilemap.md#property-data)
- [sy-treemap](https://chart.syidax.com/docs/components/treemap.md#property-data)
- [sy-sunburst](https://chart.syidax.com/docs/components/sunburst.md#property-data)
- [sy-icicle](https://chart.syidax.com/docs/components/icicle.md#property-data)
- [sy-dendrogram](https://chart.syidax.com/docs/components/dendrogram.md#property-data)
- [sy-sankey](https://chart.syidax.com/docs/components/sankey.md#property-data)
- [sy-chord](https://chart.syidax.com/docs/components/chord.md#property-data)
- [sy-network-graph](https://chart.syidax.com/docs/components/network-graph.md#property-data)
- [sy-theme-river](https://chart.syidax.com/docs/components/theme-river.md#property-data)
- [sy-parallel-coordinates](https://chart.syidax.com/docs/components/parallel-coordinates.md#property-data)
- [sy-geo-map](https://chart.syidax.com/docs/components/geo-map.md#property-data)
- [sy-flow-lines](https://chart.syidax.com/docs/components/flow-lines.md#property-data)
- [sy-candlestick-chart](https://chart.syidax.com/docs/components/candlestick.md#property-data)
- [sy-ohlc-chart](https://chart.syidax.com/docs/components/ohlc.md#property-data)
- [sy-stock-chart](https://chart.syidax.com/docs/components/stock-chart.md#property-data)
- [sy-stock-volume](https://chart.syidax.com/docs/components/stock-volume.md#property-data)
- [sy-stock-flags](https://chart.syidax.com/docs/components/stock-flags.md#property-data)
- [sy-surface-3d](https://chart.syidax.com/docs/components/surface-3d.md#property-data)
- [sy-bar-3d](https://chart.syidax.com/docs/components/bar-3d.md#property-data)
- [sy-scatter-3d](https://chart.syidax.com/docs/components/scatter-3d.md#property-data)
- [sy-gantt-chart](https://chart.syidax.com/docs/components/gantt.md#property-data)