FinancialChart | ASP.NET Core MVC Controls

FinancialChart

In This Topic

All controls in ASP.NET MVC Edition are optimized for client-side web development.

You can access FinancialChart control on client-side with the help of wijmo.Control.getControl() method. Add the script that accesses the control after the control declaration. Use the control's Id to create its jQuery selector and use the client-side API.

FinancialChart has a powerful client API. The following code sample demonstrates how to access a FinancialChart on client-side.

Client-Side Access	Copy Code
@using MVCFinancialChart.Models @model List<FinanceData> <script> var financeChart; c1.mvc.Utils.documentReady(function () { financeChart = wijmo.Control.getControl('#fChart'); }); </script> <!--Instantiate FinancialChart and set its properties--> @(Html.C1().FinancialChart() .Bind(Model) .Id("fChart") .Height(400) .Width(700) .BindingX("X") .ChartType(C1.Web.Mvc.Finance.ChartType.ArmsCandleVolume) .Series(sers => { sers.Add().Binding("High,Low,Open,Close,Volume"); }) .Tooltip(t => t.Content("tooltipContent")) )

Client-Side Access

Copy Code

@using MVCFinancialChart.Models
@model List<FinanceData>

<script>
    var financeChart;
    c1.mvc.Utils.documentReady(function () {
        financeChart = wijmo.Control.getControl('#fChart');
    });
</script>

<!--Instantiate FinancialChart and set its properties-->
@(Html.C1().FinancialChart()
.Bind(Model)
.Id("fChart")   
.Height(400)
.Width(700)
.BindingX("X")        
.ChartType(C1.Web.Mvc.Finance.ChartType.ArmsCandleVolume)
.Series(sers =>
    {
        sers.Add().Binding("High,Low,Open,Close,Volume");
    })
.Tooltip(t => t.Content("tooltipContent"))
)

See Wijmo FinancialChart API Documentation for more information.