From 4600018e7d0726716ed286e1f714c6ba4c6af962 Mon Sep 17 00:00:00 2001 From: "Sweth.Babu" Date: Tue, 7 May 2024 16:06:57 +0530 Subject: [PATCH 1/2] documentation(881081): Committed the changes in Charts. --- .../chart/EJ2_ASP.MVC/chart-print.md | 4 +- .../chart/EJ2_ASP.NETCORE/chart-print.md | 35 +++++++++++++++-- .../chart/EJ2_ASP.NETCORE/date-time-axis.md | 6 ++- .../header-footerPosition.cs | 24 ++++++++++++ .../header-footerPosition/razor | 31 +++++++++++++++ .../header-footerPosition/tagHelper | 38 +++++++++++++++++++ 6 files changed, 130 insertions(+), 8 deletions(-) create mode 100644 ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/header-footerPosition.cs create mode 100644 ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/razor create mode 100644 ej2-asp-core-mvc/code-snippet/chart/getting-started/header-footerPosition/tagHelper 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..1413b623f8 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 header and footer of the PDF page can be positioned by using the `x` and `y` properties in the header and footer. + +{% 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 From f9b2f07425fc7418abd9131465a2ea1a167ba2d9 Mon Sep 17 00:00:00 2001 From: "Sweth.Babu" Date: Tue, 7 May 2024 17:06:39 +0530 Subject: [PATCH 2/2] documentation(881081): Committed the changes in charts. --- ej2-asp-core-mvc/chart/EJ2_ASP.NETCORE/chart-print.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) 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 1413b623f8..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 @@ -111,7 +111,7 @@ In the export method, specify the following parameters to add a header and foote ### Positioning the header and footer in PDF export -The header and footer of the PDF page can be positioned by using the `x` and `y` properties in the header and footer. +The headers and footers can be positioned anywhere on the PDF page using the `x` and `y` properties. {% if page.publishingplatform == "aspnet-core" %}