@{ 
    var intervals = new[] { 0, 50, 100, 300, 600, 1200 };
}

<h1>
    Dynamic Chart
</h1>

<p>
    The FlexChart receives notifications when the data
    changes and updates the chart automatically.
<p>
<p>
    The chart below is bound to an <b>itemsSource</b> that
    receives new items at a given interval. When new items
    are added to the data source, old items are removed
    to keep the total item count constant. The result is
    a dynamic scrolling chart.
</p>

<div class="demo-settings">
    <label for="theInterval">Update Interval: </label>
    @(Html.C1().ComboBox<int>().Id("theInterval").Bind(intervals).SelectedValue(300))
    ms
</div>

@(Html.C1().FlexChart().Id("theChart")
    .BindingX("x")
    .ChartType(C1.Web.Mvc.Chart.ChartType.Line)
    .Series(sb => sb.Add().Binding("y"))
)
