From aa9a220d4079f0daea074bd8509fcda992510e7e Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Tue, 4 Jun 2024 16:16:53 +0530 Subject: [PATCH 01/10] Updated Accumulation Chart UG documentation --- .../EJ2_ASP.NETCORE/annotation.md | 40 ++++-- .../EJ2_ASP.NETCORE/center-label.md | 28 +++- .../EJ2_ASP.NETCORE/data-label.md | 121 ++++++++++++++---- .../EJ2_ASP.NETCORE/empty-points.md | 22 +++- .../EJ2_ASP.NETCORE/funnel.md | 68 +++++++--- .../EJ2_ASP.NETCORE/getting-started.md | 23 +--- .../EJ2_ASP.NETCORE/grouping.md | 44 +++++-- .../EJ2_ASP.NETCORE/legend.md | 110 ++++++++++++---- .../EJ2_ASP.NETCORE/pie-dough-nut.md | 75 +++++++++-- .../EJ2_ASP.NETCORE/pyramid.md | 58 ++++++--- .../EJ2_ASP.NETCORE/title-and-sub-title.md | 40 ++++-- .../EJ2_ASP.NETCORE/tool-tip.md | 64 +++++++-- .../annotation/alignment/tagHelper | 35 +++-- .../annotation/annotation/tagHelper | 34 +++-- .../annotation/co-ordinate/tagHelper | 34 +++-- .../annotation/region/tagHelper | 34 +++-- .../chart-print/centerlabel/tagHelper | 14 +- .../chart-print/customization/tagHelper | 16 ++- .../chart-print/hovertext/tagHelper | 17 ++- .../datalabel/connector/tagHelper | 35 +++-- .../datalabel/custom/tagHelper | 47 ++++--- .../datalabel/default/tagHelper | 31 +++-- .../datalabel/format/tagHelper | 34 +++-- .../datalabel/map/tagHelper | 29 +++-- .../datalabel/percentage/tagHelper | 38 ++++-- .../datalabel/position/tagHelper | 31 +++-- .../datalabel/smartlabels/tagHelper | 30 +++-- .../datalabel/template-percentage/tagHelper | 31 +++-- .../datalabel/template/tagHelper | 40 ++++-- .../datalabel/textwrap/tagHelper | 34 +++-- .../empty-points/custom/tagHelper | 39 ++++-- .../empty-points/empty/tagHelper | 39 ++++-- .../funnel/custom/tagHelper | 49 ++++--- .../funnel/data-label/tagHelper | 50 ++++++-- .../funnel/default/tagHelper | 30 +++-- .../funnel/explode/tagHelper | 30 +++-- .../accumulation-charts/funnel/gap/tagHelper | 30 +++-- .../funnel/neck-size/tagHelper | 30 +++-- .../accumulation-charts/funnel/size/tagHelper | 30 +++-- .../grouping/custom/tagHelper | 61 ++++++--- .../grouping/group/tagHelper | 44 +++++-- .../grouping/groupmode/tagHelper | 24 +++- .../grouping/slice/tagHelper | 24 +++- .../legend/accumulation-animation/tagHelper | 22 +++- .../legend/arrow-page/tagHelper | 27 ++-- .../legend/default/tagHelper | 28 ++-- .../legend/item-size/tagHelper | 28 ++-- .../legend/itemPadding/tagHelper | 27 ++-- .../legend/legend-shape/tagHelper | 30 +++-- .../legend/paging/tagHelper | 28 ++-- .../legend/position/tagHelper | 28 ++-- .../legend/reverse/tagHelper | 14 +- .../accumulation-charts/legend/size/tagHelper | 30 +++-- .../legend/text-wrap/tagHelper | 14 +- .../legend/title/tagHelper | 27 ++-- .../pie-doughnut/border/tagHelper | 27 ++-- .../pie-doughnut/custom/tagHelper | 47 ++++--- .../pie-doughnut/doughnut/tagHelper | 28 ++-- .../pie-doughnut/map/tagHelper | 32 +++-- .../pie-doughnut/palette/tagHelper | 28 ++-- .../pie-doughnut/pie/tagHelper | 30 +++-- .../pie-doughnut/piecenter/tagHelper | 49 ++++--- .../pie-doughnut/radius/tagHelper | 29 +++-- .../pie-doughnut/start-angle/tagHelper | 30 +++-- .../pie-doughnut/sub-title-cus/tagHelper | 37 ++++-- .../pie-doughnut/sub-title/tagHelper | 33 +++-- .../pie-doughnut/title-cus/tagHelper | 29 +++-- .../pie-doughnut/title/tagHelper | 37 ++++-- .../pie-doughnut/various-radius/tagHelper | 35 +++-- .../pyramid/custom/tagHelper | 48 ++++--- .../pyramid/default/tagHelper | 30 +++-- .../pyramid/explode/tagHelper | 30 +++-- .../accumulation-charts/pyramid/gap/tagHelper | 30 +++-- .../pyramid/mode/tagHelper | 30 +++-- .../pyramid/size/tagHelper | 31 +++-- .../tooltip/custom/tagHelper | 32 +++-- .../tooltip/default/tagHelper | 30 +++-- .../tooltip/format/tagHelper | 30 +++-- .../tooltip/header/tagHelper | 30 +++-- .../tooltip/individual/tagHelper | 45 ++++--- .../tooltip/mapping/tagHelper | 22 +++- .../tooltip/tooltip-format/tagHelper | 41 ++++-- 82 files changed, 2049 insertions(+), 891 deletions(-) diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/annotation.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/annotation.md index d2f0a17436..9697026ca2 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/annotation.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/annotation.md @@ -1,6 +1,6 @@ --- layout: post -title: Annotation in ##Platform_Name## Accumulation Chart Component +title: Annotation in ##Platform_Name## Accumulation Chart Component | Syncfusion description: Learn here all about Annotation in Syncfusion ##Platform_Name## Accumulation Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Annotation @@ -9,7 +9,7 @@ documentation: ug --- -# Annotation +# Annotation in ##Platform_Name## Accumulation Chart Component The annotations are used to mark the specific area of interest in the chart area with texts, shapes or images. @@ -23,8 +23,13 @@ By using the content option of annotation property, you can specify {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/annotation/annotation/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Annotation.cs" %} -{% include code-snippet/chart/accumulation-charts/annotation/annotation/annotation.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -52,8 +57,13 @@ The annotation can be placed with respect to either `Series` or `Chart`. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/annotation/region/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Region.cs" %} -{% include code-snippet/chart/accumulation-charts/annotation/region/region.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string x; + public double y; +} {% endhighlight %} {% endtabs %} @@ -81,8 +91,13 @@ Specifies the coordinate units of an annotation either in `Pixel` or `Point`. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/annotation/co-ordinate/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Co-ordinate.cs" %} -{% include code-snippet/chart/accumulation-charts/annotation/co-ordinate/co-ordinate.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string x; + public double y; +} {% endhighlight %} {% endtabs %} @@ -110,8 +125,13 @@ The annotations can be moved vertically and horizontally from its default positi {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/annotation/alignment/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Alignment.cs" %} -{% include code-snippet/chart/accumulation-charts/annotation/alignment/alignment.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string x; + public double y; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/center-label.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/center-label.md index 8070dd2ed8..870c341200 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/center-label.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/center-label.md @@ -19,7 +19,13 @@ Using [`centerLabel`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.E {% include code-snippet/chart/accumulation-charts/chart-print/centerlabel/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Centerlabel.cs" %} -{% include code-snippet/chart/accumulation-charts/chart-print/centerlabel/centerlabel.cs %} +... +public class PieChartData +{ + public string x; + public double y; + public string text; +} {% endhighlight %} {% endtabs %} @@ -31,8 +37,14 @@ The default text in the center label can be changed when the mouse pointer hover {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/chart-print/hovertext/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Hovertext.cs" %} -{% include code-snippet/chart/accumulation-charts/chart-print/hovertext/hovertext.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string x; + public double y; + public string text; +} {% endhighlight %} {% endtabs %} @@ -44,8 +56,14 @@ Customize the center label text using the [`textStyle`](https://help.syncfusion. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/chart-print/customization/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Customization.cs" %} -{% include code-snippet/chart/accumulation-charts/chart-print/customization/customization.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string x; + public double y; + public string text; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/data-label.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/data-label.md index c8e9cab947..da593b2be6 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/data-label.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/data-label.md @@ -17,8 +17,15 @@ Data label can be added to a chart series by enabling the [`visible`](https://h {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/default/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Default.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/default/default.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -30,8 +37,15 @@ Accumulation chart provides support for placing the data label either `inside` o {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/position/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Position.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/position/position.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -43,8 +57,15 @@ Data labels will be arranged smartly without overlapping with each other. You ca {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/smartlabels/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Smartlabels.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/smartlabels/smartlabels.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -56,8 +77,15 @@ Label content can be formatted by using the template option. Inside the template {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/template/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Template.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/template/template.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -69,8 +97,15 @@ Connector line will be visible when the data label is placed `outside` the chart {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/connector/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Connector.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/connector/connector.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -83,8 +118,15 @@ Text from the data source can be mapped to data label using `name` property. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/map/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Map.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/map/map.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -97,8 +139,15 @@ Data label for the accumulation chart can be formatted using [`format`](https:// {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/format/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="format.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/format/format.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -167,8 +216,15 @@ Individual text can be customized using the `textRender` event. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/custom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/custom/custom.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -180,8 +236,15 @@ When the data label text exceeds the container, the text can be wrapped by using {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/textwrap/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Textwrap.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/textwrap/textwrap.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string x; + public double y; + public string text; + public string tooltipMappingName; +} {% endhighlight %} {% endtabs %} @@ -197,8 +260,15 @@ You can customize the data label of pie chart using [TextRender](https://help.sy {% highlight razor tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/percentage/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Percentage.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/percentage/percentage.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -210,8 +280,15 @@ You can display the percentage values in data label of pie chart using `template {% highlight razor tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/datalabel/template-percentage/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Template-percentage.cs" %} -{% include code-snippet/chart/accumulation-charts/datalabel/template-percentage/template-percentage.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/empty-points.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/empty-points.md index 2f605ed8d0..5698d28a61 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/empty-points.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/empty-points.md @@ -1,6 +1,6 @@ --- layout: post -title: Empty Points in ##Platform_Name## Accumulation Chart Component +title: Empty Points in ##Platform_Name## Accumulation Chart Component | Syncfusion description: Learn here all about Empty Points in Syncfusion ##Platform_Name## Accumulation Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Empty Points @@ -9,7 +9,7 @@ documentation: ug --- -# Empty Points +# Empty Points in ##Platform_Name## Accumulation Chart Component The data points those uses the `null` or `undefined` as value are considered as empty points. The empty data points are ignored and not plotted in the chart. You can customize those points, using the `emptyPointSettings` property in series. The default mode of the empty point is `Gap`. Other supported modes are `Average` and `Zero`. @@ -19,8 +19,13 @@ The data points those uses the `null` or `undefined` as value are considered as {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/empty-points/empty/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Empty.cs" %} -{% include code-snippet/chart/accumulation-charts/empty-points/empty/empty.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class EmptyPointsChartData +{ + public string xValue; + public Nullable yValue; +} {% endhighlight %} {% endtabs %} @@ -48,8 +53,13 @@ Specific color for an empty point can be set by using the `fill` property in `em {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/empty-points/custom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/empty-points/custom/custom.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class EmptyPointsChartData +{ + public string xValue; + public Nullable yValue; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/funnel.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/funnel.md index a928ccb2a1..3f31b28b71 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/funnel.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/funnel.md @@ -1,6 +1,6 @@ --- layout: post -title: Funnel in ##Platform_Name## Accumulation Chart Component +title: Funnel in ##Platform_Name## Accumulation Chart Component | Syncfusion description: Learn here all about Funnel in Syncfusion ##Platform_Name## Accumulation Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Funnel @@ -9,7 +9,7 @@ documentation: ug --- -# Funnel Chart +# Funnel Chart in ##Platform_Name## Accumulation Chart Component To render a funnel series, use the series [`type`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationSeries.html#Syncfusion_EJ2_Charts_AccumulationSeries_Type) as `Funnel`. @@ -19,8 +19,13 @@ To render a funnel series, use the series [`type`](https://help.syncfusion.com/c {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/default/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Default.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/default/default.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -48,8 +53,13 @@ The size of the funnel chart can be customized by using the `width` and `height` {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/size/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Size.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/size/size.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -77,8 +87,13 @@ The funnel's neck size can be customized by using the `neckWidth` and `neckHeigh {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/neck-size/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Neck-size.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/neck-size/neck-size.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -106,8 +121,13 @@ Funnel chart provides options to customize the space between the segments by usi {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/gap/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Gap.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/gap/gap.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -135,8 +155,13 @@ Points can be exploded on mouse click by setting the `explode` property to true. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/explode/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Explode.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/explode/explode.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -164,8 +189,14 @@ It provides the data label smart arrangement of the funnel and pyramid series. T {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/data-label/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Data-label.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/data-label/data-label.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -193,8 +224,13 @@ Individual points can be customized using the `pointRender` event. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/funnel/custom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/funnel/custom/custom.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class FunnelChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/getting-started.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/getting-started.md index 691148cb60..f1826b20d0 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/getting-started.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/getting-started.md @@ -55,17 +55,15 @@ Open `~/Pages/_ViewImports.cshtml` file and import the `Syncfusion.EJ2` TagHelpe {% endhighlight %} {% endtabs %} -## Add stylesheet and script resources +## Add script resources -Here, the theme and script is referred using CDN inside the `` of `~/Pages/Shared/_Layout.cshtml` file as follows, +Here, the script is referred using CDN inside the `` of `~/Pages/Shared/_Layout.cshtml` file as follows, {% tabs %} {% highlight cshtml tabtitle="~/_Layout.cshtml" %} ... - - @@ -97,23 +95,6 @@ Also, register the script manager `` at the end of `` in the A Now, add the Syncfusion ASP.NET Core Accumulation Chart tag helper in `~/Pages/Index.cshtml` page. -{% tabs %} -{% highlight c# tabtitle="CSHTML" %} - - - - - - - - - - -{% endhighlight %} -{% endtabs %} - -**Pie Series** - By default, the pie series will be rendered when assigning the JSON data to the series using the [`dataSource`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationSeries.html#Syncfusion_EJ2_Charts_AccumulationSeries_DataSource) property. Map the field names in the JSON data to the [`xName`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationSeries.html#Syncfusion_EJ2_Charts_AccumulationSeries_XName) and [`yName`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationSeries.html#Syncfusion_EJ2_Charts_AccumulationSeries_YName) properties of the series. {% tabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/grouping.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/grouping.md index 060f770c70..15dd243e0e 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/grouping.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/grouping.md @@ -1,6 +1,6 @@ --- layout: post -title: Grouping in ##Platform_Name## Accumulation Chart Component +title: Grouping in ##Platform_Name## Accumulation Chart Component | Syncfusion description: Learn here all about Grouping in Syncfusion ##Platform_Name## Accumulation Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Grouping @@ -10,7 +10,7 @@ documentation: ug -# Grouping +# Grouping in ##Platform_Name## Accumulation Chart Component You can club or group few points of the series based on [`groupTo`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationSeries.html#Syncfusion_EJ2_Charts_AccumulationSeries_GroupTo) property. For example, if the club value is 11, then the points with value less than 11 is grouped together and will be showed as a single point with label `others`. The property also takes value in percentage (percentage of total data points value). @@ -20,8 +20,14 @@ You can club or group few points of the series based on [`groupTo`](https://help {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/grouping/group/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Group.cs" %} -{% include code-snippet/chart/accumulation-charts/grouping/group/group.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -51,8 +57,14 @@ You can visualize all points available in club or group points by clicking on th {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/grouping/slice/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Slice.cs" %} -{% include code-snippet/chart/accumulation-charts/grouping/slice/slice.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -80,8 +92,14 @@ Slice can also be grouped based on the number of points by specifying the [`grou {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/grouping/groupmode/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Groupmode.cs" %} -{% include code-snippet/chart/accumulation-charts/grouping/groupmode/groupmode.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -109,8 +127,14 @@ You can customize the grouped point and its data label using `pointRender` and ` {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/grouping/custom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/grouping/custom/custom.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/legend.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/legend.md index 5ba8b212e1..0df2e472cb 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/legend.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/legend.md @@ -19,8 +19,13 @@ Like chart, the legend is also available for accumulation charts, which gives in {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/default/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Default.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/default/default.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -48,8 +53,13 @@ By using the position property, you can position the legend at the `left`, ` {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/position/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Position.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/position/position.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -77,8 +87,13 @@ You can reverse the order of the legend items by using the [`reverse`](https://h {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/reverse/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Reverse.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/reverse/reverse.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -106,8 +121,13 @@ To change the legend icon shape, use the `legendShape` property in the `series {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/legend-shape/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Legend-shape.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/legend-shape/legend-shape.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -135,8 +155,14 @@ The legend size can be changed by using the `width` and `height` properties of t {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/size/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Size.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/size/size.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} + {% endhighlight %} {% endtabs %} @@ -164,8 +190,13 @@ You can customize the size of the legend items by using the `shapeHeight` and `s {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/item-size/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Item-size.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/item-size/item-size.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -193,8 +224,13 @@ Paging will be enabled by default, when the legend items exceeds the legend boun {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/paging/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Paging.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/paging/paging.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -220,8 +256,13 @@ When the legend text exceeds the container, the text can be wrapped by using **t {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/text-wrap/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Textwrap.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/text-wrap/textwrap.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -248,8 +289,14 @@ You can customize the animation while clicking legend by setting enableAnimation {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/accumulation-animation/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Accumulation-animation.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/accumulation-animation/accumulation-animation.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -277,8 +324,13 @@ You can set title for legend using `Title` property in `LegendSettings`. You can {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/title/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Title.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/title/title.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -306,8 +358,13 @@ By default, the page number will be enabled while legend paging. Now, you can di {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/arrow-page/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Arrow-page.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/arrow-page/arrow-page.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -333,8 +390,13 @@ The [`itemPadding`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2 {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/legend/itemPadding/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="ItemPadding.cs" %} -{% include code-snippet/chart/accumulation-charts/legend/itemPadding/itemPadding.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pie-dough-nut.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pie-dough-nut.md index 0ee6added2..7906a30e92 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pie-dough-nut.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pie-dough-nut.md @@ -21,8 +21,13 @@ To render a pie series, use the series [`type`](https://help.syncfusion.com/cr/a {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pie-doughnut/pie/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Pie.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/pie/pie.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -51,7 +56,12 @@ By default, radius of the pie series will be 80% of the size (minimum of chart w {% include code-snippet/chart/accumulation-charts/pie-doughnut/radius/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Radius.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/radius/radius.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -80,7 +90,13 @@ The center position of the pie can be changed by Center X and Center Y. By defau {% include code-snippet/chart/accumulation-charts/pie-doughnut/piecenter/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Piecenter.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/piecenter/piecenter.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -109,7 +125,13 @@ You can use radius mapping to render the slice with different [`radius`](https:/ {% include code-snippet/chart/accumulation-charts/pie-doughnut/various-radius/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Various-radius.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/various-radius/various-radius.cs %} +... +public class PieRadiusChartData +{ + public string xValue; + public double yValue; + public string r; +} {% endhighlight %} {% endtabs %} @@ -138,7 +160,11 @@ To achieve a doughnut in pie series, customize the [`innerRadius`](https://help. {% include code-snippet/chart/accumulation-charts/pie-doughnut/doughnut/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Doughnut.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/doughnut/doughnut.cs %} +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -167,7 +193,12 @@ You can customize the start and end angle of the pie series using the [`startAng {% include code-snippet/chart/accumulation-charts/pie-doughnut/start-angle/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Start-angle.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/start-angle/start-angle.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -196,7 +227,14 @@ The fill color and the text in the data source can be mapped to the chart using {% include code-snippet/chart/accumulation-charts/pie-doughnut/map/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Map.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/map/map.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; + public string fill; +} {% endhighlight %} {% endtabs %} @@ -225,7 +263,12 @@ Individual points can be customized using the `pointRender` event. {% include code-snippet/chart/accumulation-charts/pie-doughnut/custom/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/custom/custom.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -254,7 +297,12 @@ By default, the border will appear in the pie or doughnut chart while mouse hove {% include code-snippet/chart/accumulation-charts/pie-doughnut/border/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Border.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/border/border.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -283,7 +331,12 @@ You can customize the color of the point using the `palettes` property. {% include code-snippet/chart/accumulation-charts/pie-doughnut/palette/tagHelper %} {% endhighlight %} {% highlight c# tabtitle="Palette.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/palette/palette.cs %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pyramid.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pyramid.md index 83c2fe312b..6a21bdba88 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pyramid.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/pyramid.md @@ -1,6 +1,6 @@ --- layout: post -title: Pyramid in ##Platform_Name## Accumulation Chart Component +title: Pyramid in ##Platform_Name## Accumulation Chart Component | Syncfusion description: Learn here all about Pyramid in Syncfusion ##Platform_Name## Accumulation Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Pyramid @@ -9,7 +9,7 @@ documentation: ug --- -# Pyramid Chart +# Pyramid Chart in ##Platform_Name## Accumulation Chart Component To render a pyramid series, use the series [`type`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationSeries.html#Syncfusion_EJ2_Charts_AccumulationSeries_Type) as `Pyramid`. @@ -19,8 +19,13 @@ To render a pyramid series, use the series [`type`](https://help.syncfusion.com/ {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/default/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Default.cs" %} -{% include code-snippet/chart/accumulation-charts/pyramid/default/default.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PyramidChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -48,8 +53,13 @@ The Pyramid chart supports linear and surface modes of rendering. The default ty {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/mode/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Mode.cs" %} -{% include code-snippet/chart/accumulation-charts/pyramid/mode/mode.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PyramidChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -59,7 +69,7 @@ The Pyramid chart supports linear and surface modes of rendering. The default ty {% highlight razor tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/mode/razor %} {% endhighlight %} -{% highlight c# tabtitle="Mode.cs" %} +{% highlight c# tabtitle="CSHTML.cs" %} {% include code-snippet/chart/accumulation-charts/pyramid/mode/mode.cs %} {% endhighlight %} {% endtabs %} @@ -77,8 +87,13 @@ The size of the pyramid chart can be customized by using the `width` and `height {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/size/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Size.cs" %} -{% include code-snippet/chart/accumulation-charts/pyramid/size/size.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PyramidChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -106,8 +121,13 @@ Pyramid chart provides options to customize the space between the segments by us {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/gap/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Gap.cs" %} -{% include code-snippet/chart/accumulation-charts/pyramid/gap/gap.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PyramidChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -135,8 +155,12 @@ Points can be exploded on mouse click by setting the `explode` property to true. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/explode/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Explode.cs" %} -{% include code-snippet/chart/accumulation-charts/pyramid/explode/explode.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +public class PyramidChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -163,8 +187,12 @@ Individual points can be customized using the `pointRender` event. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pyramid/custom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/pyramid/custom/custom.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +public class PyramidChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md index 8404f650a6..4ce92984f5 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md @@ -20,8 +20,14 @@ Accumulation Chart can be given a title using [`title`](https://help.syncfusion. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pie-doughnut/title/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Title.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/title/title.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -49,8 +55,14 @@ Accumulation Chart can be customized a title using [`titleStyle`](https://help.s {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pie-doughnut/title-cus/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Title.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/title-cus/title.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -78,8 +90,14 @@ Accumulation Chart can be given a subtitle using [`subTitle`](https://help.syncf {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pie-doughnut/sub-title/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Title.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/sub-title/title.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} @@ -107,8 +125,14 @@ Accumulation Chart can be customized a subtitle using [`subTitleStyle`](https:// {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/pie-doughnut/sub-title-cus/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Title.cs" %} -{% include code-snippet/chart/accumulation-charts/pie-doughnut/sub-title-cus/title.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/tool-tip.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/tool-tip.md index 1eaf29c5b8..2a2bcbabd7 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/tool-tip.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/tool-tip.md @@ -19,8 +19,13 @@ Tooltip for the accumulation chart can be enabled by using the [`Enable`](https {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/default/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Default.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/default/default.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -48,8 +53,13 @@ We can specify header for the tooltip using [`Header`](https://help.syncfusion.c {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/header/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Header.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/header/header.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -77,8 +87,13 @@ By default, tooltip shows information of x and y value in points. In addition to {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/format/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Format.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/format/format.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -106,8 +121,13 @@ Any HTML element can be displayed in the tooltip by using the [`Template`](https {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/tooltip-format/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Tooltip-format.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/tooltip-format/tooltip-format.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -164,8 +184,13 @@ The [`Fill`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/custom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Custom.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/custom/custom.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -193,8 +218,13 @@ Using [`TooltipRender`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/individual/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Individual.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/individual/individual.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class PieChartData +{ + public string xValue; + public double yValue; +} {% endhighlight %} {% endtabs %} @@ -222,8 +252,14 @@ By default, tooltip shows information of x and y value in points. You can show m {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/chart/accumulation-charts/tooltip/mapping/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Mapping.cs" %} -{% include code-snippet/chart/accumulation-charts/tooltip/mapping/mapping.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingChartData +{ + public string xValue; + public double yValue; + public string text; +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/alignment/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/alignment/tagHelper index 0b8ec3d1aa..f2b87fdeaa 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/alignment/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/alignment/tagHelper @@ -1,13 +1,24 @@ +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 37 }, + new PieChartData { x = "UC Browser", y = 17 }, + new PieChartData { x = "iPhone", y = 19 }, + new PieChartData { x = "Others", y = 4 }, + new PieChartData { x = "Opera", y = 11 }, + new PieChartData { x = "Android", y = 12 }, + }; - - - - - - - - - - - - \ No newline at end of file +} + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/annotation/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/annotation/tagHelper index 7413191118..72cb4fc28f 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/annotation/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/annotation/tagHelper @@ -1,11 +1,23 @@ - - - - - - - - - - - +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/co-ordinate/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/co-ordinate/tagHelper index 512ff7812c..030d49140a 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/co-ordinate/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/co-ordinate/tagHelper @@ -1,11 +1,23 @@ - - - - - - - - - - - +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 37 }, + new PieChartData { x = "UC Browser", y = 17 }, + new PieChartData { x = "iPhone", y = 19 }, + new PieChartData { x = "Others", y = 4 }, + new PieChartData { x = "Opera", y = 11 }, + new PieChartData { x = "Android", y = 12 }, + }; +} + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/region/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/region/tagHelper index c0c6da75a1..030d49140a 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/region/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/annotation/region/tagHelper @@ -1,13 +1,23 @@ +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 37 }, + new PieChartData { x = "UC Browser", y = 17 }, + new PieChartData { x = "iPhone", y = 19 }, + new PieChartData { x = "Others", y = 4 }, + new PieChartData { x = "Opera", y = 11 }, + new PieChartData { x = "Android", y = 12 }, + }; +} - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/centerlabel/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/centerlabel/tagHelper index 46cd5ccd34..cabaef8c31 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/centerlabel/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/centerlabel/tagHelper @@ -1,6 +1,18 @@ +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 61.3, text = "Chrome: 61.3%"}, + new PieChartData { x = "Safari", y = 24.6, text = "Safari: 24.6%"}, + new PieChartData { x = "Edge", y = 5.0, text = "Edge: 5.0%"}, + new PieChartData { x = "Samsung Internet", y = 2.7, text = "Samsung Internet: 2.7%"}, + new PieChartData { x = "Firefox", y = 2.6, text = "Firefox: 2.6%"}, + new PieChartData { x = "Others", y = 3.6, text = "Others: 3.6%"} + }; +} + - + diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/customization/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/customization/tagHelper index fb915d8a98..64c3d003d9 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/customization/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/customization/tagHelper @@ -1,6 +1,18 @@ +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 61.3, text = "Chrome: 61.3%"}, + new PieChartData { x = "Safari", y = 24.6, text = "Safari: 24.6%"}, + new PieChartData { x = "Edge", y = 5.0, text = "Edge: 5.0%"}, + new PieChartData { x = "Samsung Internet", y = 2.7, text = "Samsung Internet: 2.7%"}, + new PieChartData { x = "Firefox", y = 2.6, text = "Firefox: 2.6%"}, + new PieChartData { x = "Others", y = 3.6, text = "Others: 3.6%"} + }; +} + - + @@ -8,4 +20,4 @@ - + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/hovertext/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/hovertext/tagHelper index 553af639df..8fe5f114d0 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/hovertext/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/chart-print/hovertext/tagHelper @@ -1,11 +1,22 @@ +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 61.3, text = "Chrome: 61.3%"}, + new PieChartData { x = "Safari", y = 24.6, text = "Safari: 24.6%"}, + new PieChartData { x = "Edge", y = 5.0, text = "Edge: 5.0%"}, + new PieChartData { x = "Samsung Internet", y = 2.7, text = "Samsung Internet: 2.7%"}, + new PieChartData { x = "Firefox", y = 2.6, text = "Firefox: 2.6%"}, + new PieChartData { x = "Others", y = 3.6, text = "Others: 3.6%"} + }; +} + - + + hoverTextFormat="${point.x}
Browser Share
${point.y}%">
-
\ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/connector/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/connector/tagHelper index 6d9c6ce8e5..7557fd3825 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/connector/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/connector/tagHelper @@ -1,15 +1,22 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} - - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/custom/tagHelper index ec0007062e..c3b83c03da 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/custom/tagHelper @@ -1,21 +1,30 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} - - - - - - - - - - - - \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/default/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/default/tagHelper index 4b8a6ee595..02848a5772 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/default/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/default/tagHelper @@ -1,11 +1,20 @@ - - - - - - - - - - - \ No newline at end of file +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/format/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/format/tagHelper index 511583cfc0..afe628240c 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/format/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/format/tagHelper @@ -1,13 +1,21 @@ - @section ControlsSection{ - - - - - - - - - - - } \ No newline at end of file +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/map/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/map/tagHelper index cb3a43e6d5..fb530c2ccf 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/map/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/map/tagHelper @@ -1,11 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} - - - - - - - - - - + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/percentage/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/percentage/tagHelper index b499f8241e..663c7b5b32 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/percentage/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/percentage/tagHelper @@ -1,16 +1,26 @@ - - - - - - - - - - - +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/position/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/position/tagHelper index 4295f0fd3a..45e5738383 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/position/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/position/tagHelper @@ -1,13 +1,20 @@ - +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/smartlabels/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/smartlabels/tagHelper index 14b763bbc8..f258a28d94 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/smartlabels/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/smartlabels/tagHelper @@ -1,12 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template-percentage/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template-percentage/tagHelper index 736addad00..400b74f084 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template-percentage/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template-percentage/tagHelper @@ -1,11 +1,20 @@ - - - - - - - - - - - \ No newline at end of file +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template/tagHelper index 6d622d98ff..4358ec17c2 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/template/tagHelper @@ -1,13 +1,27 @@ - @section ControlsSection{ - - - - - - " + "
${point.y}
"> -
-
-
-
- } \ No newline at end of file +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} + + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/textwrap/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/textwrap/tagHelper index afb3b6b7f4..7ee317eba7 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/textwrap/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/datalabel/textwrap/tagHelper @@ -1,13 +1,21 @@ - @section ControlsSection{ - - - - - - - - - - - } \ No newline at end of file +@{ + List chartData = new List + { + new PieChartData { x = "Chrome", y = 100, text= "Chrome (100M)
40%", tooltipMappingName= "40%" }, + new PieChartData { x=" UC Browser", y= 40, text= "UC Browser (40M)
16%", tooltipMappingName= "16%" }, + new PieChartData { x= "Opera" , y= 30, text= "Opera (30M)
12%", tooltipMappingName= "12%" }, + new PieChartData { x= "Safari", y= 30, text= "Safari (30M)
12%", tooltipMappingName= "12%" }, + }; +} + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/custom/tagHelper index de60ae91fd..0f45dec42e 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/custom/tagHelper @@ -1,14 +1,27 @@ +@{ + List chartData = new List + { + new EmptyPointsChartData { xValue = "Rice", yValue = 80 }, + new EmptyPointsChartData { xValue = "Wheat", yValue = null }, + new EmptyPointsChartData { xValue = "Oil", yValue = 70 }, + new EmptyPointsChartData { xValue = "Corn", yValue = 60 }, + new EmptyPointsChartData { xValue = "Gram", yValue = null }, + new EmptyPointsChartData { xValue = "Milk", yValue = 70 }, + new EmptyPointsChartData { xValue = "Peas", yValue = 80 }, + new EmptyPointsChartData { xValue = "Fruit", yValue = 60 }, + new EmptyPointsChartData { xValue = "Butter",yValue = null }, + }; +} - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/empty/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/empty/tagHelper index 4cffe5b5e7..27275348f4 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/empty/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/empty-points/empty/tagHelper @@ -1,14 +1,27 @@ +@{ + List chartData = new List + { + new EmptyPointsChartData { xValue = "Rice", yValue = 80 }, + new EmptyPointsChartData { xValue = "Wheat", yValue = null }, + new EmptyPointsChartData { xValue = "Oil", yValue = 70 }, + new EmptyPointsChartData { xValue = "Corn", yValue = 60 }, + new EmptyPointsChartData { xValue = "Gram", yValue = null }, + new EmptyPointsChartData { xValue = "Milk", yValue = 70 }, + new EmptyPointsChartData { xValue = "Peas", yValue = 80 }, + new EmptyPointsChartData { xValue = "Fruit", yValue = 60 }, + new EmptyPointsChartData { xValue = "Butter",yValue = null } + }; +} - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/custom/tagHelper index 5cac7fd362..8f5ad9037c 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/custom/tagHelper @@ -1,21 +1,32 @@ +@{ + List chartData = new List + { + new FunnelChartData { xValue = "Chrome", yValue = 37 }, + new FunnelChartData { xValue = "UC Browser", yValue = 17 }, + new FunnelChartData { xValue = "iPhone", yValue = 19 }, + new FunnelChartData { xValue = "Others", yValue = 4 }, + new FunnelChartData { xValue = "Opera", yValue = 11 }, + new FunnelChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - - \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/data-label/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/data-label/tagHelper index 7505c91a9d..1734c025eb 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/data-label/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/data-label/tagHelper @@ -1,13 +1,37 @@ - - - - - - - - - - - - - \ No newline at end of file +@page +@using static PyramidFunnelTypeSample.Pages.FunnelSmartLabelModel +@model PyramidFunnelTypeSample.Pages.FunnelSmartLabelModel +@{ + List chartData = new List + { + new FunnelData { xValue = "China", yValue = 1409517397, text = "China" }, + new FunnelData { xValue = "India", yValue = 1339180127, text = "India" }, + new FunnelData { xValue = "United States", yValue = 324459463, text = "United States" }, + new FunnelData { xValue = "Indonesia", yValue = 263991379, text = "Indonesia" }, + new FunnelData { xValue = "Brazil", yValue = 209288278, text = "Brazil" }, + new FunnelData { xValue = "Pakistan", yValue = 197015955, text = "Pakistan" }, + new FunnelData { xValue = "Nigeria", yValue = 190886311, text = "Nigeria" }, + new FunnelData { xValue = "Bangladesh", yValue = 164669751, text = "Bangladesh" }, + new FunnelData { xValue = "Russia", yValue = 143989754, text = "Russia" }, + new FunnelData { xValue = "Mexico", yValue = 129163276, text = "Mexico" }, + new FunnelData { xValue = "Japan", yValue = 127484450, text = " Japan" }, + new FunnelData { xValue = "Ethiopia", yValue = 104957438, text = "Ethiopia" }, + new FunnelData { xValue = "Philippines", yValue = 104918090, text = "Philippines" }, + new FunnelData { xValue = "Egypt", yValue = 97553151, text = "Egypt" }, + new FunnelData { xValue = "Vietnam", yValue = 95540800, text = "Vietnam" }, + new FunnelData { xValue = "Germany", yValue = 82114224, text = "Germany" }, + }; +} + + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/default/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/default/tagHelper index 83532d36d3..97be3afa6c 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/default/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/default/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new FunnelChartData { xValue = "Chrome", yValue = 37 }, + new FunnelChartData { xValue = "UC Browser", yValue = 17 }, + new FunnelChartData { xValue = "iPhone", yValue = 19 }, + new FunnelChartData { xValue = "Others", yValue = 4 }, + new FunnelChartData { xValue = "Opera", yValue = 11 }, + new FunnelChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/explode/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/explode/tagHelper index c388becc38..17fdd276b5 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/explode/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/explode/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new FunnelChartData { xValue = "Chrome", yValue = 37 }, + new FunnelChartData { xValue = "UC Browser", yValue = 17 }, + new FunnelChartData { xValue = "iPhone", yValue = 19 }, + new FunnelChartData { xValue = "Others", yValue = 4 }, + new FunnelChartData { xValue = "Opera", yValue = 11 }, + new FunnelChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/gap/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/gap/tagHelper index 313840c1ec..87e26c8126 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/gap/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/gap/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new FunnelChartData { xValue = "Chrome", yValue = 37 }, + new FunnelChartData { xValue = "UC Browser", yValue = 17 }, + new FunnelChartData { xValue = "iPhone", yValue = 19 }, + new FunnelChartData { xValue = "Others", yValue = 4 }, + new FunnelChartData { xValue = "Opera", yValue = 11 }, + new FunnelChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/neck-size/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/neck-size/tagHelper index 5e2dd7e833..970c4ee726 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/neck-size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/neck-size/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new FunnelChartData { xValue = "Chrome", yValue = 37 }, + new FunnelChartData { xValue = "UC Browser", yValue = 17 }, + new FunnelChartData { xValue = "iPhone", yValue = 19 }, + new FunnelChartData { xValue = "Others", yValue = 4 }, + new FunnelChartData { xValue = "Opera", yValue = 11 }, + new FunnelChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/size/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/size/tagHelper index 8125ffbf1f..f804d2b4bc 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/funnel/size/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new FunnelChartData { xValue = "Chrome", yValue = 37 }, + new FunnelChartData { xValue = "UC Browser", yValue = 17 }, + new FunnelChartData { xValue = "iPhone", yValue = 19 }, + new FunnelChartData { xValue = "Others", yValue = 4 }, + new FunnelChartData { xValue = "Opera", yValue = 11 }, + new FunnelChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/custom/tagHelper index c85a557145..67c8306a6f 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/custom/tagHelper @@ -1,30 +1,49 @@ +@{ + List chartData = new List + { + new GroupingChartData { xValue = "China", yValue = 26, text = "China: 26" }, + new GroupingChartData { xValue = "Russia", yValue = 19, text = "Russia: 19" }, + new GroupingChartData { xValue = "Germany", yValue = 17, text = "Germany: 17" }, + new GroupingChartData { xValue = "Japan", yValue = 12, text = "Japan: 12" }, + new GroupingChartData { xValue = "France", yValue = 10, text = "France: 10" }, + new GroupingChartData { xValue = "South Korea", yValue = 9, text = "South Korea: 9" }, + new GroupingChartData { xValue = "Great Britain", yValue = 27, text = "Great Britain: 27" }, + new GroupingChartData { xValue = "Italy", yValue = 8, text = "Italy: 8" }, + new GroupingChartData { xValue = "Australia", yValue = 8, text = "Australia: 8" }, + new GroupingChartData { xValue = "Netherlands", yValue = 8, text = "Netherlands: 8" }, + new GroupingChartData { xValue = "Hungary", yValue = 8, text = "Hungary: 8" }, + new GroupingChartData { xValue = "Brazil", yValue = 7, text = "Brazil: 7" }, + new GroupingChartData { xValue = "Spain", yValue = 7, text = "Spain: 7" }, + new GroupingChartData { xValue = "Kenya", yValue = 6, text = "Kenya: 6" } + }; +} - - - - - - - - - - - - - + + + + + + + + + + + + + - \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/group/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/group/tagHelper index 58362760cd..6b31a53b7e 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/group/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/group/tagHelper @@ -1,14 +1,32 @@ +@{ + List chartData = new List + { + new GroupingChartData { xValue = "China", yValue = 26, text = "China: 26" }, + new GroupingChartData { xValue = "Russia", yValue = 19, text = "Russia: 19" }, + new GroupingChartData { xValue = "Germany", yValue = 17, text = "Germany: 17" }, + new GroupingChartData { xValue = "Japan", yValue = 12, text = "Japan: 12" }, + new GroupingChartData { xValue = "France", yValue = 10, text = "France: 10" }, + new GroupingChartData { xValue = "South Korea", yValue = 9, text = "South Korea: 9" }, + new GroupingChartData { xValue = "Great Britain", yValue = 27, text = "Great Britain: 27" }, + new GroupingChartData { xValue = "Italy", yValue = 8, text = "Italy: 8" }, + new GroupingChartData { xValue = "Australia", yValue = 8, text = "Australia: 8" }, + new GroupingChartData { xValue = "Netherlands", yValue = 8, text = "Netherlands: 8" }, + new GroupingChartData { xValue = "Hungary", yValue = 8, text = "Hungary: 8" }, + new GroupingChartData { xValue = "Brazil", yValue = 7, text = "Brazil: 7" }, + new GroupingChartData { xValue = "Spain", yValue = 7, text = "Spain: 7" }, + new GroupingChartData { xValue = "Kenya", yValue = 6, text = "Kenya: 6" } + }; +} - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/groupmode/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/groupmode/tagHelper index 3ade2c8a8a..6f2a644ed6 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/groupmode/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/groupmode/tagHelper @@ -1,6 +1,26 @@ - +@{ + List chartData = new List + { + new GroupingChartData { xValue = "China", yValue = 26, text = "China: 26" }, + new GroupingChartData { xValue = "Russia", yValue = 19, text = "Russia: 19" }, + new GroupingChartData { xValue = "Germany", yValue = 17, text = "Germany: 17" }, + new GroupingChartData { xValue = "Japan", yValue = 12, text = "Japan: 12" }, + new GroupingChartData { xValue = "France", yValue = 10, text = "France: 10" }, + new GroupingChartData { xValue = "South Korea", yValue = 9, text = "South Korea: 9" }, + new GroupingChartData { xValue = "Great Britain", yValue = 27, text = "Great Britain: 27" }, + new GroupingChartData { xValue = "Italy", yValue = 8, text = "Italy: 8" }, + new GroupingChartData { xValue = "Australia", yValue = 8, text = "Australia: 8" }, + new GroupingChartData { xValue = "Netherlands", yValue = 8, text = "Netherlands: 8" }, + new GroupingChartData { xValue = "Hungary", yValue = 8, text = "Hungary: 8" }, + new GroupingChartData { xValue = "Brazil", yValue = 7, text = "Brazil: 7" }, + new GroupingChartData { xValue = "Spain", yValue = 7, text = "Spain: 7" }, + new GroupingChartData { xValue = "Kenya", yValue = 6, text = "Kenya: 6" } + }; +} + + - + diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/slice/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/slice/tagHelper index a59e38d61a..f362c25fca 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/slice/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/grouping/slice/tagHelper @@ -1,6 +1,26 @@ - +@{ + List chartData = new List + { + new GroupingChartData { xValue = "China",yValue = 26, text = "China: 26" }, + new GroupingChartData { xValue = "Russia", yValue = 19, text = "Russia: 19" }, + new GroupingChartData { xValue = "Germany", yValue = 17, text = "Germany: 17" }, + new GroupingChartData { xValue = "Japan", yValue = 12, text = "Japan: 12" }, + new GroupingChartData { xValue = "France", yValue = 10, text = "France: 10" }, + new GroupingChartData { xValue = "South Korea", yValue = 9, text = "South Korea: 9" }, + new GroupingChartData { xValue = "Great Britain", yValue = 27, text = "Great Britain: 27" }, + new GroupingChartData { xValue = "Italy", yValue = 8, text = "Italy: 8" }, + new GroupingChartData { xValue = "Australia", yValue = 8, text = "Australia: 8" }, + new GroupingChartData { xValue = "Netherlands", yValue = 8, text = "Netherlands: 8" }, + new GroupingChartData { xValue = "Hungary", yValue = 8, text = "Hungary: 8" }, + new GroupingChartData { xValue = "Brazil", yValue = 7, text = "Brazil: 7" }, + new GroupingChartData { xValue = "Spain", yValue = 7, text = "Spain: 7" }, + new GroupingChartData { xValue = "Kenya", yValue = 6, text = "Kenya: 6" } + }; +} + + - + diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/accumulation-animation/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/accumulation-animation/tagHelper index 1a2b3da5a4..8c1dcc82e9 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/accumulation-animation/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/accumulation-animation/tagHelper @@ -1,8 +1,28 @@ +@{ + List chartData = new List + { + new GroupingChartData { xValue = "China", yValue = 26, text = "China: 26" }, + new GroupingChartData { xValue = "Russia", yValue = 19, text = "Russia: 19" }, + new GroupingChartData { xValue = "Germany", yValue = 17, text = "Germany: 17" }, + new GroupingChartData { xValue = "Japan", yValue = 12, text = "Japan: 12" }, + new GroupingChartData { xValue = "France", yValue = 10, text = "France: 10" }, + new GroupingChartData { xValue = "South Korea", yValue = 9, text = "South Korea: 9" }, + new GroupingChartData { xValue = "Great Britain", yValue = 27, text = "Great Britain: 27" }, + new GroupingChartData { xValue = "Italy", yValue = 8, text = "Italy: 8" }, + new GroupingChartData { xValue = "Australia", yValue = 8, text = "Australia: 8" }, + new GroupingChartData { xValue = "Netherlands", yValue = 8, text = "Netherlands: 8" }, + new GroupingChartData { xValue = "Hungary", yValue = 8, text = "Hungary: 8" }, + new GroupingChartData { xValue = "Brazil", yValue = 7, text = "Brazil: 7" }, + new GroupingChartData { xValue = "Spain", yValue = 7, text = "Spain: 7" }, + new GroupingChartData { xValue = "Kenya", yValue = 6, text = "Kenya: 6" } + }; +} + - + diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/arrow-page/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/arrow-page/tagHelper index 63ffb778f7..90d1e84143 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/arrow-page/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/arrow-page/tagHelper @@ -1,9 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/default/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/default/tagHelper index 30ccbe0622..3cb67c28d7 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/default/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/default/tagHelper @@ -1,10 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/item-size/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/item-size/tagHelper index 8d7597d77c..f362785719 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/item-size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/item-size/tagHelper @@ -1,10 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/itemPadding/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/itemPadding/tagHelper index b87e7f2d41..a8c0182520 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/itemPadding/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/itemPadding/tagHelper @@ -1,9 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/legend-shape/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/legend-shape/tagHelper index da10aa88d6..443b210bcb 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/legend-shape/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/legend-shape/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/paging/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/paging/tagHelper index dfc54ff3b3..7127f8d1ad 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/paging/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/paging/tagHelper @@ -1,10 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/position/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/position/tagHelper index 505e1b9bfb..55a6d4c03d 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/position/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/position/tagHelper @@ -1,10 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/reverse/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/reverse/tagHelper index a3a57a3629..85984297ad 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/reverse/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/reverse/tagHelper @@ -1,8 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} + - + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/size/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/size/tagHelper index 2be7cecfc3..2fbf50eca5 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/size/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/text-wrap/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/text-wrap/tagHelper index 45390248a5..139c3a94bb 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/text-wrap/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/text-wrap/tagHelper @@ -1,8 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} + - + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/title/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/title/tagHelper index 1106d365c0..a3b8176c93 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/title/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/legend/title/tagHelper @@ -1,9 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/border/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/border/tagHelper index 2e9a223f07..e38e0e661b 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/border/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/border/tagHelper @@ -1,9 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/custom/tagHelper index 3405f5eaad..ef7e025367 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/custom/tagHelper @@ -1,20 +1,31 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - + + + + + + + + - \ No newline at end of file + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/doughnut/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/doughnut/tagHelper index 8c55bbf25b..89df362752 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/doughnut/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/doughnut/tagHelper @@ -1,10 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/map/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/map/tagHelper index ecb3004898..ab6dd97d02 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/map/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/map/tagHelper @@ -1,13 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%", fill="#498fff"}, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%", fill="#ffa060"}, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%", fill="#ff68b6"}, + new PieChartData { xValue = "Others", yValue = 4 , text = "4%", fill="#81e2a1"}, + }; +} - - - - - - - - - - - + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/palette/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/palette/tagHelper index 073661e0e3..2af41b73fc 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/palette/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/palette/tagHelper @@ -1,9 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; + var palette = new string[] { "teal", "skyblue", "green", "red"}; +} - - - - - - - - + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/pie/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/pie/tagHelper index 2d7e0eba8f..166a014817 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/pie/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/pie/tagHelper @@ -1,10 +1,22 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; - - - - - - - - - \ No newline at end of file +} + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/piecenter/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/piecenter/tagHelper index 7e11923aeb..c0bb726dad 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/piecenter/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/piecenter/tagHelper @@ -1,26 +1,25 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37, text = "37%" }, + new PieChartData { xValue = "UC Browser", yValue = 17, text = "17%" }, + new PieChartData { xValue = "iPhone", yValue = 19, text = "19%" }, + new PieChartData { xValue = "Others", yValue = 4, text = "4%" }, + new PieChartData { xValue = "Opera", yValue = 11, text = "11%" }, + new PieChartData { xValue = "Android", yValue = 12, text = "12%" } + }; +} - - @{ - var piecenter = new - { - x = "60%", - y = "60%" - }; - - - - - - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/radius/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/radius/tagHelper index fba55fd6de..67d2f134a6 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/radius/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/radius/tagHelper @@ -1,11 +1,20 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/start-angle/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/start-angle/tagHelper index b476914e2e..4aa9979578 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/start-angle/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/start-angle/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title-cus/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title-cus/tagHelper index 72475db8d2..e99c9aa311 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title-cus/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title-cus/tagHelper @@ -1,14 +1,25 @@ +@{ + List chartData = new List + { + 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%"} + }; +} - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title/tagHelper index 5f460008cd..7b9acdc2dd 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/sub-title/tagHelper @@ -1,12 +1,23 @@ +@{ + List chartData = new List + { + 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%"} + }; +} - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title-cus/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title-cus/tagHelper index 2d7e0eba8f..b69ce58a90 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title-cus/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title-cus/tagHelper @@ -1,10 +1,21 @@ +@{ + List chartData = new List + { + 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%"} + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title/tagHelper index 97f2383fc8..2291f99f5f 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/title/tagHelper @@ -1,14 +1,25 @@ +@{ + List chartData = new List + { + 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%"} + }; +} - - - - - - - - - - - - - \ No newline at end of file + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/various-radius/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/various-radius/tagHelper index 8594e3d062..575f7866ce 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/various-radius/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pie-doughnut/various-radius/tagHelper @@ -1,12 +1,25 @@ +@{ + List chartData = new List + { + new PieRadiusChartData { xValue = "Argentina", yValue = 505370, r = "100"}, + new PieRadiusChartData { xValue = "Belgium", yValue = 551500, r = "118.7"}, + new PieRadiusChartData { xValue = "Cuba", yValue = 312685 , r = "124.6"}, + new PieRadiusChartData { xValue = "Dominican Republic", yValue = 350000 , r = "137.5"}, + new PieRadiusChartData { xValue = "Egypt", yValue = 301000 , r = "150.8"}, + new PieRadiusChartData { xValue = "Kazakhstan", yValue = 300000, r = "155.5"}, + new PieRadiusChartData { xValue = "Somalia", yValue = 357022, r = "160.6"} - - - - - - - - - - - + }; +} + + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/custom/tagHelper index a26c26f0c8..2272549dda 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/custom/tagHelper @@ -1,21 +1,33 @@ +@{ + List chartData = new List + { - - - - - - - - + new PyramidChartData { xValue = "Chrome", yValue = 37 }, + new PyramidChartData { xValue = "UC Browser", yValue = 17 }, + new PyramidChartData { xValue = "iPhone", yValue = 19 }, + new PyramidChartData { xValue = "Others", yValue = 4 }, + new PyramidChartData { xValue = "Opera", yValue = 11 }, + new PyramidChartData { xValue = "Android", yValue = 12 }, + }; +} - \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/default/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/default/tagHelper index 5930f809dd..10f186eb06 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/default/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/default/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PyramidChartData { xValue = "Chrome", yValue = 37 }, + new PyramidChartData { xValue = "UC Browser", yValue = 17 }, + new PyramidChartData { xValue = "iPhone", yValue = 19 }, + new PyramidChartData { xValue = "Others", yValue = 14 }, + new PyramidChartData { xValue = "Opera", yValue = 11 }, + new PyramidChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/explode/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/explode/tagHelper index 881f9fad19..d1945c9248 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/explode/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/explode/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PyramidChartData { xValue = "Chrome", yValue = 37 }, + new PyramidChartData { xValue = "UC Browser", yValue = 17 }, + new PyramidChartData { xValue = "iPhone", yValue = 19 }, + new PyramidChartData { xValue = "Others", yValue = 4 }, + new PyramidChartData { xValue = "Opera", yValue = 11 }, + new PyramidChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/gap/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/gap/tagHelper index e6a6cdd910..0442124a23 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/gap/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/gap/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PyramidChartData { xValue = "Chrome", yValue = 37 }, + new PyramidChartData { xValue = "UC Browser", yValue = 17 }, + new PyramidChartData { xValue = "iPhone", yValue = 19 }, + new PyramidChartData { xValue = "Others", yValue = 4 }, + new PyramidChartData { xValue = "Opera", yValue = 11 }, + new PyramidChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/mode/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/mode/tagHelper index 0df41b847e..aeaae33a10 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/mode/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/mode/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PyramidChartData { xValue = "Chrome", yValue = 37 }, + new PyramidChartData { xValue = "UC Browser", yValue = 17 }, + new PyramidChartData { xValue = "iPhone", yValue = 19 }, + new PyramidChartData { xValue = "Others", yValue = 4 }, + new PyramidChartData { xValue = "Opera", yValue = 11 }, + new PyramidChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/size/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/size/tagHelper index be23a73665..62f27cc55a 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/size/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/pyramid/size/tagHelper @@ -1,11 +1,22 @@ +@{ + List chartData = new List + { + new PyramidChartData { xValue = "Chrome", yValue = 37 }, + new PyramidChartData { xValue = "UC Browser", yValue = 17 }, + new PyramidChartData { xValue = "iPhone", yValue = 19 }, + new PyramidChartData { xValue = "Others", yValue = 4 }, + new PyramidChartData { xValue = "Opera", yValue = 11 }, + new PyramidChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/custom/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/custom/tagHelper index 9c00ee8724..bd2a27ddbf 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/custom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/custom/tagHelper @@ -1,12 +1,22 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/default/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/default/tagHelper index d2f07a7857..caeb294968 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/default/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/default/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/format/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/format/tagHelper index 4fda3f5bf9..3971620b28 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/format/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/format/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/header/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/header/tagHelper index b7dd697f3b..06d40a7f50 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/header/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/header/tagHelper @@ -1,11 +1,21 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - - \ No newline at end of file + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/individual/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/individual/tagHelper index 9a91d3a1dd..bd311bdb8f 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/individual/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/individual/tagHelper @@ -1,19 +1,30 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - - - - - - - - + + + + + + + + + - \ No newline at end of file + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/mapping/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/mapping/tagHelper index 453782006c..8f67ab7a29 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/mapping/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/mapping/tagHelper @@ -1,9 +1,29 @@ +@{ + List chartData = new List + { + new GroupingChartData { xValue = "China", yValue = 26, text = "China: 26" }, + new GroupingChartData { xValue = "Russia", yValue = 19, text = "Russia: 19" }, + new GroupingChartData { xValue = "Germany", yValue = 17, text = "Germany: 17" }, + new GroupingChartData { xValue = "Japan", yValue = 12, text = "Japan: 12" }, + new GroupingChartData { xValue = "France", yValue = 10, text = "France: 10" }, + new GroupingChartData { xValue = "South Korea", yValue = 9, text = "South Korea: 9" }, + new GroupingChartData { xValue = "Great Britain", yValue = 27, text = "Great Britain: 27" }, + new GroupingChartData { xValue = "Italy", yValue = 8, text = "Italy: 8" }, + new GroupingChartData { xValue = "Australia", yValue = 8, text = "Australia: 8" }, + new GroupingChartData { xValue = "Netherlands", yValue = 8, text = "Netherlands: 8" }, + new GroupingChartData { xValue = "Hungary", yValue = 8, text = "Hungary: 8" }, + new GroupingChartData { xValue = "Brazil", yValue = 7, text = "Brazil: 7" }, + new GroupingChartData { xValue = "Spain", yValue = 7, text = "Spain: 7" }, + new GroupingChartData { xValue = "Kenya", yValue = 6, text = "Kenya: 6" } + }; +} + - + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/tooltip-format/tagHelper b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/tooltip-format/tagHelper index ebbee2a072..4b93509fdc 100644 --- a/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/tooltip-format/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/chart/accumulation-charts/tooltip/tooltip-format/tagHelper @@ -1,15 +1,28 @@ +@{ + List chartData = new List + { + new PieChartData { xValue = "Chrome", yValue = 37 }, + new PieChartData { xValue = "UC Browser", yValue = 17 }, + new PieChartData { xValue = "iPhone", yValue = 19 }, + new PieChartData { xValue = "Others", yValue = 4 }, + new PieChartData { xValue = "Opera", yValue = 11 }, + new PieChartData { xValue = "Android", yValue = 12 }, + }; +} - - " + - "
${y}
" )) - >
- - - - - - -
- \ No newline at end of file + + + + + + + + + + + \ No newline at end of file From 57bb00a3d05ff57b8d1459f16cf75ece0dba3d52 Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Tue, 4 Jun 2024 16:35:18 +0530 Subject: [PATCH 02/10] Cleared CI error --- .../accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md index 4ce92984f5..4ffcf9c0d6 100644 --- a/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md +++ b/ej2-asp-core-mvc/accumulation-chart/EJ2_ASP.NETCORE/title-and-sub-title.md @@ -1,6 +1,6 @@ --- layout: post -title: Title And Sub Title in ##Platform_Name## Accumulation Chart Component +title: Title And Sub Title in ##Platform_Name## Accumulation Chart Component | Syncfusion description: Learn here all about Title And Sub Title in Syncfusion ##Platform_Name## Accumulation Chart component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Title And Sub Title @@ -10,7 +10,7 @@ documentation: ug -# Title +# Title in ##Platform_Name## Accumulation Chart Component Accumulation Chart can be given a title using [`title`](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2.Charts.AccumulationChart.html#Syncfusion_EJ2_Charts_AccumulationChart_Title) property, to show the information about the data plotted. From bf611d21c209597578d28a5ad8d4299304a1c67a Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Tue, 4 Jun 2024 18:12:34 +0530 Subject: [PATCH 03/10] Updated AppBar UG documentation --- ej2-asp-core-mvc/appbar/design.md | 9 -------- ej2-asp-core-mvc/appbar/position.md | 9 -------- ej2-asp-core-mvc/appbar/size-and-color.md | 21 ------------------- .../appbar/design/media/tagHelper | 3 --- .../appbar/design/separator/tagHelper | 3 --- .../appbar/design/spacer/tagHelper | 3 --- .../appbar/position/bottom/tagHelper | 3 --- .../appbar/position/sticky/tagHelper | 3 --- .../appbar/position/top/tagHelper | 3 --- .../appbar/size-and-color/dark/tagHelper | 3 --- .../appbar/size-and-color/dense/tagHelper | 3 --- .../appbar/size-and-color/inherit/tagHelper | 3 --- .../appbar/size-and-color/light/tagHelper | 3 --- .../appbar/size-and-color/primary/tagHelper | 3 --- .../appbar/size-and-color/prominent/tagHelper | 3 --- .../appbar/size-and-color/regular/tagHelper | 3 --- 16 files changed, 78 deletions(-) diff --git a/ej2-asp-core-mvc/appbar/design.md b/ej2-asp-core-mvc/appbar/design.md index b638718d5b..f2f8a2f9b9 100644 --- a/ej2-asp-core-mvc/appbar/design.md +++ b/ej2-asp-core-mvc/appbar/design.md @@ -22,9 +22,6 @@ The following example depicts the code to provide spacing between the home and p {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/design/spacer/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Spacer.cs" %} -{% include code-snippet/appbar/design/spacer/spacer.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -53,9 +50,6 @@ The following example depicts the code to provide a vertical line between a grou {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/design/separator/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Separator.cs" %} -{% include code-snippet/appbar/design/separator/separator.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -82,9 +76,6 @@ Media Query is used to adjusting the AppBar for different screen sizes. Resize t {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/design/media/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Media.cs" %} -{% include code-snippet/appbar/design/media/media.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/appbar/position.md b/ej2-asp-core-mvc/appbar/position.md index cabb4e0c71..bf431c2c71 100644 --- a/ej2-asp-core-mvc/appbar/position.md +++ b/ej2-asp-core-mvc/appbar/position.md @@ -26,9 +26,6 @@ The top AppBar is the default one in which it positions the AppBar at the top of {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/position/top/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Top.cs" %} -{% include code-snippet/appbar/position/top/top.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -55,9 +52,6 @@ This position can be set to the AppBar by setting `Bottom` to the position prope {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/position/bottom/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Bottom.cs" %} -{% include code-snippet/appbar/position/bottom/bottom.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -84,9 +78,6 @@ This position can be set to the AppBar by setting `true` to the sticky property. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/position/sticky/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Sticky.cs" %} -{% include code-snippet/appbar/position/sticky/sticky.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/appbar/size-and-color.md b/ej2-asp-core-mvc/appbar/size-and-color.md index 2352ba55e3..2beda6ca54 100644 --- a/ej2-asp-core-mvc/appbar/size-and-color.md +++ b/ej2-asp-core-mvc/appbar/size-and-color.md @@ -28,9 +28,6 @@ This mode is the default one in which the AppBar is displayed with the default h {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/regular/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Regular.cs" %} -{% include code-snippet/appbar/size-and-color/regular/regular.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -57,9 +54,6 @@ This height mode can be set to the AppBar by setting `Prominent` to the mode pro {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/prominent/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Prominent.cs" %} -{% include code-snippet/appbar/size-and-color/prominent/prominent.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -86,9 +80,6 @@ This height mode can be set to the AppBar by setting `Dense` to the mode propert {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/dense/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Dense.cs" %} -{% include code-snippet/appbar/size-and-color/dense/dense.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -124,9 +115,6 @@ This color mode is the default one in which the AppBar can be displayed with a l {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/light/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Light.cs" %} -{% include code-snippet/appbar/size-and-color/light/light.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -153,9 +141,6 @@ This color mode can be set to the AppBar by setting `Dark` to the property color {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/dark/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Dark.cs" %} -{% include code-snippet/appbar/size-and-color/dark/dark.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -182,9 +167,6 @@ This color mode can be set to the AppBar by setting `Primary` to the property co {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/primary/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Primary.cs" %} -{% include code-snippet/appbar/size-and-color/primary/primary.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -211,9 +193,6 @@ This color mode can be set to the AppBar by setting `Inherit` to the property co {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/size-and-color/inherit/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Inherit.cs" %} -{% include code-snippet/appbar/size-and-color/inherit/inherit.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/code-snippet/appbar/design/media/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/design/media/tagHelper index 3cec49b9ef..562d764c10 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/design/media/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/design/media/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; -
diff --git a/ej2-asp-core-mvc/code-snippet/appbar/design/separator/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/design/separator/tagHelper index 4e7135b4d0..d0cad1a673 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/design/separator/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/design/separator/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/design/spacer/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/design/spacer/tagHelper index 200d2295dd..5a5d981da6 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/design/spacer/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/design/spacer/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/position/bottom/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/position/bottom/tagHelper index 0dafed31b3..d1d41aef3b 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/position/bottom/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/position/bottom/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; -
diff --git a/ej2-asp-core-mvc/code-snippet/appbar/position/sticky/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/position/sticky/tagHelper index 3888f452a1..991b64213a 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/position/sticky/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/position/sticky/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/position/top/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/position/top/tagHelper index 9586319c5a..5d8c86f002 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/position/top/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/position/top/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; -
diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dark/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dark/tagHelper index ed1cbc6899..e709c96f3a 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dark/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dark/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dense/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dense/tagHelper index 363d4d0340..0d4963f2e9 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dense/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/dense/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/inherit/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/inherit/tagHelper index 46f8d4cc41..ec0a5bb0a8 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/inherit/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/inherit/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/light/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/light/tagHelper index 33b83e4d45..f8dfd80714 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/light/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/light/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/primary/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/primary/tagHelper index 69fb31bc5d..dc86704c21 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/primary/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/primary/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/prominent/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/prominent/tagHelper index e313c1aa3b..e4fb5bcddd 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/prominent/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/prominent/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - diff --git a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/regular/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/regular/tagHelper index e088cf2c40..f7de0c7169 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/regular/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/size-and-color/regular/tagHelper @@ -1,6 +1,3 @@ -@using Syncfusion.EJ2; -@using Syncfusion.EJ2.Navigations; - From 8ecf3133b065db74c3a3f6e3ccb0e864ce8f13eb Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Fri, 7 Jun 2024 09:26:48 +0530 Subject: [PATCH 04/10] Updated AutoComplete, Avatar, Breadcrumb UG documentation --- ej2-asp-core-mvc/appbar/design.md | 9 --- .../appbar/style-and-appearance.md | 12 +-- .../auto-complete/data-binding.md | 27 +++++-- ej2-asp-core-mvc/auto-complete/filtering.md | 3 - ej2-asp-core-mvc/auto-complete/templates.md | 3 - .../auto-complete/value-binding.md | 18 ++++- .../auto-complete/virtual-scroll.md | 76 +++++++++++++++++-- .../avatar/how-to/avatar-customization.md | 3 - .../appbar/design/buttons/tagHelper | 26 ++++++- .../code-snippet/appbar/design/menu/tagHelper | 54 ++++++++++++- .../appbar/design/sidebar/tagHelper | 21 ++++- .../data-binding/arrayofobjects/tagHelper | 25 +++++- .../data-binding/complexdata/tagHelper | 12 ++- .../autocomplete/object/tagHelper | 10 ++- .../virtual-scroll-group/tagHelper | 6 +- .../virtual-scroll-remote/tagHelper | 6 +- .../autocomplete/virtual-scroll/tagHelper | 6 +- .../avatar/media-formats/tagHelper | 15 +++- .../breadcrumb/separator-template/tagHelper | 13 ++-- 19 files changed, 284 insertions(+), 61 deletions(-) diff --git a/ej2-asp-core-mvc/appbar/design.md b/ej2-asp-core-mvc/appbar/design.md index f2f8a2f9b9..751b20ac80 100644 --- a/ej2-asp-core-mvc/appbar/design.md +++ b/ej2-asp-core-mvc/appbar/design.md @@ -102,9 +102,6 @@ AppBar is rendered with a Menu component in its AppBar header area. Menu compone {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/design/menu/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Menu.cs" %} -{% include code-snippet/appbar/design/menu/menu.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -131,9 +128,6 @@ The AppBar is rendered with a Button and DropDownButton component in its AppBar {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/design/buttons/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Button.cs" %} -{% include code-snippet/appbar/design/buttons/buttons.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -160,9 +154,6 @@ The AppBar is rendered with the SideBar component below the AppBar. Click on the {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/design/sidebar/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Sidebar.cs" %} -{% include code-snippet/appbar/design/sidebar/sidebar.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/appbar/style-and-appearance.md b/ej2-asp-core-mvc/appbar/style-and-appearance.md index d25a7393a0..3d3d336cb8 100644 --- a/ej2-asp-core-mvc/appbar/style-and-appearance.md +++ b/ej2-asp-core-mvc/appbar/style-and-appearance.md @@ -34,9 +34,6 @@ CssClass is used for AppBar customization based on the custom class. In the exam {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/style-and-appearance/cssclass/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="CssClass.cs" %} -{% include code-snippet/appbar/style-and-appearance/cssclass/cssclass.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -63,8 +60,13 @@ It can be used for additional inline attributes by specifying as inline attribut {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/appbar/style-and-appearance/htmlattributes/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="HtmlAttributes.cs" %} -{% include code-snippet/appbar/style-and-appearance/htmlattributes/htmlattributes.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +public class HtmlAttributes : PageModel +{ + public Dictionary htmlAttribute = new Dictionary() + { {"aria-label", "appbar" } }; + ... +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/auto-complete/data-binding.md b/ej2-asp-core-mvc/auto-complete/data-binding.md index 0909ce9eb9..3a214c0bb0 100644 --- a/ej2-asp-core-mvc/auto-complete/data-binding.md +++ b/ej2-asp-core-mvc/auto-complete/data-binding.md @@ -65,8 +65,12 @@ In the following example, `Name` column from complex data have been mapped to {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/data-binding/arrayofobjects/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Arrayofobjects.cs" %} -{% include code-snippet/autocomplete/data-binding/arrayofobjects/arrayofobjects.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +public class Countries +{ + public string Name { get; set; } + public string Code { get; set; } +} {% endhighlight %} {% endtabs %} @@ -96,8 +100,20 @@ In the following example, `Country.CountryId` column from complex data have be {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/data-binding/complexdata/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Complex.cs" %} -{% include code-snippet/autocomplete/data-binding/complexdata/Complex.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +public class Code +{ + public string Id { get; set; } +} +public class Country +{ + public string CountryId { get; set; } +} +public class Complex +{ + public Country Country { get; set; } + public Code Code { get; set; } +} {% endhighlight %} {% endtabs %} @@ -127,9 +143,6 @@ The following sample displays the first 6 contacts from the `Customers` table of {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/data-binding/remotedata/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Remotedata.cs" %} -{% include code-snippet/autocomplete/data-binding/remotedata/remotedata.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/auto-complete/filtering.md b/ej2-asp-core-mvc/auto-complete/filtering.md index 75f605f231..3a8a42429c 100644 --- a/ej2-asp-core-mvc/auto-complete/filtering.md +++ b/ej2-asp-core-mvc/auto-complete/filtering.md @@ -139,9 +139,6 @@ An AutoComplete supports diacritics filtering which will ignore the [diacritics] {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/filtering/diacritics/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Diacritics.cs" %} -{% include code-snippet/autocomplete/filtering/diacritics/diacritics.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/auto-complete/templates.md b/ej2-asp-core-mvc/auto-complete/templates.md index bdf77a6044..4ce1d83553 100644 --- a/ej2-asp-core-mvc/auto-complete/templates.md +++ b/ej2-asp-core-mvc/auto-complete/templates.md @@ -157,9 +157,6 @@ There is also an option to custom design the suggestion list content when the da {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/templates/actionfailuretemplate/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Actionfailuretemplate.cs" %} -{% include code-snippet/autocomplete/templates/actionfailuretemplate/actionfailuretemplate.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/auto-complete/value-binding.md b/ej2-asp-core-mvc/auto-complete/value-binding.md index 8af983f51f..cc2010d2e6 100644 --- a/ej2-asp-core-mvc/auto-complete/value-binding.md +++ b/ej2-asp-core-mvc/auto-complete/value-binding.md @@ -59,8 +59,22 @@ The following sample shows the example for preselect values for object data type {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/object/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Arrayofobjects.cs" %} -{% include code-snippet/autocomplete/object/object.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class Record +{ + public string ID { get; set; } + public string Text { get; set; } + public List RecordList { set; get; } + public List RecordModelList() + { + return Enumerable.Range(1, 150).Select(i => new Record() + { + ID = i.ToString(), + Text = "Item " + i, + }).ToList(); + } +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/auto-complete/virtual-scroll.md b/ej2-asp-core-mvc/auto-complete/virtual-scroll.md index 93fca12a95..fe21c19138 100644 --- a/ej2-asp-core-mvc/auto-complete/virtual-scroll.md +++ b/ej2-asp-core-mvc/auto-complete/virtual-scroll.md @@ -31,8 +31,22 @@ In the following example, `text` column from complex data have been mapped to th {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/virtual-scroll/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="virtualscroll.cs" %} -{% include code-snippet/autocomplete/virtual-scroll/virtualscroll.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class RecordData +{ + public string ID { get; set; } + public string Text { get; set; } + public List RecordList { set; get; } + public List RecordModelList() + { + return Enumerable.Range(1, 150).Select(i => new RecordData() + { + ID = i.ToString(), + Text = "Item " + i, + }).ToList(); + } +} {% endhighlight %} {% endtabs %} @@ -60,8 +74,22 @@ The following sample displays the OrderId from the `Orders` Data Service. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/virtual-scroll-remote/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="virtualscroll.cs" %} -{% include code-snippet/autocomplete/virtual-scroll-remote/virtualscroll.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class BindingRecord +{ + public string ID { get; set; } + public string Text { get; set; } + public List RecordList { set; get; } + public List RecordModelList() + { + return Enumerable.Range(1, 150).Select(i => new BindingRecord() + { + ID = i.ToString(), + Text = "Item " + i, + }).ToList(); + } +} {% endhighlight %} {% endtabs %} @@ -89,8 +117,44 @@ The following sample shows the example for Grouping with Virtualization. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/autocomplete/virtual-scroll-group/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="virtualscroll.cs" %} -{% include code-snippet/autocomplete/virtual-scroll-group/virtualscroll.cs %} +{% highlight c# tabtitle="CSHTML.cs" %} +... +public class GroupingRecord +{ + public string ID { get; set; } + public string Text { get; set; } + public string Group { get; set; } + public List RecordList { set; get; } + public List RecordModelList() + { + Random random = new Random(); + return Enumerable.Range(1, 150).Select(i => new GroupingRecord() + { + ID = i.ToString(), + Text = "Item " + i, + Group = GetRandomGroup(random), + + }).ToList(); + } + public string GetRandomGroup(Random random) + { + // Generate a random number between 1 and 4 to determine the group + int randomGroup = random.Next(1, 5); + switch (randomGroup) + { + case 1: + return "Group A"; + case 2: + return "Group B"; + case 3: + return "Group C"; + case 4: + return "Group D"; + default: + return string.Empty; + } + } +} {% endhighlight %} {% endtabs %} diff --git a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md index 2dcd0c1bc1..dce6d90d66 100644 --- a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md +++ b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md @@ -76,9 +76,6 @@ Avatars can be used with a wide variety of media formats like SVG, font-icons, i {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/avatar/media-formats/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="HomeController.cs" %} -{% include code-snippet/avatar/media-formats/HomeController.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/code-snippet/appbar/design/buttons/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/design/buttons/tagHelper index 201f578157..a2fd5fb692 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/design/buttons/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/design/buttons/tagHelper @@ -1,10 +1,34 @@ @using Syncfusion.EJ2; @using Syncfusion.EJ2.Navigations; +@{ + List productDropDownButtonItems = new List(); + productDropDownButtonItems.Add(new + { + text = "Developer", + }); + productDropDownButtonItems.Add(new + { + text = "Analytics", + }); + productDropDownButtonItems.Add(new + { + text = "Reporting", + }); + productDropDownButtonItems.Add(new + { + text = "E-Signature", + }); + productDropDownButtonItems.Add(new + { + text = "Help-Desk", + }); +} + - +
diff --git a/ej2-asp-core-mvc/code-snippet/appbar/design/menu/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/design/menu/tagHelper index 3cf307d8de..ac4d13cd31 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/design/menu/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/design/menu/tagHelper @@ -1,13 +1,59 @@ @using Syncfusion.EJ2; @using Syncfusion.EJ2.Navigations; +@{ + List companyMenuItems = new List() + { + new MenuItem + { + Text = "Company", + Items = new List() + { + new MenuItem { Text = "About Us" }, + new MenuItem { Text = "Customers" }, + new MenuItem { Text = "Blog" }, + new MenuItem { Text = "Careers" } + } + } + }; + + List productMenuItems = new List() + { + new MenuItem + { + Text = "Products", + Items = new List() + { + new MenuItem { Text = "Developer" }, + new MenuItem { Text = "Analytics" }, + new MenuItem { Text = "Reporting" }, + new MenuItem { Text = "Help Desk" } + } + } + }; + + List aboutMenuItems = new List(){ + new MenuItem + { + Text = "About Us" + } + }; + + List carrerMenuItems = new List(){ + new MenuItem + { + Text = "Carrers" + } + }; +} + - - - - + + + +
diff --git a/ej2-asp-core-mvc/code-snippet/appbar/design/sidebar/tagHelper b/ej2-asp-core-mvc/code-snippet/appbar/design/sidebar/tagHelper index c27ff469f0..da0edbe1d3 100644 --- a/ej2-asp-core-mvc/code-snippet/appbar/design/sidebar/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/appbar/design/sidebar/tagHelper @@ -1,6 +1,23 @@ @using Syncfusion.EJ2; @using Syncfusion.EJ2.Navigations; +@{ + Dictionary htmlAttribute = new Dictionary() + { { "class", "sidebar-treeview" } }; + + List treedata = new List(); + treedata.Add(new TreeDatas { nodeId = "01", nodeText = "Installation" }); + treedata.Add(new TreeDatas { nodeId = "02", nodeText = "Deployment" }); + treedata.Add(new TreeDatas { nodeId = "03", nodeText = "Quick Start" }); + treedata.Add(new TreeDatas { nodeId = "04", nodeText = "Components", hasChild = true }); + treedata.Add(new TreeDatas { nodeId = "04-01", nodeText = "Calendar", pid = "04" }); + treedata.Add(new TreeDatas { nodeId = "04-02", nodeText = "DatePicker", pid = "04" }); + treedata.Add(new TreeDatas { nodeId = "04-03", nodeText = "DateTimePicker", pid = "04" }); + treedata.Add(new TreeDatas { nodeId = "04-04", nodeText = "DateRangePicker", pid = "04" }); + treedata.Add(new TreeDatas { nodeId = "04-05", nodeText = "TimePicker", pid = "04" }); + treedata.Add(new TreeDatas { nodeId = "04-06", nodeText = "SideBar", pid = "04" }); +} +
@@ -12,7 +29,7 @@
- + diff --git a/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/arrayofobjects/tagHelper b/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/arrayofobjects/tagHelper index bc5da8e24c..ea14774589 100644 --- a/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/arrayofobjects/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/arrayofobjects/tagHelper @@ -1,6 +1,29 @@ +@{ + List country = new List(); + country.Add(new Countries { Name = "Australia", Code = "AU" }); + country.Add(new Countries { Name = "Bermuda", Code = "BM" }); + country.Add(new Countries { Name = "Canada", Code = "CA" }); + country.Add(new Countries { Name = "Cameroon", Code = "CM" }); + country.Add(new Countries { Name = "Denmark", Code = "DK" }); + country.Add(new Countries { Name = "France", Code = "FR" }); + country.Add(new Countries { Name = "Finland", Code = "FI" }); + country.Add(new Countries { Name = "Germany", Code = "DE" }); + country.Add(new Countries { Name = "Greenland", Code = "GL" }); + country.Add(new Countries { Name = "Hong Kong", Code = "HK" }); + country.Add(new Countries { Name = "India", Code = "IN" }); + country.Add(new Countries { Name = "Italy", Code = "IT" }); + country.Add(new Countries { Name = "Japan", Code = "JP" }); + country.Add(new Countries { Name = "Mexico", Code = "MX" }); + country.Add(new Countries { Name = "Norway", Code = "NO" }); + country.Add(new Countries { Name = "Poland", Code = "PL" }); + country.Add(new Countries { Name = "Switzerland", Code = "CH" }); + country.Add(new Countries { Name = "United Kingdom", Code = "GB" }); + country.Add(new Countries { Name = "United States", Code = "US" }); +} +
- +
diff --git a/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/complexdata/tagHelper b/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/complexdata/tagHelper index b4558bb868..d440ed4a10 100644 --- a/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/complexdata/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/autocomplete/data-binding/complexdata/tagHelper @@ -1,6 +1,16 @@ +@{ + List data = new List(); + data.Add(new Complex() { Country = new Country() { CountryId = "Australia" }, Code = new Code() { Id = "AU" } }); + data.Add(new Complex() { Country = new Country() { CountryId = "Bermuda" }, Code = new Code() { Id = "BM" } }); + data.Add(new Complex() { Country = new Country() { CountryId = "Canada" }, Code = new Code() { Id = "CA" } }); + data.Add(new Complex() { Country = new Country() { CountryId = "Cameroon" }, Code = new Code() { Id = "CM" } }); + data.Add(new Complex() { Country = new Country() { CountryId = "Denmark" }, Code = new Code() { Id = "DK" } }); + data.Add(new Complex() { Country = new Country() { CountryId = "France" }, Code = new Code() { Id = "FR" } }); +} +
- +
diff --git a/ej2-asp-core-mvc/code-snippet/autocomplete/object/tagHelper b/ej2-asp-core-mvc/code-snippet/autocomplete/object/tagHelper index a34c51fa45..7d8d2e2b00 100644 --- a/ej2-asp-core-mvc/code-snippet/autocomplete/object/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/autocomplete/object/tagHelper @@ -1,6 +1,14 @@ +@page +@model AutoCompleteBindingSamples.Pages.ObjectDataType + +@{ + var objectType = new Record().RecordModelList(); + var value = new { ID = "id5", Text = "Item 5" }; +} +
- +
diff --git a/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-group/tagHelper b/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-group/tagHelper index 35d515990f..f3bf7e04ff 100644 --- a/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-group/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-group/tagHelper @@ -1,6 +1,10 @@ +@{ + var data = new GroupingRecord().RecordModelList(); +} +
- +
diff --git a/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-remote/tagHelper b/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-remote/tagHelper index e21121800e..353dbaf6b2 100644 --- a/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-remote/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll-remote/tagHelper @@ -1,6 +1,10 @@ +@{ + var data = new BindingRecord().RecordModelList(); +} +
- + diff --git a/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll/tagHelper b/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll/tagHelper index 958786c62d..5d6eb4d757 100644 --- a/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/autocomplete/virtual-scroll/tagHelper @@ -1,6 +1,10 @@ +@{ + var data = new RecordData().RecordModelList(); +} +
- +
diff --git a/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper b/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper index 581e772b07..39fdd4b39c 100644 --- a/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/avatar/media-formats/tagHelper @@ -1,3 +1,10 @@ +@page +@model AvatarUGSample.Pages.VariousAvatarMediaModel + +@{ + +} +
@@ -87,7 +94,7 @@ + \ No newline at end of file From 307406fe8fc64d968473bdf8e3ca8cec422435eb Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Tue, 18 Jun 2024 17:23:18 +0530 Subject: [PATCH 05/10] Cleared CI error --- ej2-asp-core-mvc/avatar/how-to/avatar-customization.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md index dce6d90d66..87a8c6fd3a 100644 --- a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md +++ b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md @@ -1,6 +1,6 @@ --- layout: post -title: Avatar Customization in ##Platform_Name## Avatar Component +title: Avatar Customization in ##Platform_Name## Avatar Component | Syncfusion description: Learn here all about Avatar Customization in Syncfusion ##Platform_Name## Avatar component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Avatar Customization From bcd8872e504029b58a3f26f6228a31a20c645901 Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Tue, 18 Jun 2024 18:02:18 +0530 Subject: [PATCH 06/10] Cleared spell error --- ej2-asp-core-mvc/avatar/how-to/avatar-customization.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md index 87a8c6fd3a..05b7121f83 100644 --- a/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md +++ b/ej2-asp-core-mvc/avatar/how-to/avatar-customization.md @@ -10,9 +10,9 @@ documentation: ug # Avatar Customization -## Colour customization +## Color customization -The avatar comes with default background colour (grey). This can be easily customized to desired colour by adding custom class or directly selecting the avatar class from the CSS. +The avatar comes with default background color (Grey). This can be easily customized to desired color by adding custom class or directly selecting the avatar class from the CSS. {% if page.publishingplatform == "aspnet-core" %} From 5ac479c95d3a7154dd290044066fb73b1e0ec95d Mon Sep 17 00:00:00 2001 From: Backiaraj Date: Wed, 19 Jun 2024 17:44:38 +0530 Subject: [PATCH 07/10] Update the UG documents to razor template --- ej2-asp-core-mvc/calendar/accessibility.md | 1 - .../EJ2_ASP.NETCORE/populating-items.md | 2 +- .../EJ2_ASP.NETCORE/print-and-export.md | 12 --- .../circular-gauge/gauge-animation.md | 3 - .../circular-gauge/gauge-annotations.md | 4 +- .../circular-gauge/gauge-appearance.md | 8 +- .../badge/custom-position/tagHelper | 6 +- .../breadcrumb/icon/image/tagHelper | 2 +- .../breadcrumb/icon/svg/tagHelper | 2 +- .../circulargauge/gauge-animation/tagHelper | 4 +- .../EJ2_ASP.NETCORE/getting-started.md | 3 - ej2-asp-core-mvc/combo-box/filtering.md | 2 +- ej2-asp-core-mvc/combo-box/grouping.md | 2 +- ej2-asp-core-mvc/combo-box/how-to/autofill.md | 2 +- .../combo-box/how-to/cascading.md | 2 +- .../combo-box/how-to/icons-support.md | 2 +- ej2-asp-core-mvc/combo-box/virtual-scroll.md | 90 +++++++++++++++++++ 17 files changed, 108 insertions(+), 39 deletions(-) diff --git a/ej2-asp-core-mvc/calendar/accessibility.md b/ej2-asp-core-mvc/calendar/accessibility.md index 7e4f0bebf9..d57930ea4d 100644 --- a/ej2-asp-core-mvc/calendar/accessibility.md +++ b/ej2-asp-core-mvc/calendar/accessibility.md @@ -19,7 +19,6 @@ The accessibility compliance for the Calendar component is outlined below. | Accessibility Criteria | Compatibility | | -- | -- | - | [WCAG 2.2 Support](../common/accessibility#accessibility-standards) | Intermediate | | [Section 508 Support](../common/accessibility#accessibility-standards) | Intermediate | | [Screen Reader Support](../common/accessibility#screen-reader-support) | Yes | diff --git a/ej2-asp-core-mvc/carousel/EJ2_ASP.NETCORE/populating-items.md b/ej2-asp-core-mvc/carousel/EJ2_ASP.NETCORE/populating-items.md index 689f4cfb9e..bb0961c6ad 100644 --- a/ej2-asp-core-mvc/carousel/EJ2_ASP.NETCORE/populating-items.md +++ b/ej2-asp-core-mvc/carousel/EJ2_ASP.NETCORE/populating-items.md @@ -33,7 +33,7 @@ When rendering the Carousel component using data binding, you can assign a commo {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/carousel/populating-items/item-datasource/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Data.cs" %} +{% highlight c# tabtitle="CSHTML.cs" %} public class CarouselDataBinding { public int Id { get; set; } diff --git a/ej2-asp-core-mvc/circular-gauge/EJ2_ASP.NETCORE/print-and-export.md b/ej2-asp-core-mvc/circular-gauge/EJ2_ASP.NETCORE/print-and-export.md index 8bb93352ca..b675cb67f9 100644 --- a/ej2-asp-core-mvc/circular-gauge/EJ2_ASP.NETCORE/print-and-export.md +++ b/ej2-asp-core-mvc/circular-gauge/EJ2_ASP.NETCORE/print-and-export.md @@ -20,9 +20,6 @@ To use the print functionality, set the [`allowPrint`](https://ej2.syncfusion.co {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/print-and-export/print/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Print.cs" %} -{% include code-snippet/circulargauge/print-and-export/print/print.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -55,9 +52,6 @@ To use the image export functionality, set the [`allowImageExport`](https://ej2. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/print-and-export/export/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Export.cs" %} -{% include code-snippet/circulargauge/print-and-export/export/export.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -82,9 +76,6 @@ The image file is got as base64 string for the JPEG and PNG formats. The circula {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/print-and-export/base64/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Export.cs" %} -{% include code-snippet/circulargauge/print-and-export/base64/export.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -111,9 +102,6 @@ To use the PDF export functionality, the [`allowPdfExport`](https://ej2.syncfusi {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/print-and-export/exportPdf/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Export.cs" %} -{% include code-snippet/circulargauge/print-and-export/exportPdf/export.cs %} -{% endhighlight %} {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/circular-gauge/gauge-animation.md b/ej2-asp-core-mvc/circular-gauge/gauge-animation.md index c1a0d4e8fc..40b1f32277 100644 --- a/ej2-asp-core-mvc/circular-gauge/gauge-animation.md +++ b/ej2-asp-core-mvc/circular-gauge/gauge-animation.md @@ -26,9 +26,6 @@ The animation of the Circular Gauge is demonstrated in the following example. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/gauge-animation/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Animation.cs" %} -{% include code-snippet/circulargauge/gauge-animation/gauge-animation.cs %} -{% endhighlight %} {% endtabs %} ![Circular Gauge with Animation](../circular-gauge/images/animation.gif) diff --git a/ej2-asp-core-mvc/circular-gauge/gauge-annotations.md b/ej2-asp-core-mvc/circular-gauge/gauge-annotations.md index b10991d1b7..b87c929fc7 100644 --- a/ej2-asp-core-mvc/circular-gauge/gauge-annotations.md +++ b/ej2-asp-core-mvc/circular-gauge/gauge-annotations.md @@ -76,9 +76,9 @@ As the annotation allows to place any custom element, it can initialize a gauge {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/gauge-annotations/subgauge/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Subgauge.cs" %} + {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/circular-gauge/gauge-appearance.md b/ej2-asp-core-mvc/circular-gauge/gauge-appearance.md index c184a73045..b3aab76728 100644 --- a/ej2-asp-core-mvc/circular-gauge/gauge-appearance.md +++ b/ej2-asp-core-mvc/circular-gauge/gauge-appearance.md @@ -106,9 +106,9 @@ Using [background](https://help.syncfusion.com/cr/aspnetcore-js2/Syncfusion.EJ2. {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/gauge-appearance/area-customization/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Area-customization.cs" %} + {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} @@ -135,9 +135,9 @@ You can set margin for gauge from its container through [margin](https://help.sy {% highlight cshtml tabtitle="CSHTML" %} {% include code-snippet/circulargauge/gauge-appearance/margin/tagHelper %} {% endhighlight %} -{% highlight c# tabtitle="Margin.cs" %} + {% endtabs %} {% elsif page.publishingplatform == "aspnet-mvc" %} diff --git a/ej2-asp-core-mvc/code-snippet/badge/custom-position/tagHelper b/ej2-asp-core-mvc/code-snippet/badge/custom-position/tagHelper index 0f4bffe30e..ef16374a16 100644 --- a/ej2-asp-core-mvc/code-snippet/badge/custom-position/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/badge/custom-position/tagHelper @@ -68,11 +68,11 @@ /* SVG Icons */ .facebook { - background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='#3b5998' d='M1.82 0h28.36c.908 0 1.645.819 1.645 1.829v28.342c0 1.011-.737 1.829-1.645 1.829h-8.188V18.852h3.934v-4.271h-3.934V13.15c0-1.04.828-1.883 1.853-1.883h2.081V6.998h-4.505c-2.737 0-4.955 2.251-4.955 5.029v2.554h-3.55v4.271h3.55V32H1.82c-.908 0-1.645-.818-1.645-1.829V1.829C.175.819.912 0 1.82 0z'/%3E%3C/svg%3E") no-repeat 100% 100%; + background: transparent url("data:image/svg+xml;charset=UTF-8,%3csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cdefs%3e%3cstyle%3e.cls-1%7bfill:%233c5a99;%7d.cls-2%7bfill:%23fff;%7d%3c/style%3e%3c/defs%3e%3ctitle%3eIcon%3c/title%3e%3crect class='cls-1' x='1' y='1' width='28' height='28' rx='5.75' ry='5.75'/%3e%3cpath class='cls-2' d='M22.53,8.7h2.58V4.64H21.24a5.25,5.25,0,0,0-4,2s-1.06,1-1.08,3.92h0v3H12.36v4.31h3.82V29h4.41V17.86h3.8l.53-4.31H20.59v-3h0A1.78,1.78,0,0,1,22.53,8.7Z'/%3e%3c/svg%3e") no-repeat 100% 100%; } .skype { - background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='#00aff0' d='M16.067 5.579c-1.68 0-3.166.234-4.416.696-1.265.468-2.247 1.15-2.92 2.028a4.893 4.893 0 0 0-1.022 3.046c0 1.192.328 2.207.974 3.016.636.796 1.505 1.433 2.585 1.891 1.056.449 2.383.847 3.944 1.181 1.148.24 2.077.471 2.76.684.657.204 1.198.502 1.606.885.392.367.582.833.582 1.428 0 .752-.364 1.366-1.114 1.878-.767.523-1.787.789-3.031.789-.905 0-1.64-.131-2.187-.389-.541-.257-.965-.585-1.261-.976-.308-.406-.599-.922-.864-1.533-.24-.56-.537-.995-.883-1.288-.363-.307-.809-.462-1.326-.462-.63 0-1.157.196-1.57.584a1.89 1.89 0 0 0-.628 1.421c0 .882.325 1.797.964 2.719a7.062 7.062 0 0 0 2.478 2.199c1.413.75 3.226 1.131 5.388 1.131 1.8 0 3.383-.278 4.702-.827 1.333-.554 2.362-1.335 3.058-2.32a5.711 5.711 0 0 0 1.053-3.358c0-1.037-.206-1.928-.612-2.65a5.125 5.125 0 0 0-1.697-1.792c-.706-.46-1.572-.856-2.574-1.176-.99-.317-2.11-.61-3.327-.871a55.674 55.674 0 0 1-2.082-.51 6.642 6.642 0 0 1-1.211-.47c-.382-.191-.683-.42-.897-.681a1.328 1.328 0 0 1-.301-.876c0-.559.306-1.031.933-1.443.652-.427 1.529-.643 2.608-.643 1.16 0 2.006.195 2.512.579.52.397.976.959 1.35 1.672.325.558.617.946.898 1.195.302.268.74.404 1.297.404.613 0 1.133-.217 1.545-.646.41-.425.617-.914.617-1.452 0-.559-.158-1.136-.47-1.717-.31-.574-.801-1.127-1.463-1.644-.657-.514-1.493-.931-2.485-1.24-.987-.306-2.168-.462-3.513-.462zM8.95 0c1.708 0 3.298.492 4.643 1.339.836-.144 1.696-.22 2.575-.22 8.31 0 15.049 6.738 15.049 15.049 0 1.109-.121 2.189-.35 3.229a8.728 8.728 0 0 1-11.945 11.567c-.892.166-1.814.253-2.754.253-8.311 0-15.05-6.738-15.05-15.049 0-1.037.105-2.049.304-3.026A8.727 8.727 0 0 1 8.95 0z'/%3E%3C/svg%3E") no-repeat 100% 100%; + background: transparent url("data:image/svg+xml;charset=UTF-8,%3csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cdefs%3e%3cstyle%3e.cls-1%7bfill:%2331c4ed;%7d.cls-2%7bfill:%23fff;fill-rule:evenodd;%7d%3c/style%3e%3c/defs%3e%3ctitle%3eIcon%3c/title%3e%3crect class='cls-1' x='1' y='1' width='28' height='28' rx='5.75' ry='5.75'/%3e%3cpath class='cls-2' d='M19.5,19.14a4,4,0,0,1-1.75,1.31,7.22,7.22,0,0,1-2.68.46A6.6,6.6,0,0,1,12,20.27,4,4,0,0,1,10.58,19,2.71,2.71,0,0,1,10,17.51a1.05,1.05,0,0,1,.36-.8,1.28,1.28,0,0,1,.9-.33,1.14,1.14,0,0,1,.75.26,1.89,1.89,0,0,1,.51.73,4.54,4.54,0,0,0,.49.86,2,2,0,0,0,.72.55A3.08,3.08,0,0,0,15,19a3,3,0,0,0,1.73-.45,1.23,1.23,0,0,0,.63-1.06,1,1,0,0,0-.33-.8,2.3,2.3,0,0,0-.92-.49c-.39-.12-.92-.26-1.57-.39a12.2,12.2,0,0,1-2.25-.67,3.64,3.64,0,0,1-1.48-1.06,2.47,2.47,0,0,1-.29-.47,2.84,2.84,0,0,1-.26-1.22,2.71,2.71,0,0,1,.58-1.72,3.71,3.71,0,0,1,1.67-1.14A7.37,7.37,0,0,1,15,9.14a7,7,0,0,1,2,.26,4.38,4.38,0,0,1,1.42.7,3.1,3.1,0,0,1,.84.92,2.11,2.11,0,0,1,.26,1,1.13,1.13,0,0,1-.35.82,1.18,1.18,0,0,1-.88.36,1.09,1.09,0,0,1-.74-.23,2.68,2.68,0,0,1-.51-.67,3,3,0,0,0-.77-.94A2.42,2.42,0,0,0,14.87,11a2.76,2.76,0,0,0-1.49.36,1,1,0,0,0-.53.81.78.78,0,0,0,.17.5,1.63,1.63,0,0,0,.52.38,4.48,4.48,0,0,0,.69.27l.15,0,1,.24c.69.15,1.33.32,1.89.49a6.29,6.29,0,0,1,1.47.67,2.81,2.81,0,0,1,1,1,3,3,0,0,1,.35,1.49,3.15,3.15,0,0,1-.6,1.89Zm4-2.23a7.73,7.73,0,0,0,.2-1.81c0-.22,0-.43,0-.64a8.53,8.53,0,0,0-8.56-7.83,8.72,8.72,0,0,0-1.46.12A5.08,5.08,0,0,0,11,6a5,5,0,0,0-5,4.91,4.83,4.83,0,0,0,.68,2.48,7.33,7.33,0,0,0-.13.94,6.51,6.51,0,0,0,0,.77,8.52,8.52,0,0,0,8.58,8.46,8.9,8.9,0,0,0,1.57-.14A5.09,5.09,0,0,0,19,24a4.94,4.94,0,0,0,5-4.91,4.86,4.86,0,0,0-.52-2.18Z'/%3e%3c/svg%3e") no-repeat 100% 100%; } .twitter { @@ -80,7 +80,7 @@ } .whatsapp { - background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='#25D366' d='M11.863 8.305c-.444-.011-.813.335-1.18.677-.12.11-.235.228-.344.35-.489.552-.798 1.186-.703 1.935.103.807.187 1.63.423 2.402.65 2.13 1.962 3.843 3.605 5.309 1.51 1.346 3.162 2.47 5.151 2.977a9.847 9.847 0 0 0 1.966.268c.984.044 2.378-.942 2.728-1.86a.37.37 0 0 0 .022-.158c-.028-.435-.052-.87-.097-1.303-.009-.088-.083-.212-.158-.242a276.61 276.61 0 0 0-3.316-1.281c-.277-.105-.526-.057-.749.159-.337.325-.707.617-1.029.956-.207.217-.384.257-.617.078-.619-.48-1.26-.933-1.853-1.443-.93-.8-1.7-1.744-2.38-2.763-.19-.284-.199-.483.077-.724.294-.256.517-.592.804-.856.366-.336.37-.69.192-1.12a85.3 85.3 0 0 1-.964-2.46c-.3-.792-.294-.795-1.258-.833a.894.894 0 0 0-.32-.068zm4.016-5.566c5.806-.062 10.95 3.973 12.154 9.89 1.123 5.523-1.825 11.269-6.975 13.536-3.56 1.568-7.1 1.477-10.606-.216-.13-.063-.337-.05-.479.004-1.39.532-2.777 1.08-4.164 1.625-.069.027-.14.049-.266.093.412-1.455.8-2.847 1.205-4.235.064-.216.03-.357-.112-.526-2.056-2.454-3.018-5.292-2.889-8.483.226-5.636 4.415-10.442 9.968-11.475.727-.136 1.45-.205 2.164-.213zm.203-2.086a14.416 14.416 0 0 0-4.595.74c-5.636 1.87-9.435 6.872-9.764 12.803-.189 3.43.773 6.54 2.82 9.307.133.182.178.333.12.563-.576 2.266-1.137 4.535-1.718 6.866.178-.065.31-.111.438-.162 2.147-.838 4.297-1.67 6.44-2.521.324-.128.598-.141.925-.005 1.091.452 2.228.737 3.4.883 3.548.44 6.831-.306 9.797-2.291 5.426-3.631 7.685-10.342 5.562-16.54A14.243 14.243 0 0 0 16.082.654zM16.032 0c.494.004.992.03 1.492.078 6.504.613 12.026 5.686 13.158 12.108.805 4.565-.231 8.687-3.16 12.275-2.333 2.857-5.366 4.599-9.012 5.227a14.618 14.618 0 0 1-7.895-.793.818.818 0 0 0-.649 0c-2.55 1.005-5.105 1.999-7.659 2.996-.08.031-.162.058-.305.108l.783-3.13c.393-1.573.791-3.144 1.172-4.72a.617.617 0 0 0-.089-.442c-1.92-2.71-2.94-5.725-2.8-9.04.26-6.171 3.233-10.635 8.781-13.33C11.81.386 13.89-.017 16.032 0z'/%3E%3C/svg%3E") no-repeat 100% 100%; + background: transparent url("data:image/svg+xml;charset=UTF-8,%3csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cdefs%3e%3cstyle%3e.cls-1%7bfill:%2346bf56;%7d.cls-2%7bfill:%23fff;%7d%3c/style%3e%3c/defs%3e%3ctitle%3eIcon%3c/title%3e%3crect class='cls-1' x='1' y='1' width='28' height='28' rx='5.75' ry='5.75'/%3e%3cpath class='cls-2' d='M15.19,4.68A10.21,10.21,0,0,0,6.4,20.12l-1.29,5.2,5.12-1.47a10.23,10.23,0,1,0,5-19.17Zm.11,18.75a8.41,8.41,0,0,1-4.81-1.5l-2.91.85.74-3a8.49,8.49,0,1,1,7,3.66Z'/%3e%3cpath class='cls-2' d='M12.6,14.09l.36-.41c.2-.23.5-.45.51-.78a2.3,2.3,0,0,0-.21-.93c-.07-.19-.15-.37-.22-.56a4,4,0,0,0-.48-1,.94.94,0,0,0-1-.16,2.52,2.52,0,0,0-1.39,2.9,9.09,9.09,0,0,0,7.22,6.56s2.16.31,2.74-1a2.39,2.39,0,0,0,.19-1,.81.81,0,0,0-.48-.63,10.88,10.88,0,0,0-1-.53,1.51,1.51,0,0,0-1-.29,1.64,1.64,0,0,0-.63.51c-.23.25-.47.49-.71.74C16.46,17.49,13.41,16.37,12.6,14.09Z'/%3e%3c/svg%3e") no-repeat 100% 100%; } .firefox { diff --git a/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/image/tagHelper b/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/image/tagHelper index ffcd156dd2..b13ad5f5fa 100644 --- a/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/image/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/image/tagHelper @@ -16,7 +16,7 @@ } .e-svg-home { - background-image: url(home.svg); + background-image: url(@Url.Content("~/css/home.svg")); height: 30px; width: 30px; } diff --git a/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/svg/tagHelper b/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/svg/tagHelper index 28d4143f0e..b8ef0b5ee1 100644 --- a/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/svg/tagHelper +++ b/ej2-asp-core-mvc/code-snippet/breadcrumb/icon/svg/tagHelper @@ -9,7 +9,7 @@