Sunburst
Sunburst
Overview
This view shows the Sunburst's basic features.
Features
Settings
InnerRadius: 0
Offset: 0
StartAngle: 0
Reversed: False
Palette: standard
DataLabelPosition: Center
DataLabelBorder: False
Description
This view shows the Sunburst's basic features. It binds the chart to a data model.
If you move the mouse over a chart element, a tooltip will appear showing details about the data point.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 | using Microsoft.AspNetCore.Mvc; using System.Collections.Generic; using MvcExplorer.Models; using C1.Web.Mvc.Chart; using System; namespace MvcExplorer.Controllers { public partial class SunburstController : Controller { List<HierarchicalData> _data = HierarchicalData.GetData(); public ActionResult Index() { var settings = new ClientSettingsModel { Settings = CreateSettings(), DefaultValues = new Dictionary<string, object> { {"DataLabel.Position", PieLabelPosition.Center} } }; settings.LoadRequestData(Request); ViewBag.DemoSettingsModel = settings; return View(_data); } private static IDictionary<string, object[]> CreateSettings() { var settings = new Dictionary<string, object[]> { {"InnerRadius", new object[] {0, 0.25, 0.5, 0.75}}, {"Offset", new object[] {0, 0.1, 0.2, 0.3, 0.4, 0.5}}, {"StartAngle", new object[] {0, 90, 180, -90}}, {"Reversed", new object[] {false, true}}, {"Palette", new object[] {"standard", "cocoa", "coral", "dark", "highcontrast", "light", "midnight", "minimal", "modern", "organic", "slate"}}, {"DataLabel.Position", new object[] { PieLabelPosition.None, PieLabelPosition.Inside, PieLabelPosition.Center, PieLabelPosition.Outside } }, {"DataLabel.Border", new object[] {false, true}}, }; return settings; } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | @using C1.Web.Mvc.Chart @model IEnumerable<HierarchicalData> @{ ViewBag.DemoSettings = true; ClientSettingsModel demoSettingsModel = ViewBag.DemoSettingsModel; var innerRadius = demoSettingsModel.GetFloat("InnerRadius", 0f); } <c1-sunburst id="@demoSettingsModel.ControlId" header="Sales" inner-radius="@innerRadius" binding-name="Year, Quarter, Month" binding="Value"> <c1-items-source source-collection="Model"></c1-items-source> <c1-flex-pie-datalabel content="{name}"></c1-flex-pie-datalabel> </c1-sunburst> @section Description{ <p>@Html.Raw(SunburstRes.Index_Text0)</p> <p>@Html.Raw(SunburstRes.Index_Text1)</p> } @section Scripts{ <script> function convertPalette(value) { return wijmo.chart.Palettes[value]; } </script>} |