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

<h1>
    @Html.Raw(Resources.C1FlexChart.RangeSelectors_Title)
</h1>

<p>
    @Html.Raw(Resources.C1FlexChart.RangeSelectors_Text1)
</p>
<p>
    @Html.Raw(Resources.C1FlexChart.RangeSelectors_Text2)
</p>
<ol>
    <li>
        @Html.Raw(Resources.C1FlexChart.RangeSelectors_Text3)
    </li>
    <li>
        @Html.Raw(Resources.C1FlexChart.RangeSelectors_Text4)
    </li>
    <li>
        @Html.Raw(Resources.C1FlexChart.RangeSelectors_Text5)
    </li>
    <li>
        @Html.Raw(Resources.C1FlexChart.RangeSelectors_Text6)
    </li>
</ol>

@(Html.C1().CollectionViewService<FlexChartData.Stock>().Id("collectionView1")
    .Bind(Model)
)
@(Html.C1().FlexChart<FlexChartData.Stock>().Id("theChart")
    .ItemsSourceId("collectionView1")
    .BindingX("Date")
    .ChartType(C1.Web.Mvc.Chart.ChartType.Candlestick)
    .Legend(C1.Web.Mvc.Chart.Position.None)
    .Series(sb=>sb.Add().Binding("Low,High,Open,Close").Name("Alphabet Inc"))
    .PlotMargin("NaN 60 NaN 60")
)
@(Html.C1().FlexChart<FlexChartData.Stock>().Id("theChartSelector")
    .CssClass("chart-selector")
    .ItemsSourceId("collectionView1")
    .BindingX("Date")
    .ChartType(C1.Web.Mvc.Chart.ChartType.Area)
    .Legend(C1.Web.Mvc.Chart.Position.None)
    .AxisX(x => x.Position(C1.Web.Mvc.Chart.Position.None))
    .AxisY(y => y.Position(C1.Web.Mvc.Chart.Position.None))
    .Tooltip(t=>t.Content(""))
    .Series(sb=>sb.Add().Binding("Close").Name("Alphabet Inc"))
    .PlotMargin("NaN 60 NaN 60")
)