# Bar Chart

A Bar Chart is the most common visual representation of numeric data as Vertical or Horizontal Bars.

To draw a Bar Chart, we will use the `BarChart` widget. \
Let's use the widget to draw a simple bar chart with only one Bar.

{% tabs %}
{% tab title="Code Sample" %}

```dart
...
import 'package:chart_it/chart_it.dart';

class TestBarCharts extends StatefulWidget {
  const TestBarCharts({Key? key}) : super(key: key);

  @override
  State<TestBarCharts> createState() => _TestBarChartsState();
}

class _TestBarChartsState extends State<TestBarCharts> {
  @override
  Widget build(BuildContext context) {
    return BarChart(
      data: BarSeries(
        barData: <BarGroup>[
          SimpleBar(
            xValue: 1,
            yValue: BarData(yValue: 27),
          ),
        ],
      ),
    );
  }
}
```

{% endtab %}

{% tab title="Result" %}

<figure><img src="https://672051664-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F3JD7NLiao8wvvuzkAjT9%2Fuploads%2FV6XU8HFkpGZhqO2XcmCU%2FScreenshot%202023-04-26%20at%2010.58.18%20AM.png?alt=media&#x26;token=5f0565a1-c586-4210-9ad4-fdf117c1eed4" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

Before moving forward, let's understand the above example code.

The widget `BarChart` requires a **mandatory** field `data` of type `BarSeries`. This is a series class that ensures that any data provided to this series should be represented as a BarChart.

The `BarSeries` requires `barData` which is a List of `BarGroup`. You can see that we have provided a class `SimpleBar` which extends a BarGroup. BarGroups define how your data will be represented as Bars on the chart. We will go into further details for `BarGroup` later.

Finally, our `SimpleBar` takes a `yValue` of class `BarData` which also requires a `yValue` which is a numeric value, representing the data value for this `SimpleBar`. \
You may have some questions about the structuring complexity of these data classes for the widget, just to draw a simple bar. But it will be clear behind this approach in later sections.