Box Plot

Box Plot charts are categorical charts which graphically render groups of numerical data through their quartiles.

Basic Usage

The following example demonstrates the Box Plot chart in action.

import React from 'react';
import ReactDOM from 'react-dom';

import {
    Chart,
    ChartTitle,
    ChartSeries,
    ChartSeriesItem
} from '@progress/kendo-react-charts';

import data from './box-plot-data.json';

const ChartContainer = () => (
    <Chart>
        <ChartTitle text="Monthly Mean Temperatures (&deg;F)" />
        <ChartSeries>
            <ChartSeriesItem
                type="boxPlot"
                lowerField="lower"
                q1Field="q1"
                medianField="median"
                q3Field="q3"
                upperField="upper"
                outliersField="outliers"
                meanField="mean"
                categoryField="year"
                data={data}
            />
        </ChartSeries>
    </Chart>
);

ReactDOM.render(
    <ChartContainer/>,
    document.querySelector('my-app')
);
 /