@using LearnMvcClient.Models
@model IEnumerable<FlexChartData.Sale>

<h1>
    Bar Charts
</h1>
<p>
    Bar charts are similar to rotated column charts.
</p>
<p>
    By default, items on the Y axis start from the bottom
    of the chart, so the first items appear at the bottom
    and the last at the top.
</p>
<p>
    If you reverse the Y axis, items will start at the top
    of the, which is often a more natural order:
</p>

<div class="demo-settings">
    <label for="reverseY">Reverse Y axis:</label>
    <input id="reverseY" type="checkbox" checked="checked">
</div>

@(Html.C1().FlexChart<FlexChartData.Sale>().Id("theChart")
    .Bind("Country", Model)
    .ChartType(C1.Web.Mvc.Chart.ChartType.Bar)
    .AxisY(ab=>ab.Reversed(true))
    .Series(sb=>
    {
        sb.Add().Binding("Sales").Name("Sales");
        sb.Add().Binding("Expenses").Name("Expenses");
    })
)