Title
24 Feb 202216 minutes to read
Accumulation Chart can be given a title using Title
property, to show the information about the data plotted.
@Html.EJS().AccumulationChart("container").Title("Oil and other liquid imports in USA").LegendSettings(ls => ls.Visible(false)).Series(series =>
{
series.DataLabel(dl => dl.Visible(true).Name("text"))
.XName("xValue")
.YName("yValue")
.Name("Browser")
.Type(Syncfusion.EJ2.Charts.AccumulationType.Pie)
.DataSource(ViewBag.dataSource).Add();
}).Render()
public ActionResult Pie()
{
List<PieChartData> chartData = new List<PieChartData>
{
new PieChartData { xValue = "Saudi Arabia", yValue = 58, text = "58%"},
new PieChartData { xValue = "Persian Gulf", yValue = 15, text = "15%"},
new PieChartData { xValue = "Canada", yValue = 13, text = "13%"},
new PieChartData { xValue = "Venezuela", yValue = 8 , text = "8%"},
new PieChartData { xValue = "Mexico", yValue = 3 , text = "3%"},
new PieChartData { xValue = "Russia", yValue = 2, text = "2%"},
new PieChartData { xValue = "Miscellaneous", yValue = 1, text = "1%"}
};
ViewBag.dataSource = chartData;
return View();
}
public class PieChartData
{
public string xValue;
public double yValue;
public string text;
}
Title Customization
Accumulation Chart can be customized a title using TitleStyle
property.
@Html.EJS().AccumulationChart("container").Title("Oil and other liquid imports in USA").SubTitle("In the year 2014 - 2015")
.LegendSettings(ls => ls.Visible(false)).TitleStyle(Sts => Sts.FontFamily("Arial").FontStyle("italic").FontWeight("regular").Color("#E27F2D").Size("23px")).
Series(series =>
{
series.DataLabel(dl => dl.Visible(true).Name("text"))
.XName("xValue")
.YName("yValue")
.Name("Browser")
.Type(Syncfusion.EJ2.Charts.AccumulationType.Pie)
.DataSource(ViewBag.dataSource).Add();
}).Render()
public ActionResult Pie()
{
List<PieChartData> chartData = new List<PieChartData>
{
new PieChartData { xValue = "Saudi Arabia", yValue = 58, text = "58%"},
new PieChartData { xValue = "Persian Gulf", yValue = 15, text = "15%"},
new PieChartData { xValue = "Canada", yValue = 13, text = "13%"},
new PieChartData { xValue = "Venezuela", yValue = 8 , text = "8%"},
new PieChartData { xValue = "Mexico", yValue = 3 , text = "3%"},
new PieChartData { xValue = "Russia", yValue = 2, text = "2%"},
new PieChartData { xValue = "Miscellaneous", yValue = 1, text = "1%"}
};
ViewBag.dataSource = chartData;
return View();
}
public class PieChartData
{
public string xValue;
public double yValue;
public string text;
}
SubTitle
Accumulation Chart can be given a subtitle using SubTitle
property, to show the information about the data plotted.
@Html.EJS().AccumulationChart("container").Title("Oil and other liquid imports in USA").SubTitle("In the year 2014 - 2015").LegendSettings(ls => ls.Visible(false)).Series(series =>
{
series.DataLabel(dl => dl.Visible(true).Name("text"))
.XName("xValue")
.YName("yValue")
.Name("Browser")
.Type(Syncfusion.EJ2.Charts.AccumulationType.Pie)
.DataSource(ViewBag.dataSource).Add();
}).Render()
public ActionResult Pie()
{
List<PieChartData> chartData = new List<PieChartData>
{
new PieChartData { xValue = "Saudi Arabia", yValue = 58, text = "58%"},
new PieChartData { xValue = "Persian Gulf", yValue = 15, text = "15%"},
new PieChartData { xValue = "Canada", yValue = 13, text = "13%"},
new PieChartData { xValue = "Venezuela", yValue = 8 , text = "8%"},
new PieChartData { xValue = "Mexico", yValue = 3 , text = "3%"},
new PieChartData { xValue = "Russia", yValue = 2, text = "2%"},
new PieChartData { xValue = "Miscellaneous", yValue = 1, text = "1%"}
};
ViewBag.dataSource = chartData;
return View();
}
public class PieChartData
{
public string xValue;
public double yValue;
public string text;
}
SubTitle Customization
Accumulation Chart can be customized a subtitle using SubTitleStyle
property.
@Html.EJS().AccumulationChart("container").Title("Oil and other liquid imports in USA").SubTitle("In the year 2014 - 2015")
.LegendSettings(ls => ls.Visible(false)).SubTitleStyle(Sts => Sts.FontFamily("Arial").FontStyle("italic").FontWeight("regular").Color("#E27F2D").Size("13px")).
Series(series =>
{
series.DataLabel(dl => dl.Visible(true).Name("text"))
.XName("xValue")
.YName("yValue")
.Name("Browser")
.Type(Syncfusion.EJ2.Charts.AccumulationType.Pie)
.DataSource(ViewBag.dataSource).Add();
}).Render()
public ActionResult Pie()
{
List<PieChartData> chartData = new List<PieChartData>
{
new PieChartData { xValue = "Saudi Arabia", yValue = 58, text = "58%"},
new PieChartData { xValue = "Persian Gulf", yValue = 15, text = "15%"},
new PieChartData { xValue = "Canada", yValue = 13, text = "13%"},
new PieChartData { xValue = "Venezuela", yValue = 8 , text = "8%"},
new PieChartData { xValue = "Mexico", yValue = 3 , text = "3%"},
new PieChartData { xValue = "Russia", yValue = 2, text = "2%"},
new PieChartData { xValue = "Miscellaneous", yValue = 1, text = "1%"}
};
ViewBag.dataSource = chartData;
return View();
}
public class PieChartData
{
public string xValue;
public double yValue;
public string text;
}