FlexChart
FlexChart
Scaling
Use logarithmic axes to spread clustered data and improve the clarity of your charts without compromising accuracy.
Use scaling formats to display axis labels in a clear and concise manner.
The bubble chart, in this example, shows the population (x), GDP (y), and per-capita income
(bubble size) for about 200 countries.
Features
Description
Use logarithmic axes to spread clustered data and improve the clarity of your charts without compromising accuracy.
Use scaling formats to display axis labels in a clear and concise manner.
The bubble chart, in this example, shows the population (x), GDP (y), and per-capita income (bubble size) for about 200 countries. Notice how the usage of log-axes spreads out the data and makes the chart easy to read.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | using System.Web.Mvc;using MvcExplorer.Models;namespace MvcExplorer.Controllers{ public partial class FlexChartController { // // GET: /Scaling/ public ActionResult Scaling() { return View(Population.GetData()); } }} |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | @model IEnumerable<Population>@(Html.C1().FlexChart().ChartType(C1.Web.Mvc.Chart.ChartType.Bubble).Bind("POP", Model).Legend(C1.Web.Mvc.Chart.Position.None).Tooltip(ttb => ttb.Content("<b>{Country}</b>:<br/>{PCI:n0} US$/year/capita").IsContentHtml(true)).AxisY(cab => cab.Title(Resources.FlexChart.Scaling_AxisYText).Format("g4,").LogBase(10)).AxisX(cab => cab.Title(Resources.FlexChart.Scaling_AxisXText).Format("g4,,").LogBase(10)).Series(sers => { sers.Add() .Name("GDP") .SymbolStyle(svgsb => svgsb.Fill("gold").Stroke("orange")) .Binding("GDP,PCI"); }))@section Description{ <h3> </h3> <p>@Html.Raw(Resources.FlexChart.Scaling_Text0)</p> <p>@Html.Raw(Resources.FlexChart.Scaling_Text1)</p> <p>@Html.Raw(Resources.FlexChart.Scaling_Text2)</p>} |