@{ 
    var types = new[] { "Simple", "Weighted", "Exponential", "Triangular" };
}

<h1>
    Moving Average
</h1>
<p>
    The MovingAverage class extends the regular Series class
    to provide a series of averages of different subsets of
    the full data set.
</p>
<p>
    To add moving averages to a chart, follow these steps:
</p>
<ol>
    <li>
        Create one or more MovingAverage series,
    </li>
    <li>
        Configure the MovingAverage series as you would regular
        series, setting their <b>binding</b>, <b>chartType</b>,
        and <b>style</b> properties for example, and
    </li>
    <li>
        Set the MovingAverage's <b>type</b> and <b>period</b>
        properties to determine the type of moving average
        you want to create.
    </li>
</ol>

<div class="demo-settings">
    <label for="type">MovingAverage Type: </label>
    @Html.C1().ComboBox().Id("type").Bind(types)
    <br />
    <label for="period">Period: </label>
    @Html.C1().InputNumber().Id("period").Value(6).Step(1).Min(2).Max(20)
</div>

@(Html.C1().FlexChart().Id("theChart")
    .BindingX("date")
    .ChartType(C1.Web.Mvc.Chart.ChartType.Line)
    .AxisY(y=>y.Min(0))
    .Series(sb=>sb.Add().Binding("sales").Name("Sales"))
)