StockChart

A subclass of React.Component.

The root StockChart component.

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

import {
    StockChart,
    ChartTitle,
    ChartSeries,
    ChartSeriesItem,
    ChartNavigator,
    ChartNavigatorSelect,
    ChartNavigatorSeries,
    ChartNavigatorSeriesItem
} from '@progress/kendo-react-charts';

import 'hammerjs';

import stockData from './stock-data.json';

const from = new Date('2009/02/05');
const to = new Date('2011/10/07');

const StockChartContainer = () => (
    <StockChart>
        <ChartTitle text="The Boeing Company NYSE:BA" />
        <ChartSeries>
            <ChartSeriesItem
                data={stockData}
                type="candlestick"
                openField="Open"
                closeField="Close"
                lowField="Low"
                highField="High"
                categoryField="Date"
            />
        </ChartSeries>
        <ChartNavigator>
            <ChartNavigatorSelect from={from} to={to} />
            <ChartNavigatorSeries>
                <ChartNavigatorSeriesItem
                    data={stockData}
                    type="area"
                    field="Close"
                    categoryField="Date"
                />
            </ChartNavigatorSeries>
        </ChartNavigator>
    </StockChart>
);
ReactDOM.render(
    <StockChartContainer />,
    document.querySelector('my-app')
);

props Readonly<StockChartProps> intersected with Readonly<{ children?: ReactNode; }>

The props of the StockChart component.

element HTMLDivElement | null

The DOM element of the StockChart.

surface Surface | null

The Drawing Surface of the StockChart.

 /