FlexPie
Multiple Chart
Features
Sample
Description
The sample shows how to create multiple pie charts based on the same data source. To create multiple pie charts, just specify several comma-separated properties in Binding.
Source
MultipleChartController.cs
using System.Collections.Generic; using System.Web.Mvc; using C1.Web.Mvc.Chart; using MvcExplorer.Models; namespace MvcExplorer.Controllers { public partial class FlexPieController : Controller { public ActionResult MultipleChart() { return View(ProductSales.GetData()); } } }
MultipleChart.cshtml
@model IEnumerable<ProductSales> @section Scripts{ <script> function chartsPerLineChanged(sender, args) { var multipleChart = wijmo.Control.getControl('#multipleChart'); multipleChart.chartsPerLine = sender.value; } </script> } @(Html.C1().FlexPie<ProductSales>() .Id("multipleChart") .Header("Product") .Height(600) .Binding("Downloads,Sales,Refunds,Damages") .Bind(Model) .BindingName("Country") .DataLabel(dl => dl.Content("{value}"))) <label style="display:inline;margin: 1em;">@Html.Raw(Resources.FlexPie.Multiple_Text1)</label> @(Html.C1().InputNumber().Min(0).Max(4).Step(1).Value(0).Format("n0").OnClientValueChanged("chartsPerLineChanged")) @section Description{ <p>@Html.Raw(Resources.FlexPie.Multiple_Text0)</p> }
Documentation