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

<h1>
    Legends and Titles
</h1>

<p>
    Use the <b>header</b>, <b>footer</b>, and axis <b>title</b>
    properties to add titles to your charts.
</p>
<p>
    The series elements can also have titles, defined by the
    series <b>name</b> property and displayed in the chart's
    legend:
</p>

<div class="demo-settings">
    <label for="header">Header: </label>
    @Html.C1().ComboBox().Id("header").ShowDropDownButton(false)
    <br>
    <label for="footer">Footer: </label>
    @Html.C1().ComboBox().Id("footer").ShowDropDownButton(false)
    <br>
    <label for="xTitle">X-Axis Title: </label>
    @Html.C1().ComboBox().Id("xTitle").ShowDropDownButton(false)
    <br>
    <label for="yTitle">Y-Axis Title: </label>
    @Html.C1().ComboBox().Id("yTitle").ShowDropDownButton(false)
</div>

@(Html.C1().FlexChart<FlexChartData.Sale>().Id("theChart")
    .Bind("Country", Model)
    .Series(sb =>
    {
        sb.Add().Binding("Sales").Name("Sales");
        sb.Add().Binding("Expenses").Name("Expenses");
        sb.Add().Binding("Downloads").Name("Downloads");
    })
)