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

<h1>
    Candlestick Charts
</h1>

<p>
    Candlestick charts are used to describe price movements of a
    security, derivative, or currency over time.
</p>
<p>
    To create candlestick charts with the FlexChart control,
    set the <b>bindingX</b> property to the name of the property
    that contains the dates, and add a single series with
    <b>binding</b> set to a comma-delimited string containing
    the names of the properties that represent the High, Low,
    Open, and Close values.
</p>
<p>
    The size of the wick line is determined by the High and Low
    values; the size of the bar is determined by the Open and Close
    values.
    The bar color indicates whether the Close value is higher or
    lower than the Open value (empty/filled bar):
</p>

@(Html.C1().FlexChart<FlexChartData.Stock>().Id("theChart")
    .Bind("Date", Model)
    .ChartType(C1.Web.Mvc.Chart.ChartType.Candlestick)
    .Series(sb=>sb.Add().Binding("High,Low,Open,Close").Name("Alphabet Inc"))
    .Legend(C1.Web.Mvc.Chart.Position.None)
)