The quick start guides you through the steps of adding the FlexChart control to your MVC web application and add data to it.
The following image shows how FlexChart appears after completing the steps above:
Create a new MVC application using the ComponentOne or VisualStudio templates. For more information about creating an MVC application, see Configuring your MVC Application topic.
FlexChartDataSource.cs
). See Adding controls to know how to add a new model.Complete the following steps to initialize a FlexChart control.
Add a new Controller
QuickStartController
).C# |
Copy Code
|
---|---|
using C1.Web.Mvc; using C1.Web.Mvc.Serializition; using C1.Web.Mvc.Chart; |
Index()
with the following method.
Add a View for the Controller
QuickStartController
to open it.QuickStart()
.Razor |
Copy Code
|
---|---|
@using MvcApplication1.Models @model IEnumerable<FruitSale> @(Html.C1().FlexChart() .Bind("Date", Model) .ChartType(C1.Web.Mvc.Chart.ChartType.Column) .Series(sers => { sers.Add() .Binding("SalesInUSA") .Name("Sales in USA"); }) ) |
Index.vbhtml |
Copy Code
|
---|---|
@Imports C1.Web.Mvc @Imports C1.Web.Mvc.Chart @Imports System.Drawing @ModelType IEnumerable(Of FruitSale) @(Html.C1().FlexChart() _ .Bind("Date", Model) _ .ChartType(C1.Web.Mvc.Chart.ChartType.Column) _ .Series(Sub(ser) ser.Add() _ .Binding("SalesInUSA") _ .Name("Sales in USA") End Sub) _) |