FlexChart
FlexChart
Axes
Features
Sample
Settings
Description
Multiple axes
This view shows the FlexChart with two y-axes.
Source
AxesController.cs
using MvcExplorer.Models;
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;
namespace MvcExplorer.Controllers
{
public partial class FlexChartController
{
public ActionResult Axes()
{
Dictionary<string, IEnumerable<CustomerOrder>> OrderDatas = new Dictionary<string, IEnumerable<CustomerOrder>>();
OrderDatas.Add("2013", CustomerOrder.GetCountryCountOrderData(1, 5));
OrderDatas.Add("2014", CustomerOrder.GetCountryCountOrderData(3, 10));
OrderDatas.Add("CountryNames", CustomerOrder.GetCountryNameData());
ViewBag.OrderDatas = OrderDatas;
var model = new ClientSettingsModel
{
Settings = CreateAxesSettings(),
DefaultValues = new Dictionary<string, object> { { "AxisX.LabelAngle", 0 } }
};
return View(model);
}
private static IDictionary<string, object[]> CreateAxesSettings()
{
var settings = new Dictionary<string, object[]>
{
{ "AxisX.LabelAngle", new object[] {-90, -45, 0, 45, 90} }
};
return settings;
}
}
}
Axes.cshtml
@{
ViewBag.DemoSettings = true;
ViewBag.DemoSettingsModel = Model;
Dictionary<string, IEnumerable<CustomerOrder>> OrderDatas = ViewBag.OrderDatas;
}
<c1-flex-chart id="@Model.ControlId" header="@FlexChartRes.Axes_Sales">
<c1-flex-chart-series name="2013" binding-x="ID" binding="Count">
<c1-items-source source-collection="@OrderDatas["2013"]"></c1-items-source>
</c1-flex-chart-series>
<c1-flex-chart-series name="2014" chart-type="LineSymbols" binding-x="ID" binding="Count">
<c1-items-source source-collection="@OrderDatas["2014"]"></c1-items-source>
<c1-flex-chart-axis c1-property="AxisY" position="Right"></c1-flex-chart-axis>
</c1-flex-chart-series>
<c1-flex-chart-axis c1-property="AxisX" binding="ID,Country">
<c1-items-source source-collection="@OrderDatas["CountryNames"]"></c1-items-source>
</c1-flex-chart-axis>
</c1-flex-chart>
@section Description{
<h3>@Html.Raw(FlexChartRes.Axes_MultipleAxes)</h3>
<p>@Html.Raw(FlexChartRes.Axes_Text0)</p>
}
Documentation