diff --git a/ej2-asp-core-mvc/chart/EJ2_ASP.MVC/chart-print.md b/ej2-asp-core-mvc/chart/EJ2_ASP.MVC/chart-print.md index 3ad56ee6ef..e81c66a4fc 100644 --- a/ej2-asp-core-mvc/chart/EJ2_ASP.MVC/chart-print.md +++ b/ej2-asp-core-mvc/chart/EJ2_ASP.MVC/chart-print.md @@ -1,6 +1,6 @@ --- layout: post -title: Chart Print in ##Platform_Name## Chart Component +title: Chart Print in Syncfusion ##Platform_Name## Chart Component description: Learn here all about Chart Print in Syncfusion ##Platform_Name## Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Chart print @@ -9,7 +9,7 @@ documentation: ug --- -# Print and Export +# Print and Export in ASP.NET Core Chart component ## Print diff --git a/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/chart-print.md b/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/chart-print.md index 3912e6c22f..277a3dc724 100644 --- a/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/chart-print.md +++ b/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/chart-print.md @@ -1,6 +1,6 @@ --- layout: post -title: Chart Print in ##Platform_Name## Chart Component +title: Chart Print in Syncfusion ##Platform_Name## Chart Component description: Learn here all about Chart Print in Syncfusion ##Platform_Name## Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Chart print @@ -9,7 +9,7 @@ documentation: ug --- -# Print and Export +# Print and Export in ASP.NET Core chart component ## Print @@ -49,8 +49,10 @@ The optional parameters for this method are, * `Controls` - pass collections of controls for multiple export, * `Width` - width of chart export, * `Height` - height of chart export, -* `Header` - header for the exported chart, and -* `Footer` - footer for the exported chart. +* `IsVertical` - decides the chart export in vertical or horizontal direction, +* `Header` - header for the exported chart, +* `Footer` - footer for the exported chart, and +* `ExportToMultiplePages` - decides to export multiple charts on separate pages for PDF export. {% if page.publishingplatform == "aspnet-core" %} @@ -107,7 +109,32 @@ In the export method, specify the following parameters to add a header and foote {% endtabs %} {% endif %} +### Positioning the header and footer in PDF export +The headers and footers can be positioned anywhere on the PDF page using the `x` and `y` properties. + +{% if page.publishingplatform == "aspnet-core" %} + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/chart/getting-started/header-footerPosition/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="Header-footerPosition.cs" %} +{% include code-snippet/chart/getting-started/header-footerPosition/header-footerPosition.cs %} +{% endhighlight %} +{% endtabs %} + +{% elsif page.publishingplatform == "aspnet-mvc" %} + +{% tabs %} +{% highlight razor tabtitle="CSHTML" %} +{% include code-snippet/chart/getting-started/header-footerPosition/razor %} +{% endhighlight %} +{% highlight c# tabtitle="Header-footerPosition.cs" %} +{% include code-snippet/chart/getting-started/header-footerPosition/header-footerPosition.cs %} +{% endhighlight %} +{% endtabs %} +{% endif %} ### Exporting charts into separate page during the PDF export diff --git a/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/date-time-axis.md b/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/date-time-axis.md index 1e2a1a02cc..ad2cdfb9ab 100644 --- a/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/date-time-axis.md +++ b/ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/date-time-axis.md @@ -1,6 +1,6 @@ --- layout: post -title: Date Time Axis in ##Platform_Name## Chart Component +title: Date Time Axis in Syncfusion ##Platform_Name## Chart Component description: Learn here all about Date Time Axis in Syncfusion ##Platform_Name## Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Date Time Axis @@ -15,7 +15,9 @@ documentation: ug ## DateTime Axis -Date time axis uses date time scale and displays the date time values as axis labels in the specified format. +Date time axis uses date time scale and displays the date time values as axis labels in the specified format. To get start quickly with DateTime axis in ASP.NET Core Charts, you can check on this video: + +{% youtube "https://www.youtube.com/watch?v=DnMIgbn6bco" %} {% if page.publishingplatform == "aspnet-core" %} diff --git a/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/header-footerPosition.cs b/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/header-footerPosition.cs new file mode 100644 index 0000000000..c1a94f6e63 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/header-footerPosition.cs @@ -0,0 +1,24 @@ +public IActionResult Index() +{ + List chartData = new List + { + new MultiExportChartData { x = new DateTime(2012, 01, 01), y = 11.0, y1 = 19.5, y2 = 7.1 }, + new MultiExportChartData { x = new DateTime(2013, 01, 01), y = 12.9, y1 = 17.5, y2 = 6.8 }, + new MultiExportChartData { x = new DateTime(2014, 01, 01), y = 13.4, y1 = 15.5, y2 = 4.1 }, + new MultiExportChartData { x = new DateTime(2015, 01, 01), y = 13.7, y1 = 10.3, y2 = 2.8 }, + new MultiExportChartData { x = new DateTime(2016, 01, 01), y = 12.7, y1 = 7.8, y2 = 2.8 }, + new MultiExportChartData { x = new DateTime(2017, 01, 01), y = 12.5, y1 = 5.7, y2 = 3.8 }, + new MultiExportChartData { x = new DateTime(2018, 01, 01), y = 12.7, y1 = 5.9, y2 = 4.3 }, + new MultiExportChartData { x = new DateTime(2019, 01, 01), y = 12.4, y1 = 5.6, y2 = 4.7 }, + new MultiExportChartData { x = new DateTime(2020, 01, 01), y = 13.5, y1 = 5.3, y2 = 5.6 } + }; + ViewBag.dataSource = chartData; + return View(); +} +public class MultiExportChartData +{ + public DateTime x; + public double y; + public double y1; + public double y2; +} \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/razor b/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/razor new file mode 100644 index 0000000000..a1aa1da166 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/razor @@ -0,0 +1,31 @@ + @Html.EJS().Chart("container").Series(series => + { + series.Type(Syncfusion.EJ2.Charts.ChartSeriesType.Column).Width(2).XName("x").YName("y").DataSource(ViewBag.dataSource).Add(); + }).PrimaryXAxis(px => px.ValueType(Syncfusion.EJ2.Charts.ValueType.Category).Title("Manager").MajorGridLines(mg=>mg.Width(0)) + ).PrimaryYAxis(py => py.Title("Sales").MajorTickLines(mt=>mt.Width(0)).Minimum(0).Maximum(20000) + ).Title("Sales Comparision").Render() + +
+ @Html.EJS().Button("togglebtn").IsPrimary(true).Content("Export").Render() +
+ diff --git a/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/tagHelper new file mode 100644 index 0000000000..36eda67c14 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/tagHelper @@ -0,0 +1,38 @@ + + + + + + + + + + + + +
+ +
+ + \ No newline at end of file