Category / Section
How to customize the font size, font style and text alignment of PivotChart title?
1 min read
This KB illustrates that how to customize PivotChart title.
Solution:
You can customize the font size, font style and text alignment of PivotChart title by using the following code examples.
JS
$(function () { $("#PivotChart1").ejPivotChart({ url: "../wcf/OlapChartService.svc", title: { text: "PivotChart in Essential Studio" }, load: "load" }); }); function load(args) { this.model.title.font.size = "30px", this.model.title.font.fontStyle = "italic", this.model.title.font.fontWeight = "bold", this.model.title.textAlignment = "center" }
MVC
@Html.EJ().Pivot().PivotChart("PivotChart1").Url("../wcf/OlapChartService.svc").Title(title => title.Text("PivotChart in Essential Studio")).ClientSideEvents(oEve => { oEve.Load("load"); }) <script type="text/javascript"> function load(args) { this.model.title.font.size = "30px", this.model.title.font.fontStyle = "italic", this.model.title.font.fontWeight = "bold", this.model.title.textAlignment = "center" } </script>
ASP.NET
<ej:PivotChart ID="PivotChart1" runat="server" Url="../wcf/OlapChartService.svc" title-text="PivotChart in Essential Studio"> <ClientSideEvents Load="load" /> </ej:PivotChart> <script type="text/javascript"> function load(args) { this.model.title.font.size = "30px", this.model.title.font.fontStyle = "italic", this.model.title.font.fontWeight = "bold", this.model.title.textAlignment = "center" } </script>