@cdc/chart

<CdcChart /> is the CDC charting component for rendering bar, line, pie, combo, radar, Sankey, forest plot, and other chart families from a saved config.

Installation

npm install @cdc/chart

Quick Start

Use the package by passing a config object directly:

import CdcChart from '@cdc/chart'

const config = {
  type: 'chart',
  version: '4.26.4',
  visualizationType: 'Bar',
  title: 'Minimal Chart',
  data: [
    { category: 'A', value: 1 },
    { category: 'B', value: 2 }
  ],
  xAxis: {
    dataKey: 'category'
  },
  series: [{ dataKey: 'value' }]
}

function App() {
  return (
    <div className='App'>
      <CdcChart config={config} />
    </div>
  )
}

export default App

You can also load configuration from a URL with <CdcChart configUrl='/path/to/config.json' />.

Configuration

The primary reference for authoring configs is CONFIG.md.

If you are reading this in a context where relative Markdown links do not open correctly, use the GitHub copy of the chart config reference.

Properties

| Property | Type | Description | | --- | --- | --- | | config | object | Configuration object for the chart. This is the primary integration path for React consumers. | | configUrl | string | Optional URL to a JSON config file. Use this when you want the component to fetch its config at runtime. |