import { __extends } from "tslib";
import * as React from 'react';
import { VerticalBarChart } from '@uifabric/charting';
import { DefaultPalette } from 'office-ui-fabric-react/lib/Styling';
var VerticalBarChartBasicExample = /** @class */ (function (_super) {
    __extends(VerticalBarChartBasicExample, _super);
    function VerticalBarChartBasicExample(props) {
        return _super.call(this, props) || this;
    }
    VerticalBarChartBasicExample.prototype.render = function () {
        var points = [
            {
                x: 0,
                y: 10000,
                legend: 'First',
                color: DefaultPalette.accent,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '10%',
            },
            {
                x: 10000,
                y: 50000,
                legend: 'Second',
                color: DefaultPalette.blueDark,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '20%',
            },
            {
                x: 25000,
                y: 30000,
                legend: 'Third',
                color: DefaultPalette.blueMid,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '37%',
            },
            {
                x: 40000,
                y: 13000,
                legend: 'seventh',
                color: DefaultPalette.blueLight,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '88%',
            },
            {
                x: 52000,
                y: 43000,
                legend: 'Eighith',
                color: DefaultPalette.blue,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '71%',
            },
            {
                x: 68000,
                y: 30000,
                legend: 'Nighth',
                color: DefaultPalette.blueDark,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '40%',
            },
            {
                x: 80000,
                y: 20000,
                legend: 'Fourth',
                color: DefaultPalette.blue,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '87%',
            },
            {
                x: 92000,
                y: 45000,
                legend: 'tenth',
                color: DefaultPalette.blueLight,
                xAxisCalloutData: '2020/04/30',
                yAxisCalloutData: '33%',
            },
        ];
        return (React.createElement("div", { style: { width: '650px', height: '400px' } },
            React.createElement(VerticalBarChart, { data: points, width: 650, height: 400, chartLabel: 'Basic Chart with Numeric Axes' })));
    };
    return VerticalBarChartBasicExample;
}(React.Component));
export { VerticalBarChartBasicExample };
//# sourceMappingURL=VerticalBarChart.Basic.Example.js.map