From bbede90dc6fa35d601bd98105b1b5924b694dc67 Mon Sep 17 00:00:00 2001 From: gowthamanthavasiyappan <90315799+gowthamanthavasiyappan@users.noreply.github.com> Date: Tue, 11 Jan 2022 18:04:31 +0530 Subject: [PATCH 1/3] SEO-1870_Site_Audit_Issues_ASPNETMVC --- aspnetmvc/Button/Icons.md | 198 +++++++++--------- aspnetmvc/Chart/Chart-Types.md | 196 +++++++++-------- aspnetmvc/Gantt/Serial-Number.md | 8 +- aspnetmvc/Grid/Columns.md | 46 ++-- aspnetmvc/Grid/Editing.md | 66 +++--- aspnetmvc/Grid/Exporting.md | 8 +- aspnetmvc/Grid/Responsive.md | 22 +- aspnetmvc/ListBox/Multiple-Selection.md | 14 +- aspnetmvc/PdfViewer/Text-Markup-Annotation.md | 2 +- 9 files changed, 277 insertions(+), 283 deletions(-) diff --git a/aspnetmvc/Button/Icons.md b/aspnetmvc/Button/Icons.md index ad654a6fc..ee950f05e 100644 --- a/aspnetmvc/Button/Icons.md +++ b/aspnetmvc/Button/Icons.md @@ -1,13 +1,13 @@ --- layout: post title: Icons | Button | ASP.NET MVC | Syncfusion -description: icons +description: Learn here all about Icons support in Syncfusion Essential Studio ASP.NET MVC Button Control, its elements, and more. platform: ejmvc control: Button documentation: ug --- -# Icons +# Icons in ASP.NET MVC Button The Essential Studio for ASP.NET MVC provide icons library that contains the number of in-built icons that can be applied for CSS class names to elements and refer “ej.widgets.all.core.min.css” file. Use the following syntax to apply class names. @@ -45,7 +45,7 @@ Also in the button sample, you can use the icon class names as follows, Execute the above code to render the following output. -![](Icons_images/Icons_img1.png) +![ASPNETMVC_Button_IconsImage](Icons_images/Icons_img1.png) ## List of Icons @@ -58,550 +58,550 @@ _List of icons_ e-unpin -{{'![](Icons_images/Icons_img2.png)'| markdownify }} +{{'![ASPNETMVC_Button_unpinIconsImage](Icons_images/Icons_img2.png)'| markdownify }} e-pin -{{'![](Icons_images/Icons_img3.png)'| markdownify }} +{{'![ASPNETMVC_Button_pin_IconsImage](Icons_images/Icons_img3.png)'| markdownify }} e-upload -{{'![](Icons_images/Icons_img4.png)'| markdownify }} +{{'![ASPNETMVC_Button_upload_IconsImage](Icons_images/Icons_img4.png)'| markdownify }} e-reload -{{'![](Icons_images/Icons_img5.png)'| markdownify }} +{{'![ASPNETMVC_Button_reload_IconsImage](Icons_images/Icons_img5.png)'| markdownify }} e-collapse -{{'![](Icons_images/Icons_img6.png)'| markdownify }} +{{'![ASPNETMVC_Button_collapse_IconsImage](Icons_images/Icons_img6.png)'| markdownify }} e-cancel -{{'![](Icons_images/Icons_img7.png)'| markdownify }} +{{'![ASPNETMVC_Button_cancel_IconsImage](Icons_images/Icons_img7.png)'| markdownify }} e-expand -{{'![](Icons_images/Icons_img8.png)'| markdownify }} +{{'![ASPNETMVC_Button_expand_IconsImage](Icons_images/Icons_img8.png)'| markdownify }} e-minimize -{{'![](Icons_images/Icons_img9.png)'| markdownify }} +{{'![ASPNETMVC_Button_minimize_IconsImage](Icons_images/Icons_img9.png)'| markdownify }} e-login -{{'![](Icons_images/Icons_img10.png)'| markdownify }} +{{'![ASPNETMVC_Button_login_IconsImage](Icons_images/Icons_img10.png)'| markdownify }} e-orientationlanscape -{{'![](Icons_images/Icons_img11.png)'| markdownify }} +{{'![ASPNETMVC_Button_orientationlanscape_IconsImage](Icons_images/Icons_img11.png)'| markdownify }} e-alignleft -{{'![](Icons_images/Icons_img12.png)'| markdownify }} +{{'![ASPNETMVC_Button_alignleft_IconsImage](Icons_images/Icons_img12.png)'| markdownify }} e-aligncenter -{{'![](Icons_images/Icons_img13.png)'| markdownify }} +{{'![ASPNETMVC_Button_aligncenter_IconsImage](Icons_images/Icons_img13.png)'| markdownify }} e-alignright -{{'![](Icons_images/Icons_img14.png)'| markdownify }} +{{'![ASPNETMVC_Button_alignright_IconsImage](Icons_images/Icons_img14.png)'| markdownify }} e-alignjustify -{{'![](Icons_images/Icons_img15.png)'| markdownify }} +{{'![ASPNETMVC_Button_alignjustify_IconsImage](Icons_images/Icons_img15.png)'| markdownify }} e-alignnone -{{'![](Icons_images/Icons_img16.png)'| markdownify }} +{{'![ASPNETMVC_Button_alignnone_IconsImage](Icons_images/Icons_img16.png)'| markdownify }} e-filterset -{{'![](Icons_images/Icons_img17.png)'| markdownify }} +{{'![ASPNETMVC_Button_filterset_IconsImage](Icons_images/Icons_img17.png)'| markdownify }} e-filternone -{{'![](Icons_images/Icons_img18.png)'| markdownify }} +{{'![ASPNETMVC_Button_filternone_IconsImage](Icons_images/Icons_img18.png)'| markdownify }} e-arrowheadup-2x -{{'![](Icons_images/Icons_img19.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowheadup_IconsImage](Icons_images/Icons_img19.png)'| markdownify }} e-arrowheaddown-2x -{{'![](Icons_images/Icons_img20.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowheaddown_IconsImage](Icons_images/Icons_img20.png)'| markdownify }} e-arrowheadleft-2x -{{'![](Icons_images/Icons_img21.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowheadleft_IconsImage](Icons_images/Icons_img21.png)'| markdownify }} e-arrowheadright-2x -{{'![](Icons_images/Icons_img22.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowheadright_IconsImage](Icons_images/Icons_img22.png)'| markdownify }} e-numbering -{{'![](Icons_images/Icons_img23.png)'| markdownify }} +{{'![ASPNETMVC_Button_numbering_IconsImage](Icons_images/Icons_img23.png)'| markdownify }} e-bullets -{{'![](Icons_images/Icons_img24.png)'| markdownify }} +{{'![ASPNETMVC_Button_bullets_IconsImage](Icons_images/Icons_img24.png)'| markdownify }} e-maximize -{{'![](Icons_images/Icons_img25.png)'| markdownify }} +{{'![ASPNETMVC_Button_maximize_IconsImage](Icons_images/Icons_img25.png)'| markdownify }} e-delete -{{'![](Icons_images/Icons_img26.png)'| markdownify }} +{{'![ASPNETMVC_Button_delete_IconsImage](Icons_images/Icons_img26.png)'| markdownify }} e-scroll -{{'![](Icons_images/Icons_img27.png)'| markdownify }} +{{'![ASPNETMVC_Button_scroll_IconsImage](Icons_images/Icons_img27.png)'| markdownify }} e-right-scroll -{{'![](Icons_images/Icons_img28.png)'| markdownify }} +{{'![ASPNETMVC_Button_right_IconsImage](Icons_images/Icons_img28.png)'| markdownify }} e-search -{{'![](Icons_images/Icons_img29.png)'| markdownify }} +{{'![ASPNETMVC_Button_search_IconsImage](Icons_images/Icons_img29.png)'| markdownify }} e-mediaback -{{'![](Icons_images/Icons_img30.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediaback_IconsImage](Icons_images/Icons_img30.png)'| markdownify }} e-mediaforward -{{'![](Icons_images/Icons_img31.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediaforward_IconsImage](Icons_images/Icons_img31.png)'| markdownify }} e-medianext -{{'![](Icons_images/Icons_img32.png)'| markdownify }} +{{'![ASPNETMVC_Button_medianext_IconsImage](Icons_images/Icons_img32.png)'| markdownify }} e-mediaprev -{{'![](Icons_images/Icons_img33.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediaprev_IconsImage](Icons_images/Icons_img33.png)'| markdownify }} e-mediaeject -{{'![](Icons_images/Icons_img34.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediaeject_IconsImage](Icons_images/Icons_img34.png)'| markdownify }} e-mediaclose -{{'![](Icons_images/Icons_img35.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediaclose_IconsImage](Icons_images/Icons_img35.png)'| markdownify }} e-mediapause -{{'![](Icons_images/Icons_img36.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediapause_IconsImage](Icons_images/Icons_img36.png)'| markdownify }} e-mediaplay -{{'![](Icons_images/Icons_img37.png)'| markdownify }} +{{'![ASPNETMVC_Button_mediaplay_IconsImage](Icons_images/Icons_img37.png)'| markdownify }} e-righttick -{{'![](Icons_images/Icons_img38.png)'| markdownify }} +{{'![ASPNETMVC_Button_righttick_IconsImage](Icons_images/Icons_img38.png)'| markdownify }} e-smile -{{'![](Icons_images/Icons_img39.png)'| markdownify }} +{{'![ASPNETMVC_Button_smile_IconsImage](Icons_images/Icons_img39.png)'| markdownify }} e-information -{{'![](Icons_images/Icons_img40.png)'| markdownify }} +{{'![ASPNETMVC_Button_information_IconsImage](Icons_images/Icons_img40.png)'| markdownify }} e-left-arrow -{{'![](Icons_images/Icons_img41.png)'| markdownify }} +{{'![ASPNETMVC_Button_left_IconsImage](Icons_images/Icons_img41.png)'| markdownify }} e-right-arrow -{{'![](Icons_images/Icons_img42.png)'| markdownify }} +{{'![ASPNETMVC_Button_right_IconsImage](Icons_images/Icons_img42.png)'| markdownify }} e-file-delete -{{'![](Icons_images/Icons_img43.png)'| markdownify }} +{{'![ASPNETMVC_Button_delete_IconsImage](Icons_images/Icons_img43.png)'| markdownify }} e-file-percentage-success -{{'![](Icons_images/Icons_img44.png)'| markdownify }} +{{'![ASPNETMVC_Button_percentage_IconsImage](Icons_images/Icons_img44.png)'| markdownify }} e-file-cancel -{{'![](Icons_images/Icons_img45.png)'| markdownify }} +{{'![ASPNETMVC_Button_file_IconsImage](Icons_images/Icons_img45.png)'| markdownify }} e-file-percentage-failed -{{'![](Icons_images/Icons_img46.png)'| markdownify }} +{{'![ASPNETMVC_Button_file_IconsImage](Icons_images/Icons_img46.png)'| markdownify }} e-file-retry -{{'![](Icons_images/Icons_img47.png)'| markdownify }} +{{'![ASPNETMVC_Button_file_IconsImage](Icons_images/Icons_img47.png)'| markdownify }} e-resize-handle -{{'![](Icons_images/Icons_img48.png)'| markdownify }} +{{'![ASPNETMVC_Button_resize_IconsImage](Icons_images/Icons_img48.png)'| markdownify }} e-down-arrow -{{'![](Icons_images/Icons_img49.png)'| markdownify }} +{{'![ASPNETMVC_Button_down-arrow_IconsImage](Icons_images/Icons_img49.png)'| markdownify }} e-time -{{'![](Icons_images/Icons_img50.png)'| markdownify }} +{{'![ASPNETMVC_Button_time_IconsImage](Icons_images/Icons_img50.png)'| markdownify }} e-up-arrow -{{'![](Icons_images/Icons_img51.png)'| markdownify }} +{{'![ASPNETMVC_Button_up-arrow_IconsImage](Icons_images/Icons_img51.png)'| markdownify }} e-date -{{'![](Icons_images/Icons_img52.png)'| markdownify }} +{{'![ASPNETMVC_Button_date_IconsImage](Icons_images/Icons_img52.png)'| markdownify }} e-datetime -{{'![](Icons_images/Icons_img53.png)'| markdownify }} +{{'![ASPNETMVC_Button_datetime_IconsImage](Icons_images/Icons_img53.png)'| markdownify }} e-collapse-arrow -{{'![](Icons_images/Icons_img54.png)'| markdownify }} +{{'![ASPNETMVC_Button_collapse_IconsImage](Icons_images/Icons_img54.png)'| markdownify }} e-expand-arrow -{{'![](Icons_images/Icons_img55.png)'| markdownify }} +{{'![ASPNETMVC_Button_expand_IconsImage](Icons_images/Icons_img55.png)'| markdownify }} e-restore -{{'![](Icons_images/Icons_img56.png)'| markdownify }} +{{'![ASPNETMVC_Button_restore_IconsImage](Icons_images/Icons_img56.png)'| markdownify }} e-plus -{{'![](Icons_images/Icons_img57.png)'| markdownify }} +{{'![ASPNETMVC_Button_plus_IconsImage](Icons_images/Icons_img57.png)'| markdownify }} e-minus -{{'![](Icons_images/Icons_img58.png)'| markdownify }} +{{'![ASPNETMVC_Button_minus_IconsImage](Icons_images/Icons_img58.png)'| markdownify }} e-handup -{{'![](Icons_images/Icons_img59.png)'| markdownify }} +{{'![ASPNETMVC_Button_handup_IconsImage](Icons_images/Icons_img59.png)'| markdownify }} e-clock -{{'![](Icons_images/Icons_img60.png)'| markdownify }} +{{'![ASPNETMVC_Button_clock_IconsImage](Icons_images/Icons_img60.png)'| markdownify }} e-cursor -{{'![](Icons_images/Icons_img61.png)'| markdownify }} +{{'![ASPNETMVC_Button_cursor_IconsImage](Icons_images/Icons_img61.png)'| markdownify }} e-hyperlink -{{'![](Icons_images/Icons_img62.png)'| markdownify }} +{{'![ASPNETMVC_Button_hyperlink_IconsImage](Icons_images/Icons_img62.png)'| markdownify }} e-hyperlinkbreak -{{'![](Icons_images/Icons_img63.png)'| markdownify }} +{{'![ASPNETMVC_Button_hyperlinkbreak_IconsImage](Icons_images/Icons_img63.png)'| markdownify }} e-settings -{{'![](Icons_images/Icons_img64.png)'| markdownify }} +{{'![ASPNETMVC_Button_settings_IconsImage](Icons_images/Icons_img64.png)'| markdownify }} e-shoppingcart -{{'![](Icons_images/Icons_img65.png)'| markdownify }} +{{'![ASPNETMVC_Button_shoppingcart_IconsImage](Icons_images/Icons_img65.png)'| markdownify }} e-palette -{{'![](Icons_images/Icons_img66.png)'| markdownify }} +{{'![ASPNETMVC_Button_palette_IconsImage](Icons_images/Icons_img66.png)'| markdownify }} e-warningmessage -{{'![](Icons_images/Icons_img67.png)'| markdownify }} +{{'![ASPNETMVC_Button_warningmessage_IconsImage](Icons_images/Icons_img67.png)'| markdownify }} e-cut -{{'![](Icons_images/Icons_img68.png)'| markdownify }} +{{'![ASPNETMVC_Button_cut_IconsImage](Icons_images/Icons_img68.png)'| markdownify }} e-copy -{{'![](Icons_images/Icons_img69.png)'| markdownify }} +{{'![ASPNETMVC_Button_copy_IconsImage](Icons_images/Icons_img69.png)'| markdownify }} e-paste -{{'![](Icons_images/Icons_img70.png)'| markdownify }} +{{'![ASPNETMVC_Button_paste_IconsImage](Icons_images/Icons_img70.png)'| markdownify }} e-edit -{{'![](Icons_images/Icons_img71.png)'| markdownify }} +{{'![ASPNETMVC_Button_edit_IconsImage](Icons_images/Icons_img71.png)'| markdownify }} e-swapleft -{{'![](Icons_images/Icons_img72.png)'| markdownify }} +{{'![ASPNETMVC_Button_swapleft_IconsImage](Icons_images/Icons_img72.png)'| markdownify }} e-swapright -{{'![](Icons_images/Icons_img73.png)'| markdownify }} +{{'![ASPNETMVC_Button_swapright_IconsImage](Icons_images/Icons_img73.png)'| markdownify }} e-swapup -{{'![](Icons_images/Icons_img74.png)'| markdownify }} +{{'![ASPNETMVC_Button_swapup_IconsImage](Icons_images/Icons_img74.png)'| markdownify }} e-swapdown -{{'![](Icons_images/Icons_img75.png)'| markdownify }} +{{'![ASPNETMVC_Button_swapdown_IconsImage](Icons_images/Icons_img75.png)'| markdownify }} e-zoomin -{{'![](Icons_images/Icons_img76.png)'| markdownify }} +{{'![ASPNETMVC_Button_zoomin_IconsImage](Icons_images/Icons_img76.png)'| markdownify }} e-zoomout -{{'![](Icons_images/Icons_img77.png)'| markdownify }} +{{'![ASPNETMVC_Button_zoomout_IconsImage](Icons_images/Icons_img77.png)'| markdownify }} e-star -{{'![](Icons_images/Icons_img78.png)'| markdownify }} +{{'![ASPNETMVC_Button_star_IconsImage](Icons_images/Icons_img78.png)'| markdownify }} e-home -{{'![](Icons_images/Icons_img79.png)'| markdownify }} +{{'![ASPNETMVC_Button_home_IconsImage](Icons_images/Icons_img79.png)'| markdownify }} e-clipboard -{{'![](Icons_images/Icons_img80.png)'| markdownify }} +{{'![ASPNETMVC_Button_clipboard_IconsImage](Icons_images/Icons_img80.png)'| markdownify }} e-userlogin -{{'![](Icons_images/Icons_img81.png)'| markdownify }} +{{'![ASPNETMVC_Button_userlogin_IconsImage](Icons_images/Icons_img81.png)'| markdownify }} e-dataexport -{{'![](Icons_images/Icons_img82.png)'| markdownify }} +{{'![ASPNETMVC_Button_dataexport_IconsImage](Icons_images/Icons_img82.png)'| markdownify }} e-arrowheadright -{{'![](Icons_images/Icons_img83.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowheadright_IconsImage](Icons_images/Icons_img83.png)'| markdownify }} e-arrowheaddown -{{'![](Icons_images/Icons_img84.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowheaddown_IconsImage](Icons_images/Icons_img84.png)'| markdownify }} e-undo -{{'![](Icons_images/Icons_img85.png)'| markdownify }} +{{'![ASPNETMVC_Button_undo_IconsImage](Icons_images/Icons_img85.png)'| markdownify }} e-redo -{{'![](Icons_images/Icons_img86.png)'| markdownify }} +{{'![ASPNETMVC_Button_redo_IconsImage](Icons_images/Icons_img86.png)'| markdownify }} e-bold -{{'![](Icons_images/Icons_img87.png)'| markdownify }} +{{'![ASPNETMVC_Button_bold_IconsImage](Icons_images/Icons_img87.png)'| markdownify }} e-italic -{{'![](Icons_images/Icons_img88.png)'| markdownify }} +{{'![ASPNETMVC_Button_italic_IconsImage](Icons_images/Icons_img88.png)'| markdownify }} e-underline -{{'![](Icons_images/Icons_img89.png)'| markdownify }} +{{'![ASPNETMVC_Button_underline_IconsImage](Icons_images/Icons_img89.png)'| markdownify }} e-strikethrough -{{'![](Icons_images/Icons_img90.png)'| markdownify }} +{{'![ASPNETMVC_Button_strikethrough_IconsImage](Icons_images/Icons_img90.png)'| markdownify }} e-font -{{'![](Icons_images/Icons_img91.png)'| markdownify }} +{{'![ASPNETMVC_Button_font_IconsImage](Icons_images/Icons_img91.png)'| markdownify }} e-rarrowdown -{{'![](Icons_images/Icons_img92.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowdown_IconsImage](Icons_images/Icons_img92.png)'| markdownify }} e-rarrowleft -{{'![](Icons_images/Icons_img93.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowleft_IconsImage](Icons_images/Icons_img93.png)'| markdownify }} e-rarrowup -{{'![](Icons_images/Icons_img94.png)'| markdownify }} +{{'![ASPNETMVC_Button_arrowup_IconsImage](Icons_images/Icons_img94.png)'| markdownify }} e-rarrowright -{{'![](Icons_images/Icons_img95.png)'| markdownify }} +{{'![ASPNETMVC_Button_erarrowright_IconsImage](Icons_images/Icons_img95.png)'| markdownify }} e-calender -{{'![](Icons_images/Icons_img96.png)'| markdownify }} +{{'![ASPNETMVC_Button_calender_IconsImage](Icons_images/Icons_img96.png)'| markdownify }} e-save -{{'![](Icons_images/Icons_img97.png)'| markdownify }} +{{'![ASPNETMVC_Button_save_IconsImage](Icons_images/Icons_img97.png)'| markdownify }} diff --git a/aspnetmvc/Chart/Chart-Types.md b/aspnetmvc/Chart/Chart-Types.md index 3041dd8b8..d0992aa99 100644 --- a/aspnetmvc/Chart/Chart-Types.md +++ b/aspnetmvc/Chart/Chart-Types.md @@ -1,15 +1,13 @@ --- layout: post title: Chart types |Chart | ASP.NET MVC | Syncfusion -description: What are the different types of Charts available in Essential JavaScript Chart. +description: Learn here all about Chart types support in Syncfusion Essential Studio ASP.NET MVC Chart Control, its elements, and more. platform: ejmvc control: Chart documentation: ug --- -# ChartTypes - -## Line Chart +# Line Chart in ASP.NET MVC Chart To render a Line Chart, set the series **Type** as **Line** in the chart series. To change the line segment color, you can use the **Fill** property of the series. @@ -31,7 +29,7 @@ To render a Line Chart, set the series **Type** as **Line** in the chart series. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img1.png) +![ASPNETMVC_Chart_TypesImages](Chart-Types_images/Chart-Types_img1.png) [Click](http://mvc.syncfusion.com/demos/web/chart/default) here to view the Line Chart online demo sample. @@ -59,7 +57,7 @@ To change the width of the line segment, you can use the **Width** property in t {% endhighlight %} -![](Chart-Types_images/Chart-Types_img2.png) +![ASPNETMVC_Chart_LineWidthImages](Chart-Types_images/Chart-Types_img2.png) ### Dashed lines @@ -83,7 +81,7 @@ To render the line series with dotted lines, you can use the **DashArray** optio {% endhighlight %} -![](Chart-Types_images/Chart-Types_img3.png) +![ASPNETMVC_Chart_DashedLinesImages](Chart-Types_images/Chart-Types_img3.png) ### Changing the line cap @@ -109,7 +107,7 @@ For customizing the start and end caps of the line segment, you can use the **Li {% endhighlight %} -![](Chart-Types_images/Chart-Types_img4.png) +![ASPNETMVC_Chart_LineCapImages](Chart-Types_images/Chart-Types_img4.png) ### Changing the line join @@ -136,7 +134,7 @@ You can use the **LineJoin** property to specify how two intersecting line segme {% endhighlight %} -![](Chart-Types_images/Chart-Types_img5.png) +![ASPNETMVC_Chart_LineImages](Chart-Types_images/Chart-Types_img5.png) ### MultiColor Line @@ -160,7 +158,7 @@ You can change the color of the line segments by using the *Fill* property of th {% endhighlight %} -![](Chart-Types_images/Chart-Types_img81.png) +![ASPNETMVC_Chart_MulticolorImages](Chart-Types_images/Chart-Types_img81.png) [Click](http://mvc.syncfusion.com/demos/web/chart/multicolor) here to view the MultiColor Line Chart online demo sample. @@ -187,7 +185,7 @@ To render a Step Line Chart, set the series Type as **StepLine"** in the chart s {% endhighlight %} -![](Chart-Types_images/Chart-Types_img6.png) +![ASPNETMVC_Chart_StepLineImages](Chart-Types_images/Chart-Types_img6.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stepline) here to view the Step Line Chart online demo sample. @@ -213,7 +211,7 @@ To change the line width, you can use the **Width** property. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img7.png) +![ASPNETMVC_Chart_Line_widthImages](Chart-Types_images/Chart-Types_img7.png) ### Dashed lines @@ -237,7 +235,7 @@ To render the step line series with dotted lines, you can use the DashArray opti {% endhighlight %} -![](Chart-Types_images/Chart-Types_img8.png) +![ASPNETMVC_Chart_DashedLineImages](Chart-Types_images/Chart-Types_img8.png) ### Changing the line cap @@ -263,7 +261,7 @@ For customizing the start and end caps of the line segment, you can use the Line {% endhighlight %} -![](Chart-Types_images/Chart-Types_img9.png) +![ASPNETMVC_Chart_LineCapImages](Chart-Types_images/Chart-Types_img9.png) ### Changing the line join @@ -290,7 +288,7 @@ You can use the LineJoin property to specify how two intersecting line segments {% endhighlight %} -![](Chart-Types_images/Chart-Types_img10.png) +![ASPNETMVC_Chart_TypesImages](Chart-Types_images/Chart-Types_img10.png) ## Area Chart @@ -316,7 +314,7 @@ To render an Area chart, you can specify the series Type as **Area** in the char {% endhighlight %} -![](Chart-Types_images/Chart-Types_img11.png) +![ASPNETMVC_Chart_AreaImages](Chart-Types_images/Chart-Types_img11.png) [Click](http://mvc.syncfusion.com/demos/web/chart/area) here to view the Area Chart online demo. @@ -356,7 +354,7 @@ Since the RangeArea series requires two y values for a point, you have to add th {% endhighlight %} -![](Chart-Types_images/Chart-Types_img12.png) +![ASPNETMVC_Chart_RangeAreaImages](Chart-Types_images/Chart-Types_img12.png) [Click](http://mvc.syncfusion.com/demos/web/chart/rangearea) here to view Range Area Chart online demo. @@ -386,7 +384,7 @@ To render a Step Area Chart, set the Type as **StepArea** in the chart series. T {% endhighlight %} -![](Chart-Types_images/Chart-Types_img13.png) +![ASPNETMVC_Chart_StepAreaImages](Chart-Types_images/Chart-Types_img13.png) [Click](http://mvc.syncfusion.com/demos/web/chart/steparea) here to view Step Area Chart online demo. @@ -417,7 +415,7 @@ To render a Spline Area Chart, set the Type as **SplineArea** in the chart serie {% endhighlight %} -![](Chart-Types_images/Chart-Types_img14.png) +![ASPNETMVC_Chart_SplineAreaImages](Chart-Types_images/Chart-Types_img14.png) [Click](http://mvc.syncfusion.com/demos/web/chart/splinearea) here to view Spline Area Chart online demo. @@ -447,7 +445,7 @@ To render a Stacked Area Chart, set the Type as **StackingArea** in the chart se {% endhighlight %} -![](Chart-Types_images/Chart-Types_img15.png) +![ASPNETMVC_Chart_StackedAreaImages](Chart-Types_images/Chart-Types_img15.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingarea) here to view Stacked Area Chart online demo. @@ -478,7 +476,7 @@ To render a 100% Stacked Area Chart, set the Type as **StackingArea100** in the {% endhighlight %} -![](Chart-Types_images/Chart-Types_img16.png) +![ASPNETMVC_Chart_StackedAreaImages](Chart-Types_images/Chart-Types_img16.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingarea100) here to view 100% Stacked Area Chart online demo. @@ -509,7 +507,7 @@ To render a Column Chart, set the Type as **Column** in the chart series. To cha {% endhighlight %} -![](Chart-Types_images/Chart-Types_img17.png) +![ASPNETMVC_Chart_ColumnChartImages](Chart-Types_images/Chart-Types_img17.png) [Click](http://mvc.syncfusion.com/demos/web/chart/column) here to view Column Chart demo. @@ -539,7 +537,7 @@ You can change the color of a column by using the Fill property of the point. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img18.png) +![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img18.png) ### Column width customization @@ -562,7 +560,7 @@ N> Width of a column also depends upon the *ColumnSpacing* property, because *Co {% endhighlight %} -![](Chart-Types_images/Chart-Types_img88.png) +![ASPNETMVC_Chart_ColumnWidthImages](Chart-Types_images/Chart-Types_img88.png) ### Column with rounded corners Corners of the column chart can be customized by setting value to the **CornerRadius** property. @@ -575,7 +573,7 @@ Corners of the column chart can be customized by setting value to the **CornerRa {% endhighlight %} -![](Chart-Types_images/Chart-Types_img90.png) +![ASPNETMVC_Chart_RoundedImages](Chart-Types_images/Chart-Types_img90.png) ### Spacing between column series @@ -598,7 +596,7 @@ N> Space between columns will also affect the width of the column. For example, {% endhighlight %} -![](Chart-Types_images/Chart-Types_img89.png) +![ASPNETMVC_Chart_ColumnSeriesImages](Chart-Types_images/Chart-Types_img89.png) ### Cylindrical Chart @@ -627,7 +625,7 @@ The following chart types can be rendered as cylinder in both 2D and in 3D view. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img91.png) +![ASPNETMVC_Chart_CylindricalImages](Chart-Types_images/Chart-Types_img91.png) ## RangeColumn Chart @@ -662,7 +660,7 @@ Since, the RangeColumn series requires two y values for a point, add the High an {% endhighlight %} -![](Chart-Types_images/Chart-Types_img19.png) +![ASPNETMVC_Chart_RangeColumnImages](Chart-Types_images/Chart-Types_img19.png) [Click](http://mvc.syncfusion.com/demos/web/chart/rangecolumn) here to view Range Column Chart online demo. @@ -691,7 +689,7 @@ To change the color of a range column, you can use the Fill property of point. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img20.png) +![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img20.png) ## Stacked Column Chart @@ -719,7 +717,7 @@ To render a Stacked Column Chart, set the Type as **StackingColumn** in the char {% endhighlight %} -![](Chart-Types_images/Chart-Types_img21.png) +![ASPNETMVC_Chart_StackedColumnImages](Chart-Types_images/Chart-Types_img21.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingcolumn) here to view Stacked Column Chart online demo. @@ -753,7 +751,7 @@ You can use the **StackingGroup** property to group the stacked columns. Columns {% endhighlight %} -![](Chart-Types_images/Chart-Types_img22.png) +![ASPNETMVC_Chart_ClusterImages](Chart-Types_images/Chart-Types_img22.png) ### Change a point color @@ -780,7 +778,7 @@ To change the color of a stacking column, you can use the Fill property of the p {% endhighlight %} -![](Chart-Types_images/Chart-Types_img23.png) +![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img23.png) ## 100% Stacked Column Chart @@ -806,7 +804,7 @@ To render a 100% Stacked Column Chart, set the Type as **StackingColumn100** in {% endhighlight %} -![](Chart-Types_images/Chart-Types_img24.png) +![ASPNETMVC_Chart_StackedImages](Chart-Types_images/Chart-Types_img24.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingcolumn100) here to view 100% Stacked Column Chart online demo. @@ -841,7 +839,7 @@ By using the **StackingGroup** property, you can group the 100% stacking columns {% endhighlight %} -![](Chart-Types_images/Chart-Types_img25.png) +![ASPNETMVC_Chart_ClusterImages](Chart-Types_images/Chart-Types_img25.png) ### Change a point color @@ -867,7 +865,7 @@ To change the color of a 100% stacking column, you can use the Fill property of {% endhighlight %} -![](Chart-Types_images/Chart-Types_img26.png) +![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img26.png) ## Bar Chart @@ -895,7 +893,7 @@ To render a bar Chart, set the Type as **Bar** in the chart series. To change th {% endhighlight %} -![](Chart-Types_images/Chart-Types_img27.png) +![ASPNETMVC_Chart_PointColorImagesImages](Chart-Types_images/Chart-Types_img27.png) [Click](http://mvc.syncfusion.com/demos/web/chart/bar) here to view Bar Chart demo. @@ -925,7 +923,7 @@ By using the Fill property of the point, you can change the specific point of th {% endhighlight %} -![](Chart-Types_images/Chart-Types_img28.png) +![ASPNETMVC_Chart_BarColorImages](Chart-Types_images/Chart-Types_img28.png) ## Stacked Bar Chart @@ -953,7 +951,7 @@ To render a Stacked Bar Chart, set the Type as **StackingBar** in the chart seri {% endhighlight %} -![](Chart-Types_images/Chart-Types_img29.png) +![ASPNETMVC_Chart_StackedBarImages](Chart-Types_images/Chart-Types_img29.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingbar) here to view Stacked Bar Chart online demo. @@ -988,7 +986,7 @@ You can use the **StackingGroup** property to group the stacking bars with the s {% endhighlight %} -![](Chart-Types_images/Chart-Types_img30.png) +![ASPNETMVC_Chart_ClusterImages](Chart-Types_images/Chart-Types_img30.png) ### Change a point color @@ -1015,7 +1013,7 @@ You can change the color of a stacking bar by using the Fill property of the poi {% endhighlight %} -![](Chart-Types_images/Chart-Types_img31.png) +![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img31.png) ## 100% Stacked Bar Chart @@ -1043,7 +1041,7 @@ To render a 100% Stacked Bar Chart, set the Type as **StackingBar100** in the ch {% endhighlight %} -![](Chart-Types_images/Chart-Types_img32.png) +![ASPNETMVC_Chart_StackedBarimages](Chart-Types_images/Chart-Types_img32.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingbar100) here to view 100% Stacked Bar Chart online demo. @@ -1073,7 +1071,7 @@ By using the StackingGroup property, you can group the 100% stacking bars with t {% endhighlight %} -![](Chart-Types_images/Chart-Types_img33.png) +![ASPNETMVC_Chart_StackingGroupImages](Chart-Types_images/Chart-Types_img33.png) ### Change a point color @@ -1100,7 +1098,7 @@ To change the color of a 100% stacking bar, you can use the Fill property of the {% endhighlight %} -![](Chart-Types_images/Chart-Types_img34.png) +![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img34.png) ## Spline Chart @@ -1127,7 +1125,7 @@ To render a Spline Chart, set the Type as **Spline** in the chart series. To cha {% endhighlight %} -![](Chart-Types_images/Chart-Types_img35.png) +![ASPNETMVC_Chart_SplineImages](Chart-Types_images/Chart-Types_img35.png) [Click](http://mvc.syncfusion.com/demos/web/chart/spline) here to view the Spline Chart online demo sample. @@ -1158,7 +1156,7 @@ To change the spline segment width, you can use the Width property of the series {% endhighlight %} -![](Chart-Types_images/Chart-Types_img36.png) +![ASPNETMVC_Chart_SplineChartImages](Chart-Types_images/Chart-Types_img36.png) ### Dashed lines @@ -1186,7 +1184,7 @@ To render the spline series with dotted lines, you can use the DashArray option {% endhighlight %} -![](Chart-Types_images/Chart-Types_img37.png) +![ASPNETMVC_Chart_DashedLinesImages](Chart-Types_images/Chart-Types_img37.png) ## Pie Chart @@ -1215,7 +1213,7 @@ You can create a pie chart by setting the series Type as **Pie** in the chart se {% endhighlight %} -![](Chart-Types_images/Chart-Types_img38.png) +![ASPNETMVC_Chart_PieImages](Chart-Types_images/Chart-Types_img38.png) [Click](http://mvc.syncfusion.com/demos/web/chart/pie) here to view the Pie chart online demo sample. @@ -1246,7 +1244,7 @@ You can use the **PieCoefficient** property to change the diameter of the Pie ch {% endhighlight %} -![](Chart-Types_images/Chart-Types_img39.png) +![ASPNETMVC_Chart_PieSizeImages](Chart-Types_images/Chart-Types_img39.png) ### Explode a pie segment @@ -1274,7 +1272,7 @@ You can explode a pie segment on the chart load by using the **ExplodeIndex** of {% endhighlight %} -![](Chart-Types_images/Chart-Types_img40.png) +![ASPNETMVC_Chart_PieSegmentImages](Chart-Types_images/Chart-Types_img40.png) ### Explode all the segments @@ -1302,7 +1300,7 @@ To explode all the segments of the Pie chart, you can enable the **ExplodeAll** {% endhighlight %} -![](Chart-Types_images/Chart-Types_img41.png) +![ASPNETMVC_Chart_SegmentsImages](Chart-Types_images/Chart-Types_img41.png) ### Explode a pie segment on mouse over @@ -1330,7 +1328,7 @@ To explode a pie segment on a mouse over, you can enable the **Explode** propert {% endhighlight %} -![](Chart-Types_images/Chart-Types_img42.png) +![ASPNETMVC_Chart_MouseOverImages](Chart-Types_images/Chart-Types_img42.png) ### Sector of Pie @@ -1358,7 +1356,7 @@ EjChart allows you to render all the data points/segments in the semi-pie, quart {% endhighlight %} -![](Chart-Types_images/Chart-Types_img43.png) +![ASPNETMVC_Chart_SectorPieImages](Chart-Types_images/Chart-Types_img43.png) [Click](http://mvc.syncfusion.com/demos/web/chart/semipie) here to view the Semi Pie Chart online demo sample. @@ -1390,7 +1388,7 @@ To create a Doughnut chart, you can specify the series Type as **Doughnut** in t {% endhighlight %} -![](Chart-Types_images/Chart-Types_img44.png) +![ASPNETMVC_Chart_DoughnutImages](Chart-Types_images/Chart-Types_img44.png) [Click](http://mvc.syncfusion.com/demos/web/chart/doughnut) here to view the Doughnut Chart online demo sample. @@ -1420,7 +1418,7 @@ You can change the doughnut chart inner radius by using the **DoughnutCoefficien {% endhighlight %} -![](Chart-Types_images/Chart-Types_img45.png) +![ASPNETMVC_Chart_InnerradiusImages](Chart-Types_images/Chart-Types_img45.png) ### Change the doughnut size @@ -1448,7 +1446,7 @@ You can use the **DoughnutSize** property to change the diameter of the Doughnut {% endhighlight %} -![](Chart-Types_images/Chart-Types_img46.png) +![ASPNETMVC_Chart_doughnutsizeImages](Chart-Types_images/Chart-Types_img46.png) ### Explode a doughnut segment @@ -1476,7 +1474,7 @@ To explode a specific doughnut segment, set the index to be exploded by using th {% endhighlight %} -![](Chart-Types_images/Chart-Types_img47.png) +![ASPNETMVC_Chart_doughnutImages](Chart-Types_images/Chart-Types_img47.png) ### Explode all the segments @@ -1504,7 +1502,7 @@ To explode all the segments, you can enable the **ExplodeAll** property of the s {% endhighlight %} -![](Chart-Types_images/Chart-Types_img48.png) +![ASPNETMVC_Chart_SegmentImages](Chart-Types_images/Chart-Types_img48.png) ### Explode a doughnut segment on mouse over @@ -1532,7 +1530,7 @@ To explode a doughnut segment on a mouse over, you can enable the **Explode** pr {% endhighlight %} -![](Chart-Types_images/Chart-Types_img49.png) +![ASPNETMVC_Chart_MouseOverImages](Chart-Types_images/Chart-Types_img49.png) ### Sector of Doughnut @@ -1561,7 +1559,7 @@ EjChart allows you to render all the data points/segments in the semi-doughnut, {% endhighlight %} -![](Chart-Types_images/Chart-Types_img50.png) +![ASPNETMVC_Chart_DoughNut_SegmentImages](Chart-Types_images/Chart-Types_img50.png) [Click](http://mvc.syncfusion.com/demos/web/chart/semipie) here to view the Semi Doughnut Chart online demo sample. @@ -1594,12 +1592,12 @@ EjChart provides support to render more than one series in pie and in doughnut c **Multiple Pie** -![](Chart-Types_images/Chart-Types_img82.png) +![ASPNETMVC_Chart_MultiplePieImages](Chart-Types_images/Chart-Types_img82.png) **Multiple Doughnut** -![](Chart-Types_images/Chart-Types_img83.png) +![ASPNETMVC_Chart_Multiple_DoughNutImages](Chart-Types_images/Chart-Types_img83.png) [Click](http://mvc.syncfusion.com/demos/web/chart/multiplepie) here to view the Multiple Pie chart online demo sample. @@ -1615,7 +1613,7 @@ In the Multiple Pie chart, the start and end angle property is also supported. **Sector of Multiple Doughnut** -![](Chart-Types_images/Chart-Types_img85.png) +![ASPNETMVC_Chart_AngleImages](Chart-Types_images/Chart-Types_img85.png) ## Pyramid Chart @@ -1643,7 +1641,7 @@ To create a Pyramid chart, you can specify the series Type as **Pyramid** in the {% endhighlight %} -![](Chart-Types_images/Chart-Types_img51.png) +![ASPNETMVC_Chart_PyramidImages](Chart-Types_images/Chart-Types_img51.png) [Click](http://mvc.syncfusion.com/demos/web/chart/pyramid) here to view the Pyramid Chart online demo sample. @@ -1673,7 +1671,7 @@ Pyramid mode has two types, *Linear* and *Surface* respectively. The default **P {% endhighlight %} -![](Chart-Types_images/Chart-Types_img52.png) +![ASPNETMVC_Chart_PyramidModeImages](Chart-Types_images/Chart-Types_img52.png) ### Gap between the segments @@ -1700,7 +1698,7 @@ You can control the gap between the segments by using the **GapRatio** option of {% endhighlight %} -![](Chart-Types_images/Chart-Types_img53.png) +![ASPNETMVC_Chart_SegmentsImages](Chart-Types_images/Chart-Types_img53.png) ### Explode a pyramid segment @@ -1728,7 +1726,7 @@ You can explode a pyramid segment on the chart load by using the **ExplodeIndex* {% endhighlight %} -![](Chart-Types_images/Chart-Types_img54.png) +![ASPNETMVC_Chart_PyramidImages](Chart-Types_images/Chart-Types_img54.png) ## Funnel Chart @@ -1756,7 +1754,7 @@ You can create a funnel chart by setting the series Type as **Funnel** in the ch {% endhighlight %} -![](Chart-Types_images/Chart-Types_img55.png) +![ASPNETMVC_Chart_FunnelImages](Chart-Types_images/Chart-Types_img55.png) [Click](http://mvc.syncfusion.com/demos/web/chart/funnel) here to view the Funnel Chart online demo sample. @@ -1787,7 +1785,7 @@ Funnel segments height and width is calculated from the chart size, by default. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img56.png) +![ASPNETMVC_Chart_Funnel_widthImages](Chart-Types_images/Chart-Types_img56.png) ### Explode a funnel segment @@ -1815,7 +1813,7 @@ You can explode a funnel segment on the chart load by using the **ExplodeIndex** {% endhighlight %} -![](Chart-Types_images/Chart-Types_img57.png) +![ASPNETMVC_Chart_Funnel_SegmentImages](Chart-Types_images/Chart-Types_img57.png) ## Bubble Chart @@ -1861,7 +1859,7 @@ To create a Bubble chart, you can set the series Type as **Bubble** in the chart {% endhighlight %} -![](Chart-Types_images/Chart-Types_img58.png) +![ASPNETMVC_Chart_BubbleImages](Chart-Types_images/Chart-Types_img58.png) [Click](http://mvc.syncfusion.com/demos/web/chart/bubble) here to view the Bubble Chart online demo sample. @@ -1891,7 +1889,7 @@ To create a Scatter chart, you can set the series Type as **Scatter** in the cha {% endhighlight %} -![](Chart-Types_images/Chart-Types_img59.png) +![ASPNETMVC_Chart_ScatterImages](Chart-Types_images/Chart-Types_img59.png) [Click](http://mvc.syncfusion.com/demos/web/chart/scatter) here to view the Scatter Chart online demo sample. @@ -1922,7 +1920,7 @@ You can change the scatter size by using the **Size** property of the series mar {% endhighlight %} -![](Chart-Types_images/Chart-Types_img60.png) +![ASPNETMVC_Chart_ScatterImages](Chart-Types_images/Chart-Types_img60.png) ## HiLoOpenClose Chart  @@ -1970,7 +1968,7 @@ To create a HiLoOpenClose chart, you can set the series Type as **HiloOpenClose* {% endhighlight %} -![](Chart-Types_images/Chart-Types_img61.png) +![ASPNETMVC_Chart_HiloOpenImages](Chart-Types_images/Chart-Types_img61.png) [Click](http://mvc.syncfusion.com/demos/web/chart/hiloopenclose) here to view the HiLoOpenClose Chart online demo sample. @@ -2001,7 +1999,7 @@ You can change the HiLoOpenClose chart **DrawMode** to *Open, Close* or *Both*. {% endhighlight %} -![](Chart-Types_images/Chart-Types_img62.png) +![ASPNETMVC_Chart_DrawModeImages](Chart-Types_images/Chart-Types_img62.png) ### Bull and Bear Color @@ -2030,7 +2028,7 @@ HiLoOpenClose chart **BullFillColor** is used to specify a fill color for the se {% endhighlight %} -![](Chart-Types_images/Chart-Types_img63.png) +![ASPNETMVC_Chart_BearColorImages](Chart-Types_images/Chart-Types_img63.png) ## Candle @@ -2079,7 +2077,7 @@ You can create a Candle chart by specifying the series Type as **Candle** in the {% endhighlight %} -![](Chart-Types_images/Chart-Types_img64.png) +![ASPNETMVC_Chart_CandleImages](Chart-Types_images/Chart-Types_img64.png) [Click](http://mvc.syncfusion.com/demos/web/chart/candle) here to view the Candle Chart online demo sample. @@ -2109,7 +2107,7 @@ Candle chart **BullFillColor** is used to specify a fill color for the segments {% endhighlight %} -![](Chart-Types_images/Chart-Types_img65.png) +![ASPNETMVC_Chart_BearColorImages](Chart-Types_images/Chart-Types_img65.png) ## HiLo @@ -2155,7 +2153,7 @@ HiLo chart is created by setting the series Type as **Hilo** in the chart series {% endhighlight %} -![](Chart-Types_images/Chart-Types_img66.png) +![ASPNETMVC_Chart_HiLoImages](Chart-Types_images/Chart-Types_img66.png) [Click](http://mvc.syncfusion.com/demos/web/chart/hilo) here to view the HiLo Chart online demo sample. @@ -2186,7 +2184,7 @@ Polar chart is created by setting the series Type as **Polar** in the chart seri {% endhighlight %} -![](Chart-Types_images/Chart-Types_img67.png) +![ASPNETMVC_Chart_PolarImages](Chart-Types_images/Chart-Types_img67.png) [Click](http://mvc.syncfusion.com/demos/web/chart/polar) here to view the Polar Chart online demo sample. @@ -2217,7 +2215,7 @@ Polar **DrawType** property is used to change the series plotting type to *Line* {% endhighlight %} -![](Chart-Types_images/Chart-Types_img68.png) +![ASPNETMVC_Chart_DrawTypeImages](Chart-Types_images/Chart-Types_img68.png) ### Stack columns in Polar chart @@ -2245,7 +2243,7 @@ By using the **IsStacking** property, you can specify whether the column has to {% endhighlight %} -![](Chart-Types_images/Chart-Types_img69.png) +![ASPNETMVC_Chart_StackImages](Chart-Types_images/Chart-Types_img69.png) [Click](http://mvc.syncfusion.com/demos/web/chart/windrose) here to view the Polar Wind Rose Chart online demo sample. @@ -2276,7 +2274,7 @@ To create a Radar chart, you can specify the series Type as **Radar** in the cha {% endhighlight %} -![](Chart-Types_images/Chart-Types_img70.png) +![ASPNETMVC_Chart_RadarImages](Chart-Types_images/Chart-Types_img70.png) [Click](http://mvc.syncfusion.com/demos/web/chart/radar) here to view the Radar Chart online demo sample. @@ -2307,7 +2305,7 @@ Radar **DrawType** property is used to change the series plotting type to *Line* {% endhighlight %} -![](Chart-Types_images/Chart-Types_img71.png) +![ASPNETMVC_Chart_DrawTypesImages](Chart-Types_images/Chart-Types_img71.png) ### Stack columns in Radar chart @@ -2336,7 +2334,7 @@ By using the **IsStacking** property, you can specify whether the column has to {% endhighlight %} -![](Chart-Types_images/Chart-Types_img72.png) +![ASPNETMVC_Chart_RadarImages](Chart-Types_images/Chart-Types_img72.png) ## Waterfall Chart @@ -2362,7 +2360,7 @@ N> The inline property of the **Series.PositiveFill** has the first priority and {% endhighlight %} -![](Chart-Types_images/Chart-Types_img73.png) +![ASPNETMVC_Chart_WaterfallsImages](Chart-Types_images/Chart-Types_img73.png) [Click](http://mvc.syncfusion.com/demos/web/chart/waterfall) here to view the Waterfall Chart online demo sample. @@ -2446,7 +2444,7 @@ To customize the connector line color, width, opacity and dashArray of the water {% endhighlight %} -![](Chart-Types_images/Chart-Types_img74.png) +![]ASPNETMVC_Chart_TypesImages(Chart-Types_images/Chart-Types_img74.png) @@ -2473,7 +2471,7 @@ EjChart can generate Error bar for Cartesian type series *(Line, Column, Bar, Sc {% endhighlight %} -![](Chart-Types_images/Chart-Types_img75.png) +![ASPNETMVC_Chart_ErrorBarImages](Chart-Types_images/Chart-Types_img75.png) [Click](http://mvc.syncfusion.com/demos/web/chart/errorbar) here to view the ErrorBar Chart online demo sample. @@ -2501,7 +2499,7 @@ You can change the error bar rendering type using **Type** *(like FixedValue, Pe {% endhighlight %} -![](Chart-Types_images/Chart-Types_img76.png) +![ASPNETMVC_Chart_ErrorImages](Chart-Types_images/Chart-Types_img76.png) #### Customizing error bar type @@ -2530,7 +2528,7 @@ To customize the error bar type, set error bar Type as **Custom** and then chang {% endhighlight %} -![](Chart-Types_images/Chart-Types_img77.png) +![ASPNETMVC_Chart_ErrorBar_TypesImages](Chart-Types_images/Chart-Types_img77.png) ### Changing Error Bar Mode @@ -2555,7 +2553,7 @@ Error bar mode is used to define whether the error bar line has to be drawn *Hor {% endhighlight %} -![](Chart-Types_images/Chart-Types_img78.png) +![ASPNETMVC_Chart_ErrorBar_ModeImages](Chart-Types_images/Chart-Types_img78.png) ### Changing Error Bar Direction @@ -2579,7 +2577,7 @@ You can change the error bar direction to plus, minus or both side using ErrorBa {% endhighlight %} -![](Chart-Types_images/Chart-Types_img79.png) +![ASPNETMVC_Chart_ErrorBar_DirectionImages](Chart-Types_images/Chart-Types_img79.png) ### Customizing Error bar cap @@ -2607,7 +2605,7 @@ To customize the errorBar cap visibility, length, width and fill color, you can {% endhighlight %} -![](Chart-Types_images/Chart-Types_img80.png) +![ASPNETMVC_Chart_ErrorBar_CapImages](Chart-Types_images/Chart-Types_img80.png) ## Box and Whisker Chart @@ -2638,7 +2636,7 @@ To render a Box and Whisker Chart, set the series *type* as **BoxAndWhisker** .B {% endhighlight %} -![](Chart-Types_images/Chart-Types_img90.png) +![ASPNETMVC_Chart_WhikerImages](Chart-Types_images/Chart-Types_img90.png) ### BoxPlotMode @@ -2678,7 +2676,7 @@ Box and Whisker *showMedian* property is used to show the box and whisker averag {% endhighlight %} -![](Chart-Types_images/Chart-Types_img91.png) +![ASPNETMVC_Chart_BoxPlot_ModeImages](Chart-Types_images/Chart-Types_img91.png) ### Customize the Outlier @@ -2699,7 +2697,7 @@ Outlier symbol, width and height can be customized using outlierSettings through {% endhighlight %} -![](Chart-Types_images/Chart-Types_img92.png) +![ASPNETMVC_Chart_OutlierImages](Chart-Types_images/Chart-Types_img92.png) [Click](http://mvc.syncfusion.com/demos/web/chart/boxandwhisker) here to view the Box and Whisker Chart online demo sample. @@ -2729,7 +2727,7 @@ sr.Points(pt => {% endhighlight %} -![](Chart-Types_images/Chart-Types_img93.png) +![ASPNETMVC_Chart_PieImages](Chart-Types_images/Chart-Types_img93.png) [Click](http://mvc.syncfusion.com/demos/web/chart/pieofpie) here to view the Pie Of Pie Chart online demo sample. @@ -2757,7 +2755,7 @@ The points to be displayed in the second pie is decided based on the `splitMode` {% endhighlight %} -![](Chart-Types_images/Chart-Types_img94.png) +![ASPNETMVC_Chart_SplitModeImages](Chart-Types_images/Chart-Types_img94.png) ### Changing Pie Of Pie Size The size of the second Pie can be customized by using the `PieOfPieCoefficient` property. The default value of pieOfPieCoefficient is **0.6**.Its value ranges from 0 to 1. @@ -2778,7 +2776,7 @@ The size of the second Pie can be customized by using the `PieOfPieCoefficient` The following screenshot represents the pie of pie series with pieOfPieCoefficient as 1 -![](Chart-Types_images/Chart-Types_img95.png) +![ASPNETMVC_Chart_PieSizeImages](Chart-Types_images/Chart-Types_img95.png) #### Customizing the Gap @@ -2799,7 +2797,7 @@ The distance between the two pies in the pie of pie chart can be controlled by u {% endhighlight %} -![](Chart-Types_images/Chart-Types_img96.png) +![ASPNETMVC_Chart_Gap_TypesImages](Chart-Types_images/Chart-Types_img96.png) diff --git a/aspnetmvc/Gantt/Serial-Number.md b/aspnetmvc/Gantt/Serial-Number.md index e053738be..c2b7c40d3 100644 --- a/aspnetmvc/Gantt/Serial-Number.md +++ b/aspnetmvc/Gantt/Serial-Number.md @@ -1,15 +1,13 @@ --- layout: post title: Sequencing Tasks | Gantt | ASP.NET MVC | Syncfusion -description: sequencing tasks +description: Learn here all about Sequencing Tasks support in Syncfusion Essential Studio ASP.NET MVC Gantt Control, its elements, and more. platform: ejmvc control: Gantt documentation: ug --- -# Sequencing Tasks - -## How to enable serial number column in Gantt? +# Sequencing Tasks in ASP.NET MVC Gantt The serial or sequence number support in Gantt is used to index the tasks in a project. The Serial number column can be rendered by enabling the `EnableSerialNumber` property. On enabling this property the serial number column will be displayed and the Task Id column will be hidden, the tasks will be identified using the serial numbers. Further the column values for task predecessors will also be displayed using the serial numbers of the corresponding tasks, instead of task IDs. @@ -27,6 +25,6 @@ Code snippets for enabling the serial number is as follows. The following screenshot displays the Serial number column in Gantt control. -![](Serial-Number_images/Serial_img1.png) +![ASPNETMVC_Gantt_Serial-Numberimages](Serial-Number_images/Serial_img1.png) The serial number column will be resequenced automatically on performing any actions which will change the row indexes of the tasks such as row drag and drop, deleting, adding. diff --git a/aspnetmvc/Grid/Columns.md b/aspnetmvc/Grid/Columns.md index 7d6197639..f356fe1eb 100644 --- a/aspnetmvc/Grid/Columns.md +++ b/aspnetmvc/Grid/Columns.md @@ -1,13 +1,13 @@ --- layout: post title: Columns | Grid | ASP.NET MVC | Syncfusion -description: columns +description: Learn here all about Columns support in Syncfusion Essential Studio ASP.NET MVC Grid Control, its elements, and more. platform: ejmvc control: Grid documentation: ug --- -# Columns +# Columns Support in ASP.NET MVC Grid Column definitions are used as the DataSource schema in the grid and it plays vital role in rendering the column values in required format and sorting, filtering, editing based on its type. The `Field` property of the columns is necessary to map the datasource values in grid columns. @@ -48,7 +48,7 @@ The columns are automatically generated when `Columns` declaration is empty or u The following output is displayed as a result of the above code example. -![](columns_images/columns_img1.png) +![ASPNETMVC_Grid_columnsimages](columns_images/columns_img1.png) ### How to set the `IsPrimaryKey` for auto generated columns when editing is enabled: @@ -192,7 +192,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img2.png) +![ASPNETMVC_Grid_HeaderTextimages](columns_images/columns_img2.png) ### Header Text alignment @@ -241,7 +241,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img3.png) +![ASPNETMVC_Grid_HeaderText_Alignmentimages](columns_images/columns_img3.png) ### Header Template @@ -294,7 +294,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img4.png) +![ASPNETMVC_Grid_Header_templateimages](columns_images/columns_img4.png) ## Text alignment @@ -345,7 +345,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img5.png) +![ASPNETMVC_Grid_TextAlignmentimages](columns_images/columns_img5.png) ## Format @@ -389,7 +389,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img6.png) +![ASPNETMVC_Grid_Formatimages](columns_images/columns_img6.png) ## Width @@ -431,7 +431,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img7.png) +![ASPNETMVC_Grid_Widthimages](columns_images/columns_img7.png) ## Resizing @@ -547,7 +547,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img8.png) +![ASPNETMVC_Grid_Resizingimages](columns_images/columns_img8.png) ## Reorder @@ -591,7 +591,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img10.png) +![ASPNETMVC_Grid_Reorderimages](columns_images/columns_img10.png) ## Visibility @@ -633,7 +633,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img11.png) +![ASPNETMVC_Grid_visibilityimages](columns_images/columns_img11.png) ## Unbound Column @@ -689,7 +689,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img13.png) +![ASPNETMVC_Grid_Unbound_columnsimages](columns_images/columns_img13.png) ## Column Template @@ -738,7 +738,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img14.png) +![ASPNETMVC_Grid_columns_templateimages](columns_images/columns_img14.png) ## Controlling Grid actions @@ -825,7 +825,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img15.png) +![ASPNETMVC_Grid_gridimages](columns_images/columns_img15.png) ## Expression Column @@ -872,7 +872,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img16.png) +![ASPNETMVC_Grid_Expression_columnsimages](columns_images/columns_img16.png) ## Command Column @@ -947,7 +947,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img17.png) +![ASPNETMVC_Grid_Buttonimages](columns_images/columns_img17.png) ### Custom buttons @@ -1012,7 +1012,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img18.png) +![ASPNETMVC_Grid_custom_buttonimages](columns_images/columns_img18.png) ## Column Chooser @@ -1055,7 +1055,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img19.png) +![ASPNETMVC_Grid_columns_chooserimages](columns_images/columns_img19.png) ## Foreign Key Column @@ -1110,7 +1110,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img20.png) +![ASPNETMVC_Grid_key_columnsimages](columns_images/columns_img20.png) ## Customize column @@ -1168,7 +1168,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img23.png) +![ASPNETMVC_Grid_columnsimages](columns_images/columns_img23.png) ## Type @@ -1257,7 +1257,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](columns_images/columns_img24.png) +![ASPNETMVC_Grid_Typeimages](columns_images/columns_img24.png) ## Column Layout @@ -1302,4 +1302,4 @@ You can set the Grid's columns layout based on either Grid width or its columns The following output is displayed as a result of the above code example. -![](columns_images/columns_img25.png) \ No newline at end of file +![ASPNETMVC_Grid_columns_layoutimages](columns_images/columns_img25.png) \ No newline at end of file diff --git a/aspnetmvc/Grid/Editing.md b/aspnetmvc/Grid/Editing.md index 1af826dce..d5d9cf9fd 100644 --- a/aspnetmvc/Grid/Editing.md +++ b/aspnetmvc/Grid/Editing.md @@ -6,7 +6,7 @@ platform: ejmvc control: Grid documentation: ug --- -# Editing +# Editing Support in ASP.NET MVC Grid The grid control has support for dynamic insertion, updating and deletion of records. You can start the edit action either by double clicking the particular row or by selecting the required row and clicking on Edit icon in toolbar. Similarly, you can add new record to grid either by clicking on insert icon in toolbar or on an external button which is bound to call `addRecord` method of grid. `Save` and `Cancel` while on edit mode is possible using respective toolbar icon in grid. @@ -71,7 +71,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img1.png) +![ASPNETMVC_Grid_Editingimages](Editing_images/Editing_img1.png) ## Cell edit type and its edit options @@ -168,7 +168,7 @@ The following code example describes the above behavior The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img2.png) +![ASPNETMVC_Grid_EditTypeimages](Editing_images/Editing_img2.png) ## Cell Edit Template @@ -251,7 +251,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img3.png) +![ASPNETMVC_Grid_Edit_Templateimages](Editing_images/Editing_img3.png) ## Edit Modes @@ -313,7 +313,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img4.png) +![ASPNETMVC_Grid_Edit_Modeimages](Editing_images/Editing_img4.png) ### Inline Form @@ -369,7 +369,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img5.png) +![ASPNETMVC_Grid_Inline_Formimages](Editing_images/Editing_img5.png) ### Inline Template Form @@ -479,11 +479,11 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img6.png) +![ASPNETMVC_Grid_Inline_Templateimages](Editing_images/Editing_img6.png) Before the template elements are converted to JS controls -![](Editing_images/Editing_img7.png) +![ASPNETMVC_Grid_Editingimages](Editing_images/Editing_img7.png) After the template elements are converted to JS controls using actionComplete event. @@ -543,7 +543,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img8.png) +![ASPNETMVC_Grid_Dialogimages](Editing_images/Editing_img8.png) ### Dialog Template Form @@ -650,11 +650,11 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img9.png) +![ASPNETMVC_Grid_Dialog_Modeimages](Editing_images/Editing_img9.png) Before the template elements are converted to JS controls -![](Editing_images/Editing_img10.png) +![ASPNETMVC_Grid_Dialogimages](Editing_images/Editing_img10.png) After the template elements are converted to JS controls using actionComplete event. @@ -715,7 +715,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img11.png) +![ASPNETMVC_Grid_External_Formimages](Editing_images/Editing_img11.png) Form Position: @@ -778,7 +778,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img12.png) +![ASPNETMVC_Grid_Form_Positionimages](Editing_images/Editing_img12.png) ### External Template Form @@ -884,11 +884,11 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img13.png) +![ASPNETMVC_Grid_Editing_Templateimages](Editing_images/Editing_img13.png) Before the template elements are converted to JS controls -![](Editing_images/Editing_img14.png) +![ASPNETMVC_Grid_Editing_template_formimages](Editing_images/Editing_img14.png) After the template elements are converted to JS controls using actionComplete event. @@ -952,7 +952,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img15.png) +![ASPNETMVC_Grid_Excel_likeimages](Editing_images/Editing_img15.png) ## Confirmation messages @@ -1013,7 +1013,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img16.png) +![ASPNETMVC_Grid_Confirmationimages](Editing_images/Editing_img16.png) To show delete confirm dialog while deleting a record, set `ShowDeleteConfirmDialog` as true. @@ -1073,7 +1073,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img17.png) +![ASPNETMVC_Grid_Confirm_Dialogimages](Editing_images/Editing_img17.png) ## Column Validation @@ -1215,7 +1215,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img18.png) +![ASPNETMVC_Grid_Editingimages](Editing_images/Editing_img18.png) N> 1. Refer this [Knowledge Base link](https://www.syncfusion.com/kb/6817/how-to-perform-server-side-validation-in-grid) to perform server side validation in Grid. @@ -1295,7 +1295,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img19.png) +![ASPNETMVC_Grid_Custom_Validationimages](Editing_images/Editing_img19.png) ## Persisting data in Server @@ -1383,7 +1383,7 @@ The grid actions (sorting, filtering, paging, searching, and aggregates) details Please refer the below screen shot. -![](Editing_images/Editing_img20.png) +![ASPNETMVC_Grid_Sortingimages](Editing_images/Editing_img20.png) Also, using 'DataOperations' helper class you can perform grid action at server side. The in-built methods that we have provided in the DataOperations class are listed below. @@ -1562,7 +1562,7 @@ The following code example describes the above behavior. The newly added record details are bound to the 'value' parameter. Please refer the below image. -![](Editing_images/Editing_img21.png) +![ASPNETMVC_Grid_Insertimages](Editing_images/Editing_img21.png) ### Update Record: @@ -1583,7 +1583,7 @@ public ActionResult Update(EditableOrder value) The updated record details are bound to the 'value' parameter. Please refer the below image. -![](Editing_images/Editing_img22.png) +![ASPNETMVC_Grid_Update_Recordimages](Editing_images/Editing_img22.png) ### Delete Record: @@ -1604,7 +1604,7 @@ public ActionResult Remove(int key) The deleted record primary key value is bound to the 'key' parameter. Please refer the below image. -![](Editing_images/Editing_img23.png) +![ASPNETMVC_Grid_Delete_Recordimages](Editing_images/Editing_img23.png) ### CRUD URL: @@ -1662,7 +1662,7 @@ The following code example describes the above behavior. Please refer the below image to know about the action parameter -![](Editing_images/Editing_img24.png) +![ASPNETMVC_Grid_CRUDimages](Editing_images/Editing_img24.png) N> If you specify `InsertURL` along with `CrudURL` then while adding `InsertURL` only called. @@ -1724,7 +1724,7 @@ The following code example describes the above behavior. Please refer the below image for more information about batch parameters -![](Editing_images/Editing_img25.png) +![ASPNETMVC_Grid_Batchimages](Editing_images/Editing_img25.png) ### Performing CRUD Operation on ODataV4 Adaptor @@ -1810,7 +1810,7 @@ The following code example describes the above behavior. Please refer the below image. -![](Editing_images/Editing_img31.png) +![ASPNETMVC_Grid_Insert_RecordImage](Editing_images/Editing_img31.png) Here the newly added record details are bound to the ‘order’ parameter. @@ -1835,7 +1835,7 @@ The following code example describes the above behavior. Please refer the below image. -![](Editing_images/Editing_img32.png) +![ASPNETMVC_Grid_Recordimages](Editing_images/Editing_img32.png) Here the modified row data will be obtained in the order parameter. @@ -1865,13 +1865,13 @@ The following code example describes the above behavior. Please refer the below image. -![](Editing_images/Editing_img33.png) +![ASPNETMVC_Grid_Delete_Recordimages](Editing_images/Editing_img33.png) The deleted record primary key value is bound to the ‘key’ parameter. Please refer the below image. -![](Editing_images/Editing_img34.png) +![ASPNETMVC_Grid_Deleteimages](Editing_images/Editing_img34.png) ## Adding New Row Position @@ -1929,7 +1929,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img26.png) +![ASPNETMVC_Grid_Positionimages](Editing_images/Editing_img26.png) ## Render with blank row for easy add new @@ -1989,7 +1989,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img27.png) +![ASPNETMVC_Grid_Blank_Rowimages](Editing_images/Editing_img27.png) N> 1. If it is remote, then the newly added record is placed based on the index from current view data. N> 2. If it is local, then the newly added record is added at the top of the page even if the added new `RowPosition` is mentioned as "Bottom". @@ -2050,7 +2050,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![](Editing_images/Editing_img28.png) +![ASPNETMVC_Grid_Column_Valuesimages](Editing_images/Editing_img28.png) diff --git a/aspnetmvc/Grid/Exporting.md b/aspnetmvc/Grid/Exporting.md index 539597bdb..cfd26e7ca 100644 --- a/aspnetmvc/Grid/Exporting.md +++ b/aspnetmvc/Grid/Exporting.md @@ -1,13 +1,13 @@ --- layout: post title: Exporting | Grid | ASP.NET MVC | Syncfusion -description: exporting +description: Learn here all about Exporting support in Syncfusion Essential Studio ASP.NET MVC Grid Control, its elements, and more. platform: ejmvc control: Grid documentation: ug --- -# Exporting +# Exporting Support in ASP.NET MVC Grid The `Exporting` feature provides support to export Grid data into excel, word and PDF files. To export the grid, the `export` JavaScript method should be called with export action as parameter. To make it work from grid tool bar the `ExcelExport`, `WordExport` and `PdfExport` toolbar items needs to be added in grid tool bar using the `ToolbarItems` property of `ToolbarSettings` which are used to perform exporting. When you click the toolbar exporting icon, it internally invokes the `export` public method of grid object to export. The code sample for this is as follows. @@ -1692,7 +1692,7 @@ The background color of the alternative row of the grid content. {% endtabs %} -![](Exporting_images/Customizing-Themes_img2.png) +![ASPNETMVC_Grid_Exportingimages](Exporting_images/Customizing-Themes_img2.png) ## Exporting server events @@ -1860,7 +1860,7 @@ You can customize the particular cell or particular row of exporting files usin {% endtabs %} -![](Exporting_images/Exporting_Serverside_Event.png) +![ASPNETMVC_Grid_Exporting_server_eventsImage](Exporting_images/Exporting_Serverside_Event.png) diff --git a/aspnetmvc/Grid/Responsive.md b/aspnetmvc/Grid/Responsive.md index 245818b76..41b660902 100644 --- a/aspnetmvc/Grid/Responsive.md +++ b/aspnetmvc/Grid/Responsive.md @@ -1,13 +1,13 @@ --- layout: post title: Responsive with Grid widget for Syncfusion EJMVC -description: How to set the grid, responsive to screen resolutions +description: Learn here all about Responsive support in Syncfusion Essential Studio ASP.NET MVC Grid Control, its elements, and more. platform: ejmvc control: Grid documentation: ug --- -# Responsive +# Responsive in ASP.NET MVC Grid The Grid control has support for responsive behavior based on the client browser's width and height. To enable responsive, the `IsResponsive` property should be true. In Desktop and Tablet mode, to render scroller set `MinWidth` property. There are three modes of responsive layout is available in grid based on client width. They are. @@ -69,7 +69,7 @@ Enabling responsive row makes the grid to render the record values in vertical o {% endtabs %} -![](Responsive_images/Responsive_img1.png) +![ASPNETMVC_Grid_Responsiveimages](Responsive_images/Responsive_img1.png) W> IE8 and IE9 does not support responsive row. The `ejgrid.responsive.css` should be referred to display responsive row. @@ -78,31 +78,31 @@ W> IE8 and IE9 does not support responsive row. The `ejgrid.responsive.css` shou The customized layout for filtering, sorting, searching and CRUD operations in mobile device can be seen in the following screen shots. -![](Responsive_images/Responsive_img2.png) +![ASPNETMVC_Grid_Featuresimages](Responsive_images/Responsive_img2.png) {:caption} Responsive row with filtering , sorting and searching -![](Responsive_images/Responsive_img3.png) +![ASPNETMVC_Grid_Row_Filteringimages](Responsive_images/Responsive_img3.png) {:caption} CRUD in mobile layout -![](Responsive_images/Responsive_img4.png) +![ASPNETMVC_Grid_CRUDimages](Responsive_images/Responsive_img4.png) {:caption} Filtering in mobile layout -![](Responsive_images/Responsive_img5.png) +![ASPNETMVC_Grid_Filtering_in_mobile_layoutimages](Responsive_images/Responsive_img5.png) {:caption} Filtering in mobile layout -![](Responsive_images/Responsive_img6.png) +![ASPNETMVC_Grid_Filtering_in_mobile_layoutimages](Responsive_images/Responsive_img6.png) {:caption} Sorting in mobile layout -![](Responsive_images/Responsive_img7.png) +![ASPNETMVC_Grid_Sorting_in_mobile_layoutimages](Responsive_images/Responsive_img7.png) {:caption} Searching in mobile layout @@ -211,12 +211,12 @@ If the client width is between 321px and 800px, then the grid will render in tab {% endhighlight %} {% endtabs %} -![](Responsive_images/Responsive_img8.png) +![ASPNETMVC_Grid_Tablet_layoutimages](Responsive_images/Responsive_img8.png) {:caption} Default tab layout -![](Responsive_images/Responsive_img9.png) +![ASPNETMVC_Grid_Default_tab_layoutimages](Responsive_images/Responsive_img9.png) {:caption} Filtering design in tab layout. diff --git a/aspnetmvc/ListBox/Multiple-Selection.md b/aspnetmvc/ListBox/Multiple-Selection.md index a0ceec5b6..5173e7b51 100644 --- a/aspnetmvc/ListBox/Multiple-Selection.md +++ b/aspnetmvc/ListBox/Multiple-Selection.md @@ -1,15 +1,13 @@ --- layout: post title: Multiple Selection | ListBox | ASP.NET MVC | Syncfusion -description: multiple selection +description: Learn here all about Multiple Selection support in Syncfusion Essential Studio ASP.NET MVC ListBox Control, its elements, and more. platform: ejmvc control: ListBox documentation: ug --- -# Multiple Selection - -## Allow multiple selection +# Multiple Selection in ASP.NET MVC ListBox ListBox widget allows you to select multiple values from the list Items using AllowMultiSelection property. You can select multiple list items along with Control key and Shift key press. To select multiple values we need to set AllowMultiSelection value to true. @@ -57,7 +55,7 @@ The following steps explain you the configuration of the AllowMultiSelection for 2. Output for ListBox control that provides multiple selection is as follows. - ![](Multiple-Selection_images/Multiple-Selection_img1.png) + ![ASPNETMVC_ListBox_AllowMultiple-Selectionimages](Multiple-Selection_images/Multiple-Selection_img1.png) @@ -124,7 +122,7 @@ The following steps explains you the configuration of SelectedItemList property 2. Output of the above steps. -![](Multiple-Selection_images/Multiple-Selection_img2.png) +![ASPNETMVC_ListBox_Multiple-Selectionimages](Multiple-Selection_images/Multiple-Selection_img2.png) @@ -220,7 +218,7 @@ The following steps explains you the configuration of checkbox options in ListBo -![](Multiple-Selection_images/Multiple-Selection_img3.png) +![ASPNETMVC_ListBox_Checkboximages](Multiple-Selection_images/Multiple-Selection_img3.png) @@ -284,7 +282,7 @@ The following steps explains you the configuration of checkbox options in ListBo -![](Multiple-Selection_images/Multiple-Selection_img4.png) +![ASPNETMVC_ListBox_Check_Allimages](Multiple-Selection_images/Multiple-Selection_img4.png) diff --git a/aspnetmvc/PdfViewer/Text-Markup-Annotation.md b/aspnetmvc/PdfViewer/Text-Markup-Annotation.md index bab9adbd6..949ce4aed 100644 --- a/aspnetmvc/PdfViewer/Text-Markup-Annotation.md +++ b/aspnetmvc/PdfViewer/Text-Markup-Annotation.md @@ -7,7 +7,7 @@ control: PDF viewer documentation: ug --- -## Text Markup Annotation in ASP.NET MVC PDF Viewer +# Text Markup Annotation in ASP.NET MVC PDF Viewer The PDF viewer control supports adding text markup annotations in the PDF documents. The control also renders the existing text markup annotations from the PDF document when the document is loaded in it. From 5494c061d2b92a231ababc6b8a31a725d14cb69c Mon Sep 17 00:00:00 2001 From: gowthamanthavasiyappan <90315799+gowthamanthavasiyappan@users.noreply.github.com> Date: Wed, 12 Jan 2022 12:10:45 +0530 Subject: [PATCH 2/3] SEO-1870_Site_Audit_Issues_ASPNETMVC --- aspnetmvc/Button/Icons.md | 194 ++++++++++++------------ aspnetmvc/Chart/Chart-Types.md | 192 +++++++++++------------ aspnetmvc/Gantt/Serial-Number.md | 2 +- aspnetmvc/Grid/Columns.md | 42 ++--- aspnetmvc/Grid/Editing.md | 64 ++++---- aspnetmvc/Grid/Exporting.md | 4 +- aspnetmvc/Grid/Responsive.md | 16 +- aspnetmvc/ListBox/Multiple-Selection.md | 8 +- 8 files changed, 261 insertions(+), 261 deletions(-) diff --git a/aspnetmvc/Button/Icons.md b/aspnetmvc/Button/Icons.md index ee950f05e..dcb6cd675 100644 --- a/aspnetmvc/Button/Icons.md +++ b/aspnetmvc/Button/Icons.md @@ -45,7 +45,7 @@ Also in the button sample, you can use the icon class names as follows, Execute the above code to render the following output. -![ASPNETMVC_Button_IconsImage](Icons_images/Icons_img1.png) +![ASPNETMVC Button Icons](Icons_images/Icons_img1.png) ## List of Icons @@ -58,550 +58,550 @@ _List of icons_ e-unpin -{{'![ASPNETMVC_Button_unpinIconsImage](Icons_images/Icons_img2.png)'| markdownify }} +{{'![ASPNETMVC Button unpinIcons](Icons_images/Icons_img2.png)'| markdownify }} e-pin -{{'![ASPNETMVC_Button_pin_IconsImage](Icons_images/Icons_img3.png)'| markdownify }} +{{'![ASPNETMVC Button pin Icons](Icons_images/Icons_img3.png)'| markdownify }} e-upload -{{'![ASPNETMVC_Button_upload_IconsImage](Icons_images/Icons_img4.png)'| markdownify }} +{{'![ASPNETMVC Button upload Icons](Icons_images/Icons_img4.png)'| markdownify }} e-reload -{{'![ASPNETMVC_Button_reload_IconsImage](Icons_images/Icons_img5.png)'| markdownify }} +{{'![ASPNETMVC Button reload Icons](Icons_images/Icons_img5.png)'| markdownify }} e-collapse -{{'![ASPNETMVC_Button_collapse_IconsImage](Icons_images/Icons_img6.png)'| markdownify }} +{{'![ASPNETMVC Button collapse Icons](Icons_images/Icons_img6.png)'| markdownify }} e-cancel -{{'![ASPNETMVC_Button_cancel_IconsImage](Icons_images/Icons_img7.png)'| markdownify }} +{{'![ASPNETMVC Button cancel Icons](Icons_images/Icons_img7.png)'| markdownify }} e-expand -{{'![ASPNETMVC_Button_expand_IconsImage](Icons_images/Icons_img8.png)'| markdownify }} +{{'![ASPNETMVC Button expand Icons](Icons_images/Icons_img8.png)'| markdownify }} e-minimize -{{'![ASPNETMVC_Button_minimize_IconsImage](Icons_images/Icons_img9.png)'| markdownify }} +{{'![ASPNETMVC Button minimize Icons](Icons_images/Icons_img9.png)'| markdownify }} e-login -{{'![ASPNETMVC_Button_login_IconsImage](Icons_images/Icons_img10.png)'| markdownify }} +{{'![ASPNETMVC Button login Icons](Icons_images/Icons_img10.png)'| markdownify }} e-orientationlanscape -{{'![ASPNETMVC_Button_orientationlanscape_IconsImage](Icons_images/Icons_img11.png)'| markdownify }} +{{'![ASPNETMVC Button orientationlanscape Icons](Icons_images/Icons_img11.png)'| markdownify }} e-alignleft -{{'![ASPNETMVC_Button_alignleft_IconsImage](Icons_images/Icons_img12.png)'| markdownify }} +{{'![ASPNETMVC Button alignleft Icons](Icons_images/Icons_img12.png)'| markdownify }} e-aligncenter -{{'![ASPNETMVC_Button_aligncenter_IconsImage](Icons_images/Icons_img13.png)'| markdownify }} +{{'![ASPNETMVC Button aligncenter Icons](Icons_images/Icons_img13.png)'| markdownify }} e-alignright -{{'![ASPNETMVC_Button_alignright_IconsImage](Icons_images/Icons_img14.png)'| markdownify }} +{{'![ASPNETMVC Button alignright Icons](Icons_images/Icons_img14.png)'| markdownify }} e-alignjustify -{{'![ASPNETMVC_Button_alignjustify_IconsImage](Icons_images/Icons_img15.png)'| markdownify }} +{{'![ASPNETMVC Button alignjustify Icons](Icons_images/Icons_img15.png)'| markdownify }} e-alignnone -{{'![ASPNETMVC_Button_alignnone_IconsImage](Icons_images/Icons_img16.png)'| markdownify }} +{{'![ASPNETMVC Button alignnone Icons](Icons_images/Icons_img16.png)'| markdownify }} e-filterset -{{'![ASPNETMVC_Button_filterset_IconsImage](Icons_images/Icons_img17.png)'| markdownify }} +{{'![ASPNETMVC Button filterset Icons](Icons_images/Icons_img17.png)'| markdownify }} e-filternone -{{'![ASPNETMVC_Button_filternone_IconsImage](Icons_images/Icons_img18.png)'| markdownify }} +{{'![ASPNETMVC Button filternone Icons](Icons_images/Icons_img18.png)'| markdownify }} e-arrowheadup-2x -{{'![ASPNETMVC_Button_arrowheadup_IconsImage](Icons_images/Icons_img19.png)'| markdownify }} +{{'![ASPNETMVC Button arrowheadup Icons](Icons_images/Icons_img19.png)'| markdownify }} e-arrowheaddown-2x -{{'![ASPNETMVC_Button_arrowheaddown_IconsImage](Icons_images/Icons_img20.png)'| markdownify }} +{{'![ASPNETMVC Button arrowheaddown Icons](Icons_images/Icons_img20.png)'| markdownify }} e-arrowheadleft-2x -{{'![ASPNETMVC_Button_arrowheadleft_IconsImage](Icons_images/Icons_img21.png)'| markdownify }} +{{'![ASPNETMVC Button arrowheadleft Icons](Icons_images/Icons_img21.png)'| markdownify }} e-arrowheadright-2x -{{'![ASPNETMVC_Button_arrowheadright_IconsImage](Icons_images/Icons_img22.png)'| markdownify }} +{{'![ASPNETMVC Button arrowheadright Icons](Icons_images/Icons_img22.png)'| markdownify }} e-numbering -{{'![ASPNETMVC_Button_numbering_IconsImage](Icons_images/Icons_img23.png)'| markdownify }} +{{'![ASPNETMVC Button numbering Icons](Icons_images/Icons_img23.png)'| markdownify }} e-bullets -{{'![ASPNETMVC_Button_bullets_IconsImage](Icons_images/Icons_img24.png)'| markdownify }} +{{'![ASPNETMVC Button bullets Icons](Icons_images/Icons_img24.png)'| markdownify }} e-maximize -{{'![ASPNETMVC_Button_maximize_IconsImage](Icons_images/Icons_img25.png)'| markdownify }} +{{'![ASPNETMVC Button maximize Icons](Icons_images/Icons_img25.png)'| markdownify }} e-delete -{{'![ASPNETMVC_Button_delete_IconsImage](Icons_images/Icons_img26.png)'| markdownify }} +{{'![ASPNETMVC Button delete Icons](Icons_images/Icons_img26.png)'| markdownify }} e-scroll -{{'![ASPNETMVC_Button_scroll_IconsImage](Icons_images/Icons_img27.png)'| markdownify }} +{{'![ASPNETMVC Button scroll Icons](Icons_images/Icons_img27.png)'| markdownify }} e-right-scroll -{{'![ASPNETMVC_Button_right_IconsImage](Icons_images/Icons_img28.png)'| markdownify }} +{{'![ASPNETMVC Button right Icons](Icons_images/Icons_img28.png)'| markdownify }} e-search -{{'![ASPNETMVC_Button_search_IconsImage](Icons_images/Icons_img29.png)'| markdownify }} +{{'![ASPNETMVC Button search Icons](Icons_images/Icons_img29.png)'| markdownify }} e-mediaback -{{'![ASPNETMVC_Button_mediaback_IconsImage](Icons_images/Icons_img30.png)'| markdownify }} +{{'![ASPNETMVC Button mediaback Icons](Icons_images/Icons_img30.png)'| markdownify }} e-mediaforward -{{'![ASPNETMVC_Button_mediaforward_IconsImage](Icons_images/Icons_img31.png)'| markdownify }} +{{'![ASPNETMVC Button mediaforward Icons](Icons_images/Icons_img31.png)'| markdownify }} e-medianext -{{'![ASPNETMVC_Button_medianext_IconsImage](Icons_images/Icons_img32.png)'| markdownify }} +{{'![ASPNETMVC Button medianext Icons](Icons_images/Icons_img32.png)'| markdownify }} e-mediaprev -{{'![ASPNETMVC_Button_mediaprev_IconsImage](Icons_images/Icons_img33.png)'| markdownify }} +{{'![ASPNETMVC Button mediaprev Icons](Icons_images/Icons_img33.png)'| markdownify }} e-mediaeject -{{'![ASPNETMVC_Button_mediaeject_IconsImage](Icons_images/Icons_img34.png)'| markdownify }} +{{'![ASPNETMVC Button mediaeject Icons](Icons_images/Icons_img34.png)'| markdownify }} e-mediaclose -{{'![ASPNETMVC_Button_mediaclose_IconsImage](Icons_images/Icons_img35.png)'| markdownify }} +{{'![ASPNETMVC Button mediaclose Icons](Icons_images/Icons_img35.png)'| markdownify }} e-mediapause -{{'![ASPNETMVC_Button_mediapause_IconsImage](Icons_images/Icons_img36.png)'| markdownify }} +{{'![ASPNETMVC Button mediapause Icons](Icons_images/Icons_img36.png)'| markdownify }} e-mediaplay -{{'![ASPNETMVC_Button_mediaplay_IconsImage](Icons_images/Icons_img37.png)'| markdownify }} +{{'![ASPNETMVC Button mediaplay Icons](Icons_images/Icons_img37.png)'| markdownify }} e-righttick -{{'![ASPNETMVC_Button_righttick_IconsImage](Icons_images/Icons_img38.png)'| markdownify }} +{{'![ASPNETMVC Button righttick Icons](Icons_images/Icons_img38.png)'| markdownify }} e-smile -{{'![ASPNETMVC_Button_smile_IconsImage](Icons_images/Icons_img39.png)'| markdownify }} +{{'![ASPNETMVC Button smile Icons](Icons_images/Icons_img39.png)'| markdownify }} e-information -{{'![ASPNETMVC_Button_information_IconsImage](Icons_images/Icons_img40.png)'| markdownify }} +{{'![ASPNETMVC Button information Icons](Icons_images/Icons_img40.png)'| markdownify }} e-left-arrow -{{'![ASPNETMVC_Button_left_IconsImage](Icons_images/Icons_img41.png)'| markdownify }} +{{'![ASPNETMVC Button left Icons](Icons_images/Icons_img41.png)'| markdownify }} e-right-arrow -{{'![ASPNETMVC_Button_right_IconsImage](Icons_images/Icons_img42.png)'| markdownify }} +{{'![ASPNETMVC Button right Icons](Icons_images/Icons_img42.png)'| markdownify }} e-file-delete -{{'![ASPNETMVC_Button_delete_IconsImage](Icons_images/Icons_img43.png)'| markdownify }} +{{'![ASPNETMVC Button delete Icons](Icons_images/Icons_img43.png)'| markdownify }} e-file-percentage-success -{{'![ASPNETMVC_Button_percentage_IconsImage](Icons_images/Icons_img44.png)'| markdownify }} +{{'![ASPNETMVC Button percentage Icons](Icons_images/Icons_img44.png)'| markdownify }} e-file-cancel -{{'![ASPNETMVC_Button_file_IconsImage](Icons_images/Icons_img45.png)'| markdownify }} +{{'![ASPNETMVC Button file cancel Icons](Icons_images/Icons_img45.png)'| markdownify }} e-file-percentage-failed -{{'![ASPNETMVC_Button_file_IconsImage](Icons_images/Icons_img46.png)'| markdownify }} +{{'![ASPNETMVC Button file percentage Icons](Icons_images/Icons_img46.png)'| markdownify }} e-file-retry -{{'![ASPNETMVC_Button_file_IconsImage](Icons_images/Icons_img47.png)'| markdownify }} +{{'![ASPNETMVC Button file retry Icons](Icons_images/Icons_img47.png)'| markdownify }} e-resize-handle -{{'![ASPNETMVC_Button_resize_IconsImage](Icons_images/Icons_img48.png)'| markdownify }} +{{'![ASPNETMVC Button resize Icons](Icons_images/Icons_img48.png)'| markdownify }} e-down-arrow -{{'![ASPNETMVC_Button_down-arrow_IconsImage](Icons_images/Icons_img49.png)'| markdownify }} +{{'![ASPNETMVC Button down arrow Icons](Icons_images/Icons_img49.png)'| markdownify }} e-time -{{'![ASPNETMVC_Button_time_IconsImage](Icons_images/Icons_img50.png)'| markdownify }} +{{'![ASPNETMVC Button time Icons](Icons_images/Icons_img50.png)'| markdownify }} e-up-arrow -{{'![ASPNETMVC_Button_up-arrow_IconsImage](Icons_images/Icons_img51.png)'| markdownify }} +{{'![ASPNETMVC Button up arrow Icons](Icons_images/Icons_img51.png)'| markdownify }} e-date -{{'![ASPNETMVC_Button_date_IconsImage](Icons_images/Icons_img52.png)'| markdownify }} +{{'![ASPNETMVC Button date Icons](Icons_images/Icons_img52.png)'| markdownify }} e-datetime -{{'![ASPNETMVC_Button_datetime_IconsImage](Icons_images/Icons_img53.png)'| markdownify }} +{{'![ASPNETMVC Button datetime Icons](Icons_images/Icons_img53.png)'| markdownify }} e-collapse-arrow -{{'![ASPNETMVC_Button_collapse_IconsImage](Icons_images/Icons_img54.png)'| markdownify }} +{{'![ASPNETMVC Button collapse Icons](Icons_images/Icons_img54.png)'| markdownify }} e-expand-arrow -{{'![ASPNETMVC_Button_expand_IconsImage](Icons_images/Icons_img55.png)'| markdownify }} +{{'![ASPNETMVC Button expand Icons](Icons_images/Icons_img55.png)'| markdownify }} e-restore -{{'![ASPNETMVC_Button_restore_IconsImage](Icons_images/Icons_img56.png)'| markdownify }} +{{'![ASPNETMVC Button restore Icons](Icons_images/Icons_img56.png)'| markdownify }} e-plus -{{'![ASPNETMVC_Button_plus_IconsImage](Icons_images/Icons_img57.png)'| markdownify }} +{{'![ASPNETMVC Button plus Icons](Icons_images/Icons_img57.png)'| markdownify }} e-minus -{{'![ASPNETMVC_Button_minus_IconsImage](Icons_images/Icons_img58.png)'| markdownify }} +{{'![ASPNETMVC Button minus Icons](Icons_images/Icons_img58.png)'| markdownify }} e-handup -{{'![ASPNETMVC_Button_handup_IconsImage](Icons_images/Icons_img59.png)'| markdownify }} +{{'![ASPNETMVC Button handup Icons](Icons_images/Icons_img59.png)'| markdownify }} e-clock -{{'![ASPNETMVC_Button_clock_IconsImage](Icons_images/Icons_img60.png)'| markdownify }} +{{'![ASPNETMVC Button clock Icons](Icons_images/Icons_img60.png)'| markdownify }} e-cursor -{{'![ASPNETMVC_Button_cursor_IconsImage](Icons_images/Icons_img61.png)'| markdownify }} +{{'![ASPNETMVC Button cursor Icons](Icons_images/Icons_img61.png)'| markdownify }} e-hyperlink -{{'![ASPNETMVC_Button_hyperlink_IconsImage](Icons_images/Icons_img62.png)'| markdownify }} +{{'![ASPNETMVC Button hyperlink Icons](Icons_images/Icons_img62.png)'| markdownify }} e-hyperlinkbreak -{{'![ASPNETMVC_Button_hyperlinkbreak_IconsImage](Icons_images/Icons_img63.png)'| markdownify }} +{{'![ASPNETMVC Button hyperlinkbreak Icons](Icons_images/Icons_img63.png)'| markdownify }} e-settings -{{'![ASPNETMVC_Button_settings_IconsImage](Icons_images/Icons_img64.png)'| markdownify }} +{{'![ASPNETMVC Button settings Icons](Icons_images/Icons_img64.png)'| markdownify }} e-shoppingcart -{{'![ASPNETMVC_Button_shoppingcart_IconsImage](Icons_images/Icons_img65.png)'| markdownify }} +{{'![ASPNETMVC Button shoppingcart Icons](Icons_images/Icons_img65.png)'| markdownify }} e-palette -{{'![ASPNETMVC_Button_palette_IconsImage](Icons_images/Icons_img66.png)'| markdownify }} +{{'![ASPNETMVC Button palette Icons](Icons_images/Icons_img66.png)'| markdownify }} e-warningmessage -{{'![ASPNETMVC_Button_warningmessage_IconsImage](Icons_images/Icons_img67.png)'| markdownify }} +{{'![ASPNETMVC Button warningmessage Icons](Icons_images/Icons_img67.png)'| markdownify }} e-cut -{{'![ASPNETMVC_Button_cut_IconsImage](Icons_images/Icons_img68.png)'| markdownify }} +{{'![ASPNETMVC Button cut Icons](Icons_images/Icons_img68.png)'| markdownify }} e-copy -{{'![ASPNETMVC_Button_copy_IconsImage](Icons_images/Icons_img69.png)'| markdownify }} +{{'![ASPNETMVC Button copy Icons](Icons_images/Icons_img69.png)'| markdownify }} e-paste -{{'![ASPNETMVC_Button_paste_IconsImage](Icons_images/Icons_img70.png)'| markdownify }} +{{'![ASPNETMVC Button paste Icons](Icons_images/Icons_img70.png)'| markdownify }} e-edit -{{'![ASPNETMVC_Button_edit_IconsImage](Icons_images/Icons_img71.png)'| markdownify }} +{{'![ASPNETMVC Button edit Icons](Icons_images/Icons_img71.png)'| markdownify }} e-swapleft -{{'![ASPNETMVC_Button_swapleft_IconsImage](Icons_images/Icons_img72.png)'| markdownify }} +{{'![ASPNETMVC Button swapleft Icons](Icons_images/Icons_img72.png)'| markdownify }} e-swapright -{{'![ASPNETMVC_Button_swapright_IconsImage](Icons_images/Icons_img73.png)'| markdownify }} +{{'![ASPNETMVC Button swapright Icons](Icons_images/Icons_img73.png)'| markdownify }} e-swapup -{{'![ASPNETMVC_Button_swapup_IconsImage](Icons_images/Icons_img74.png)'| markdownify }} +{{'![ASPNETMVC Button swapup Icons](Icons_images/Icons_img74.png)'| markdownify }} e-swapdown -{{'![ASPNETMVC_Button_swapdown_IconsImage](Icons_images/Icons_img75.png)'| markdownify }} +{{'![ASPNETMVC Button swapdown Icons](Icons_images/Icons_img75.png)'| markdownify }} e-zoomin -{{'![ASPNETMVC_Button_zoomin_IconsImage](Icons_images/Icons_img76.png)'| markdownify }} +{{'![ASPNETMVC Button zoomin Icons](Icons_images/Icons_img76.png)'| markdownify }} e-zoomout -{{'![ASPNETMVC_Button_zoomout_IconsImage](Icons_images/Icons_img77.png)'| markdownify }} +{{'![ASPNETMVC Button zoomout Icons](Icons_images/Icons_img77.png)'| markdownify }} e-star -{{'![ASPNETMVC_Button_star_IconsImage](Icons_images/Icons_img78.png)'| markdownify }} +{{'![ASPNETMVC Button star Icons](Icons_images/Icons_img78.png)'| markdownify }} e-home -{{'![ASPNETMVC_Button_home_IconsImage](Icons_images/Icons_img79.png)'| markdownify }} +{{'![ASPNETMVC Button home Icons](Icons_images/Icons_img79.png)'| markdownify }} e-clipboard -{{'![ASPNETMVC_Button_clipboard_IconsImage](Icons_images/Icons_img80.png)'| markdownify }} +{{'![ASPNETMVC Button clipboard Icons](Icons_images/Icons_img80.png)'| markdownify }} e-userlogin -{{'![ASPNETMVC_Button_userlogin_IconsImage](Icons_images/Icons_img81.png)'| markdownify }} +{{'![ASPNETMVC Button userlogin Icons](Icons_images/Icons_img81.png)'| markdownify }} e-dataexport -{{'![ASPNETMVC_Button_dataexport_IconsImage](Icons_images/Icons_img82.png)'| markdownify }} +{{'![ASPNETMVC Button dataexport Icons](Icons_images/Icons_img82.png)'| markdownify }} e-arrowheadright -{{'![ASPNETMVC_Button_arrowheadright_IconsImage](Icons_images/Icons_img83.png)'| markdownify }} +{{'![ASPNETMVC Button arrowheadright Icons](Icons_images/Icons_img83.png)'| markdownify }} e-arrowheaddown -{{'![ASPNETMVC_Button_arrowheaddown_IconsImage](Icons_images/Icons_img84.png)'| markdownify }} +{{'![ASPNETMVC Button arrowheaddown Icons](Icons_images/Icons_img84.png)'| markdownify }} e-undo -{{'![ASPNETMVC_Button_undo_IconsImage](Icons_images/Icons_img85.png)'| markdownify }} +{{'![ASPNETMVC Button undo Icons](Icons_images/Icons_img85.png)'| markdownify }} e-redo -{{'![ASPNETMVC_Button_redo_IconsImage](Icons_images/Icons_img86.png)'| markdownify }} +{{'![ASPNETMVC Button redo Icons](Icons_images/Icons_img86.png)'| markdownify }} e-bold -{{'![ASPNETMVC_Button_bold_IconsImage](Icons_images/Icons_img87.png)'| markdownify }} +{{'![ASPNETMVC Button bold Icons](Icons_images/Icons_img87.png)'| markdownify }} e-italic -{{'![ASPNETMVC_Button_italic_IconsImage](Icons_images/Icons_img88.png)'| markdownify }} +{{'![ASPNETMVC Button italic Icons](Icons_images/Icons_img88.png)'| markdownify }} e-underline -{{'![ASPNETMVC_Button_underline_IconsImage](Icons_images/Icons_img89.png)'| markdownify }} +{{'![ASPNETMVC Button underline Icons](Icons_images/Icons_img89.png)'| markdownify }} e-strikethrough -{{'![ASPNETMVC_Button_strikethrough_IconsImage](Icons_images/Icons_img90.png)'| markdownify }} +{{'![ASPNETMVC Button strikethrough Icons](Icons_images/Icons_img90.png)'| markdownify }} e-font -{{'![ASPNETMVC_Button_font_IconsImage](Icons_images/Icons_img91.png)'| markdownify }} +{{'![ASPNETMVC Button font Icons](Icons_images/Icons_img91.png)'| markdownify }} e-rarrowdown -{{'![ASPNETMVC_Button_arrowdown_IconsImage](Icons_images/Icons_img92.png)'| markdownify }} +{{'![ASPNETMVC Button arrowdown Icons](Icons_images/Icons_img92.png)'| markdownify }} e-rarrowleft -{{'![ASPNETMVC_Button_arrowleft_IconsImage](Icons_images/Icons_img93.png)'| markdownify }} +{{'![ASPNETMVC Button arrowleft Icons](Icons_images/Icons_img93.png)'| markdownify }} e-rarrowup -{{'![ASPNETMVC_Button_arrowup_IconsImage](Icons_images/Icons_img94.png)'| markdownify }} +{{'![ASPNETMVC Button arrowup Icons](Icons_images/Icons_img94.png)'| markdownify }} e-rarrowright -{{'![ASPNETMVC_Button_erarrowright_IconsImage](Icons_images/Icons_img95.png)'| markdownify }} +{{'![ASPNETMVC Button erarrowright Icons](Icons_images/Icons_img95.png)'| markdownify }} e-calender -{{'![ASPNETMVC_Button_calender_IconsImage](Icons_images/Icons_img96.png)'| markdownify }} +{{'![ASPNETMVC Button calender Icons](Icons_images/Icons_img96.png)'| markdownify }} e-save -{{'![ASPNETMVC_Button_save_IconsImage](Icons_images/Icons_img97.png)'| markdownify }} +{{'![ASPNETMVC Button save Icons](Icons_images/Icons_img97.png)'| markdownify }} diff --git a/aspnetmvc/Chart/Chart-Types.md b/aspnetmvc/Chart/Chart-Types.md index d0992aa99..73b72f620 100644 --- a/aspnetmvc/Chart/Chart-Types.md +++ b/aspnetmvc/Chart/Chart-Types.md @@ -29,7 +29,7 @@ To render a Line Chart, set the series **Type** as **Line** in the chart series. {% endhighlight %} -![ASPNETMVC_Chart_TypesImages](Chart-Types_images/Chart-Types_img1.png) +![ASPNETMVC Chart Types](Chart-Types_images/Chart-Types_img1.png) [Click](http://mvc.syncfusion.com/demos/web/chart/default) here to view the Line Chart online demo sample. @@ -57,7 +57,7 @@ To change the width of the line segment, you can use the **Width** property in t {% endhighlight %} -![ASPNETMVC_Chart_LineWidthImages](Chart-Types_images/Chart-Types_img2.png) +![ASPNETMVC Chart Line Width](Chart-Types_images/Chart-Types_img2.png) ### Dashed lines @@ -81,7 +81,7 @@ To render the line series with dotted lines, you can use the **DashArray** optio {% endhighlight %} -![ASPNETMVC_Chart_DashedLinesImages](Chart-Types_images/Chart-Types_img3.png) +![ASPNETMVC Chart Dashed Lines](Chart-Types_images/Chart-Types_img3.png) ### Changing the line cap @@ -107,7 +107,7 @@ For customizing the start and end caps of the line segment, you can use the **Li {% endhighlight %} -![ASPNETMVC_Chart_LineCapImages](Chart-Types_images/Chart-Types_img4.png) +![ASPNETMVC Chart Line Cap](Chart-Types_images/Chart-Types_img4.png) ### Changing the line join @@ -134,7 +134,7 @@ You can use the **LineJoin** property to specify how two intersecting line segme {% endhighlight %} -![ASPNETMVC_Chart_LineImages](Chart-Types_images/Chart-Types_img5.png) +![ASPNETMVC Chart Line](Chart-Types_images/Chart-Types_img5.png) ### MultiColor Line @@ -158,7 +158,7 @@ You can change the color of the line segments by using the *Fill* property of th {% endhighlight %} -![ASPNETMVC_Chart_MulticolorImages](Chart-Types_images/Chart-Types_img81.png) +![ASPNETMVC Chart Multi color](Chart-Types_images/Chart-Types_img81.png) [Click](http://mvc.syncfusion.com/demos/web/chart/multicolor) here to view the MultiColor Line Chart online demo sample. @@ -185,7 +185,7 @@ To render a Step Line Chart, set the series Type as **StepLine"** in the chart s {% endhighlight %} -![ASPNETMVC_Chart_StepLineImages](Chart-Types_images/Chart-Types_img6.png) +![ASPNETMVC Chart StepLine](Chart-Types_images/Chart-Types_img6.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stepline) here to view the Step Line Chart online demo sample. @@ -211,7 +211,7 @@ To change the line width, you can use the **Width** property. {% endhighlight %} -![ASPNETMVC_Chart_Line_widthImages](Chart-Types_images/Chart-Types_img7.png) +![ASPNETMVC Chart Line width](Chart-Types_images/Chart-Types_img7.png) ### Dashed lines @@ -235,7 +235,7 @@ To render the step line series with dotted lines, you can use the DashArray opti {% endhighlight %} -![ASPNETMVC_Chart_DashedLineImages](Chart-Types_images/Chart-Types_img8.png) +![ASPNETMVC Chart Dashed Line](Chart-Types_images/Chart-Types_img8.png) ### Changing the line cap @@ -261,7 +261,7 @@ For customizing the start and end caps of the line segment, you can use the Line {% endhighlight %} -![ASPNETMVC_Chart_LineCapImages](Chart-Types_images/Chart-Types_img9.png) +![ASPNETMVC Chart Line Cap](Chart-Types_images/Chart-Types_img9.png) ### Changing the line join @@ -288,7 +288,7 @@ You can use the LineJoin property to specify how two intersecting line segments {% endhighlight %} -![ASPNETMVC_Chart_TypesImages](Chart-Types_images/Chart-Types_img10.png) +![ASPNETMVC Chart Types](Chart-Types_images/Chart-Types_img10.png) ## Area Chart @@ -314,7 +314,7 @@ To render an Area chart, you can specify the series Type as **Area** in the char {% endhighlight %} -![ASPNETMVC_Chart_AreaImages](Chart-Types_images/Chart-Types_img11.png) +![ASPNETMVC Chart Area](Chart-Types_images/Chart-Types_img11.png) [Click](http://mvc.syncfusion.com/demos/web/chart/area) here to view the Area Chart online demo. @@ -354,7 +354,7 @@ Since the RangeArea series requires two y values for a point, you have to add th {% endhighlight %} -![ASPNETMVC_Chart_RangeAreaImages](Chart-Types_images/Chart-Types_img12.png) +![ASPNETMVC Chart Range Area](Chart-Types_images/Chart-Types_img12.png) [Click](http://mvc.syncfusion.com/demos/web/chart/rangearea) here to view Range Area Chart online demo. @@ -384,7 +384,7 @@ To render a Step Area Chart, set the Type as **StepArea** in the chart series. T {% endhighlight %} -![ASPNETMVC_Chart_StepAreaImages](Chart-Types_images/Chart-Types_img13.png) +![ASPNETMVC Chart Step Area](Chart-Types_images/Chart-Types_img13.png) [Click](http://mvc.syncfusion.com/demos/web/chart/steparea) here to view Step Area Chart online demo. @@ -415,7 +415,7 @@ To render a Spline Area Chart, set the Type as **SplineArea** in the chart serie {% endhighlight %} -![ASPNETMVC_Chart_SplineAreaImages](Chart-Types_images/Chart-Types_img14.png) +![ASPNETMVC Chart Spline Area](Chart-Types_images/Chart-Types_img14.png) [Click](http://mvc.syncfusion.com/demos/web/chart/splinearea) here to view Spline Area Chart online demo. @@ -445,7 +445,7 @@ To render a Stacked Area Chart, set the Type as **StackingArea** in the chart se {% endhighlight %} -![ASPNETMVC_Chart_StackedAreaImages](Chart-Types_images/Chart-Types_img15.png) +![ASPNETMVC Chart Stacked Area](Chart-Types_images/Chart-Types_img15.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingarea) here to view Stacked Area Chart online demo. @@ -476,7 +476,7 @@ To render a 100% Stacked Area Chart, set the Type as **StackingArea100** in the {% endhighlight %} -![ASPNETMVC_Chart_StackedAreaImages](Chart-Types_images/Chart-Types_img16.png) +![ASPNETMVC Chart Stacked Area](Chart-Types_images/Chart-Types_img16.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingarea100) here to view 100% Stacked Area Chart online demo. @@ -507,7 +507,7 @@ To render a Column Chart, set the Type as **Column** in the chart series. To cha {% endhighlight %} -![ASPNETMVC_Chart_ColumnChartImages](Chart-Types_images/Chart-Types_img17.png) +![ASPNETMVC Chart Column Chart](Chart-Types_images/Chart-Types_img17.png) [Click](http://mvc.syncfusion.com/demos/web/chart/column) here to view Column Chart demo. @@ -537,7 +537,7 @@ You can change the color of a column by using the Fill property of the point. {% endhighlight %} -![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img18.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img18.png) ### Column width customization @@ -560,7 +560,7 @@ N> Width of a column also depends upon the *ColumnSpacing* property, because *Co {% endhighlight %} -![ASPNETMVC_Chart_ColumnWidthImages](Chart-Types_images/Chart-Types_img88.png) +![ASPNETMVC Chart Column Width](Chart-Types_images/Chart-Types_img88.png) ### Column with rounded corners Corners of the column chart can be customized by setting value to the **CornerRadius** property. @@ -573,7 +573,7 @@ Corners of the column chart can be customized by setting value to the **CornerRa {% endhighlight %} -![ASPNETMVC_Chart_RoundedImages](Chart-Types_images/Chart-Types_img90.png) +![ASPNETMVC Chart Rounded](Chart-Types_images/Chart-Types_img90.png) ### Spacing between column series @@ -596,7 +596,7 @@ N> Space between columns will also affect the width of the column. For example, {% endhighlight %} -![ASPNETMVC_Chart_ColumnSeriesImages](Chart-Types_images/Chart-Types_img89.png) +![ASPNETMVC Chart Column Series](Chart-Types_images/Chart-Types_img89.png) ### Cylindrical Chart @@ -625,7 +625,7 @@ The following chart types can be rendered as cylinder in both 2D and in 3D view. {% endhighlight %} -![ASPNETMVC_Chart_CylindricalImages](Chart-Types_images/Chart-Types_img91.png) +![ASPNETMVC Chart Cylindrical](Chart-Types_images/Chart-Types_img91.png) ## RangeColumn Chart @@ -660,7 +660,7 @@ Since, the RangeColumn series requires two y values for a point, add the High an {% endhighlight %} -![ASPNETMVC_Chart_RangeColumnImages](Chart-Types_images/Chart-Types_img19.png) +![ASPNETMVC Chart Range Column](Chart-Types_images/Chart-Types_img19.png) [Click](http://mvc.syncfusion.com/demos/web/chart/rangecolumn) here to view Range Column Chart online demo. @@ -689,7 +689,7 @@ To change the color of a range column, you can use the Fill property of point. {% endhighlight %} -![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img20.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img20.png) ## Stacked Column Chart @@ -717,7 +717,7 @@ To render a Stacked Column Chart, set the Type as **StackingColumn** in the char {% endhighlight %} -![ASPNETMVC_Chart_StackedColumnImages](Chart-Types_images/Chart-Types_img21.png) +![ASPNETMVC Chart Stacked Column](Chart-Types_images/Chart-Types_img21.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingcolumn) here to view Stacked Column Chart online demo. @@ -751,7 +751,7 @@ You can use the **StackingGroup** property to group the stacked columns. Columns {% endhighlight %} -![ASPNETMVC_Chart_ClusterImages](Chart-Types_images/Chart-Types_img22.png) +![ASPNETMVC Chart Cluster](Chart-Types_images/Chart-Types_img22.png) ### Change a point color @@ -778,7 +778,7 @@ To change the color of a stacking column, you can use the Fill property of the p {% endhighlight %} -![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img23.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img23.png) ## 100% Stacked Column Chart @@ -804,7 +804,7 @@ To render a 100% Stacked Column Chart, set the Type as **StackingColumn100** in {% endhighlight %} -![ASPNETMVC_Chart_StackedImages](Chart-Types_images/Chart-Types_img24.png) +![ASPNETMVC Chart Stacked](Chart-Types_images/Chart-Types_img24.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingcolumn100) here to view 100% Stacked Column Chart online demo. @@ -839,7 +839,7 @@ By using the **StackingGroup** property, you can group the 100% stacking columns {% endhighlight %} -![ASPNETMVC_Chart_ClusterImages](Chart-Types_images/Chart-Types_img25.png) +![ASPNETMVC Chart Cluster](Chart-Types_images/Chart-Types_img25.png) ### Change a point color @@ -865,7 +865,7 @@ To change the color of a 100% stacking column, you can use the Fill property of {% endhighlight %} -![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img26.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img26.png) ## Bar Chart @@ -893,7 +893,7 @@ To render a bar Chart, set the Type as **Bar** in the chart series. To change th {% endhighlight %} -![ASPNETMVC_Chart_PointColorImagesImages](Chart-Types_images/Chart-Types_img27.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img27.png) [Click](http://mvc.syncfusion.com/demos/web/chart/bar) here to view Bar Chart demo. @@ -923,7 +923,7 @@ By using the Fill property of the point, you can change the specific point of th {% endhighlight %} -![ASPNETMVC_Chart_BarColorImages](Chart-Types_images/Chart-Types_img28.png) +![ASPNETMVC Chart Bar Color](Chart-Types_images/Chart-Types_img28.png) ## Stacked Bar Chart @@ -951,7 +951,7 @@ To render a Stacked Bar Chart, set the Type as **StackingBar** in the chart seri {% endhighlight %} -![ASPNETMVC_Chart_StackedBarImages](Chart-Types_images/Chart-Types_img29.png) +![ASPNETMVC Chart Stacked Bar](Chart-Types_images/Chart-Types_img29.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingbar) here to view Stacked Bar Chart online demo. @@ -986,7 +986,7 @@ You can use the **StackingGroup** property to group the stacking bars with the s {% endhighlight %} -![ASPNETMVC_Chart_ClusterImages](Chart-Types_images/Chart-Types_img30.png) +![ASPNETMVC Chart Cluster](Chart-Types_images/Chart-Types_img30.png) ### Change a point color @@ -1013,7 +1013,7 @@ You can change the color of a stacking bar by using the Fill property of the poi {% endhighlight %} -![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img31.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img31.png) ## 100% Stacked Bar Chart @@ -1041,7 +1041,7 @@ To render a 100% Stacked Bar Chart, set the Type as **StackingBar100** in the ch {% endhighlight %} -![ASPNETMVC_Chart_StackedBarimages](Chart-Types_images/Chart-Types_img32.png) +![ASPNETMVC Chart Stacked Bar](Chart-Types_images/Chart-Types_img32.png) [Click](http://mvc.syncfusion.com/demos/web/chart/stackingbar100) here to view 100% Stacked Bar Chart online demo. @@ -1071,7 +1071,7 @@ By using the StackingGroup property, you can group the 100% stacking bars with t {% endhighlight %} -![ASPNETMVC_Chart_StackingGroupImages](Chart-Types_images/Chart-Types_img33.png) +![ASPNETMVC Chart Stacking Group](Chart-Types_images/Chart-Types_img33.png) ### Change a point color @@ -1098,7 +1098,7 @@ To change the color of a 100% stacking bar, you can use the Fill property of the {% endhighlight %} -![ASPNETMVC_Chart_PointColorImages](Chart-Types_images/Chart-Types_img34.png) +![ASPNETMVC Chart Point Color](Chart-Types_images/Chart-Types_img34.png) ## Spline Chart @@ -1125,7 +1125,7 @@ To render a Spline Chart, set the Type as **Spline** in the chart series. To cha {% endhighlight %} -![ASPNETMVC_Chart_SplineImages](Chart-Types_images/Chart-Types_img35.png) +![ASPNETMVC Chart Spline](Chart-Types_images/Chart-Types_img35.png) [Click](http://mvc.syncfusion.com/demos/web/chart/spline) here to view the Spline Chart online demo sample. @@ -1156,7 +1156,7 @@ To change the spline segment width, you can use the Width property of the series {% endhighlight %} -![ASPNETMVC_Chart_SplineChartImages](Chart-Types_images/Chart-Types_img36.png) +![ASPNETMVC Chart Spline Chart](Chart-Types_images/Chart-Types_img36.png) ### Dashed lines @@ -1184,7 +1184,7 @@ To render the spline series with dotted lines, you can use the DashArray option {% endhighlight %} -![ASPNETMVC_Chart_DashedLinesImages](Chart-Types_images/Chart-Types_img37.png) +![ASPNETMVC Chart Dashed Lines](Chart-Types_images/Chart-Types_img37.png) ## Pie Chart @@ -1213,7 +1213,7 @@ You can create a pie chart by setting the series Type as **Pie** in the chart se {% endhighlight %} -![ASPNETMVC_Chart_PieImages](Chart-Types_images/Chart-Types_img38.png) +![ASPNETMVC Chart Pie](Chart-Types_images/Chart-Types_img38.png) [Click](http://mvc.syncfusion.com/demos/web/chart/pie) here to view the Pie chart online demo sample. @@ -1244,7 +1244,7 @@ You can use the **PieCoefficient** property to change the diameter of the Pie ch {% endhighlight %} -![ASPNETMVC_Chart_PieSizeImages](Chart-Types_images/Chart-Types_img39.png) +![ASPNETMVC Chart Pie Size](Chart-Types_images/Chart-Types_img39.png) ### Explode a pie segment @@ -1272,7 +1272,7 @@ You can explode a pie segment on the chart load by using the **ExplodeIndex** of {% endhighlight %} -![ASPNETMVC_Chart_PieSegmentImages](Chart-Types_images/Chart-Types_img40.png) +![ASPNETMVC Chart Pie Segment](Chart-Types_images/Chart-Types_img40.png) ### Explode all the segments @@ -1300,7 +1300,7 @@ To explode all the segments of the Pie chart, you can enable the **ExplodeAll** {% endhighlight %} -![ASPNETMVC_Chart_SegmentsImages](Chart-Types_images/Chart-Types_img41.png) +![ASPNETMVC Chart Segments](Chart-Types_images/Chart-Types_img41.png) ### Explode a pie segment on mouse over @@ -1328,7 +1328,7 @@ To explode a pie segment on a mouse over, you can enable the **Explode** propert {% endhighlight %} -![ASPNETMVC_Chart_MouseOverImages](Chart-Types_images/Chart-Types_img42.png) +![ASPNETMVC Chart Mouse Over](Chart-Types_images/Chart-Types_img42.png) ### Sector of Pie @@ -1356,7 +1356,7 @@ EjChart allows you to render all the data points/segments in the semi-pie, quart {% endhighlight %} -![ASPNETMVC_Chart_SectorPieImages](Chart-Types_images/Chart-Types_img43.png) +![ASPNETMVC Chart Sector Pie](Chart-Types_images/Chart-Types_img43.png) [Click](http://mvc.syncfusion.com/demos/web/chart/semipie) here to view the Semi Pie Chart online demo sample. @@ -1388,7 +1388,7 @@ To create a Doughnut chart, you can specify the series Type as **Doughnut** in t {% endhighlight %} -![ASPNETMVC_Chart_DoughnutImages](Chart-Types_images/Chart-Types_img44.png) +![ASPNETMVC Chart Doughnut](Chart-Types_images/Chart-Types_img44.png) [Click](http://mvc.syncfusion.com/demos/web/chart/doughnut) here to view the Doughnut Chart online demo sample. @@ -1418,7 +1418,7 @@ You can change the doughnut chart inner radius by using the **DoughnutCoefficien {% endhighlight %} -![ASPNETMVC_Chart_InnerradiusImages](Chart-Types_images/Chart-Types_img45.png) +![ASPNETMVC Chart Inner radius](Chart-Types_images/Chart-Types_img45.png) ### Change the doughnut size @@ -1446,7 +1446,7 @@ You can use the **DoughnutSize** property to change the diameter of the Doughnut {% endhighlight %} -![ASPNETMVC_Chart_doughnutsizeImages](Chart-Types_images/Chart-Types_img46.png) +![ASPNETMVC Chart doughnut size](Chart-Types_images/Chart-Types_img46.png) ### Explode a doughnut segment @@ -1474,7 +1474,7 @@ To explode a specific doughnut segment, set the index to be exploded by using th {% endhighlight %} -![ASPNETMVC_Chart_doughnutImages](Chart-Types_images/Chart-Types_img47.png) +![ASPNETMVC Chart doughnut](Chart-Types_images/Chart-Types_img47.png) ### Explode all the segments @@ -1502,7 +1502,7 @@ To explode all the segments, you can enable the **ExplodeAll** property of the s {% endhighlight %} -![ASPNETMVC_Chart_SegmentImages](Chart-Types_images/Chart-Types_img48.png) +![ASPNETMVC Chart Segment](Chart-Types_images/Chart-Types_img48.png) ### Explode a doughnut segment on mouse over @@ -1530,7 +1530,7 @@ To explode a doughnut segment on a mouse over, you can enable the **Explode** pr {% endhighlight %} -![ASPNETMVC_Chart_MouseOverImages](Chart-Types_images/Chart-Types_img49.png) +![ASPNETMVC Chart Mouse Over](Chart-Types_images/Chart-Types_img49.png) ### Sector of Doughnut @@ -1559,7 +1559,7 @@ EjChart allows you to render all the data points/segments in the semi-doughnut, {% endhighlight %} -![ASPNETMVC_Chart_DoughNut_SegmentImages](Chart-Types_images/Chart-Types_img50.png) +![ASPNETMVC Chart DoughNut Segment](Chart-Types_images/Chart-Types_img50.png) [Click](http://mvc.syncfusion.com/demos/web/chart/semipie) here to view the Semi Doughnut Chart online demo sample. @@ -1592,12 +1592,12 @@ EjChart provides support to render more than one series in pie and in doughnut c **Multiple Pie** -![ASPNETMVC_Chart_MultiplePieImages](Chart-Types_images/Chart-Types_img82.png) +![ASPNETMVC Chart Multiple Pie](Chart-Types_images/Chart-Types_img82.png) **Multiple Doughnut** -![ASPNETMVC_Chart_Multiple_DoughNutImages](Chart-Types_images/Chart-Types_img83.png) +![ASPNETMVC Chart Multiple DoughNut](Chart-Types_images/Chart-Types_img83.png) [Click](http://mvc.syncfusion.com/demos/web/chart/multiplepie) here to view the Multiple Pie chart online demo sample. @@ -1608,12 +1608,12 @@ In the Multiple Pie chart, the start and end angle property is also supported. **Sector of Multiple Pie** -![](Chart-Types_images/Chart-Types_img84.png) +![ASPNETMVC Chart Start and End Angle Support](Chart-Types_images/Chart-Types_img84.png) **Sector of Multiple Doughnut** -![ASPNETMVC_Chart_AngleImages](Chart-Types_images/Chart-Types_img85.png) +![ASPNETMVC Chart Angle](Chart-Types_images/Chart-Types_img85.png) ## Pyramid Chart @@ -1641,7 +1641,7 @@ To create a Pyramid chart, you can specify the series Type as **Pyramid** in the {% endhighlight %} -![ASPNETMVC_Chart_PyramidImages](Chart-Types_images/Chart-Types_img51.png) +![ASPNETMVC Chart Pyramid](Chart-Types_images/Chart-Types_img51.png) [Click](http://mvc.syncfusion.com/demos/web/chart/pyramid) here to view the Pyramid Chart online demo sample. @@ -1671,7 +1671,7 @@ Pyramid mode has two types, *Linear* and *Surface* respectively. The default **P {% endhighlight %} -![ASPNETMVC_Chart_PyramidModeImages](Chart-Types_images/Chart-Types_img52.png) +![ASPNETMVC Chart Pyramid Mode](Chart-Types_images/Chart-Types_img52.png) ### Gap between the segments @@ -1698,7 +1698,7 @@ You can control the gap between the segments by using the **GapRatio** option of {% endhighlight %} -![ASPNETMVC_Chart_SegmentsImages](Chart-Types_images/Chart-Types_img53.png) +![ASPNETMVC Chart Segments](Chart-Types_images/Chart-Types_img53.png) ### Explode a pyramid segment @@ -1726,7 +1726,7 @@ You can explode a pyramid segment on the chart load by using the **ExplodeIndex* {% endhighlight %} -![ASPNETMVC_Chart_PyramidImages](Chart-Types_images/Chart-Types_img54.png) +![ASPNETMVC Chart Pyramid](Chart-Types_images/Chart-Types_img54.png) ## Funnel Chart @@ -1754,7 +1754,7 @@ You can create a funnel chart by setting the series Type as **Funnel** in the ch {% endhighlight %} -![ASPNETMVC_Chart_FunnelImages](Chart-Types_images/Chart-Types_img55.png) +![ASPNETMVC Chart Funnel](Chart-Types_images/Chart-Types_img55.png) [Click](http://mvc.syncfusion.com/demos/web/chart/funnel) here to view the Funnel Chart online demo sample. @@ -1785,7 +1785,7 @@ Funnel segments height and width is calculated from the chart size, by default. {% endhighlight %} -![ASPNETMVC_Chart_Funnel_widthImages](Chart-Types_images/Chart-Types_img56.png) +![ASPNETMVC Chart Funnel width](Chart-Types_images/Chart-Types_img56.png) ### Explode a funnel segment @@ -1813,7 +1813,7 @@ You can explode a funnel segment on the chart load by using the **ExplodeIndex** {% endhighlight %} -![ASPNETMVC_Chart_Funnel_SegmentImages](Chart-Types_images/Chart-Types_img57.png) +![ASPNETMVC Chart Funnel Segment](Chart-Types_images/Chart-Types_img57.png) ## Bubble Chart @@ -1859,7 +1859,7 @@ To create a Bubble chart, you can set the series Type as **Bubble** in the chart {% endhighlight %} -![ASPNETMVC_Chart_BubbleImages](Chart-Types_images/Chart-Types_img58.png) +![ASPNETMVC Chart Bubble](Chart-Types_images/Chart-Types_img58.png) [Click](http://mvc.syncfusion.com/demos/web/chart/bubble) here to view the Bubble Chart online demo sample. @@ -1889,7 +1889,7 @@ To create a Scatter chart, you can set the series Type as **Scatter** in the cha {% endhighlight %} -![ASPNETMVC_Chart_ScatterImages](Chart-Types_images/Chart-Types_img59.png) +![ASPNETMVC Chart Scatter](Chart-Types_images/Chart-Types_img59.png) [Click](http://mvc.syncfusion.com/demos/web/chart/scatter) here to view the Scatter Chart online demo sample. @@ -1920,7 +1920,7 @@ You can change the scatter size by using the **Size** property of the series mar {% endhighlight %} -![ASPNETMVC_Chart_ScatterImages](Chart-Types_images/Chart-Types_img60.png) +![ASPNETMVC Chart Scatter](Chart-Types_images/Chart-Types_img60.png) ## HiLoOpenClose Chart  @@ -1968,7 +1968,7 @@ To create a HiLoOpenClose chart, you can set the series Type as **HiloOpenClose* {% endhighlight %} -![ASPNETMVC_Chart_HiloOpenImages](Chart-Types_images/Chart-Types_img61.png) +![ASPNETMVC Chart Hilo Open](Chart-Types_images/Chart-Types_img61.png) [Click](http://mvc.syncfusion.com/demos/web/chart/hiloopenclose) here to view the HiLoOpenClose Chart online demo sample. @@ -1999,7 +1999,7 @@ You can change the HiLoOpenClose chart **DrawMode** to *Open, Close* or *Both*. {% endhighlight %} -![ASPNETMVC_Chart_DrawModeImages](Chart-Types_images/Chart-Types_img62.png) +![ASPNETMVC Chart Draw Mode](Chart-Types_images/Chart-Types_img62.png) ### Bull and Bear Color @@ -2028,7 +2028,7 @@ HiLoOpenClose chart **BullFillColor** is used to specify a fill color for the se {% endhighlight %} -![ASPNETMVC_Chart_BearColorImages](Chart-Types_images/Chart-Types_img63.png) +![ASPNETMVC Chart Bear Color](Chart-Types_images/Chart-Types_img63.png) ## Candle @@ -2077,7 +2077,7 @@ You can create a Candle chart by specifying the series Type as **Candle** in the {% endhighlight %} -![ASPNETMVC_Chart_CandleImages](Chart-Types_images/Chart-Types_img64.png) +![ASPNETMVC Chart Candle](Chart-Types_images/Chart-Types_img64.png) [Click](http://mvc.syncfusion.com/demos/web/chart/candle) here to view the Candle Chart online demo sample. @@ -2107,7 +2107,7 @@ Candle chart **BullFillColor** is used to specify a fill color for the segments {% endhighlight %} -![ASPNETMVC_Chart_BearColorImages](Chart-Types_images/Chart-Types_img65.png) +![ASPNETMVC Chart Bear Color](Chart-Types_images/Chart-Types_img65.png) ## HiLo @@ -2153,7 +2153,7 @@ HiLo chart is created by setting the series Type as **Hilo** in the chart series {% endhighlight %} -![ASPNETMVC_Chart_HiLoImages](Chart-Types_images/Chart-Types_img66.png) +![ASPNETMVC Chart HiLo](Chart-Types_images/Chart-Types_img66.png) [Click](http://mvc.syncfusion.com/demos/web/chart/hilo) here to view the HiLo Chart online demo sample. @@ -2184,7 +2184,7 @@ Polar chart is created by setting the series Type as **Polar** in the chart seri {% endhighlight %} -![ASPNETMVC_Chart_PolarImages](Chart-Types_images/Chart-Types_img67.png) +![ASPNETMVC Chart Polar](Chart-Types_images/Chart-Types_img67.png) [Click](http://mvc.syncfusion.com/demos/web/chart/polar) here to view the Polar Chart online demo sample. @@ -2215,7 +2215,7 @@ Polar **DrawType** property is used to change the series plotting type to *Line* {% endhighlight %} -![ASPNETMVC_Chart_DrawTypeImages](Chart-Types_images/Chart-Types_img68.png) +![ASPNETMVC Chart Draw Type](Chart-Types_images/Chart-Types_img68.png) ### Stack columns in Polar chart @@ -2243,7 +2243,7 @@ By using the **IsStacking** property, you can specify whether the column has to {% endhighlight %} -![ASPNETMVC_Chart_StackImages](Chart-Types_images/Chart-Types_img69.png) +![ASPNETMVC Chart Stack](Chart-Types_images/Chart-Types_img69.png) [Click](http://mvc.syncfusion.com/demos/web/chart/windrose) here to view the Polar Wind Rose Chart online demo sample. @@ -2274,7 +2274,7 @@ To create a Radar chart, you can specify the series Type as **Radar** in the cha {% endhighlight %} -![ASPNETMVC_Chart_RadarImages](Chart-Types_images/Chart-Types_img70.png) +![ASPNETMVC Chart Radar](Chart-Types_images/Chart-Types_img70.png) [Click](http://mvc.syncfusion.com/demos/web/chart/radar) here to view the Radar Chart online demo sample. @@ -2305,7 +2305,7 @@ Radar **DrawType** property is used to change the series plotting type to *Line* {% endhighlight %} -![ASPNETMVC_Chart_DrawTypesImages](Chart-Types_images/Chart-Types_img71.png) +![ASPNETMVC Chart Draw Types](Chart-Types_images/Chart-Types_img71.png) ### Stack columns in Radar chart @@ -2334,7 +2334,7 @@ By using the **IsStacking** property, you can specify whether the column has to {% endhighlight %} -![ASPNETMVC_Chart_RadarImages](Chart-Types_images/Chart-Types_img72.png) +![ASPNETMVC Chart Radar](Chart-Types_images/Chart-Types_img72.png) ## Waterfall Chart @@ -2360,7 +2360,7 @@ N> The inline property of the **Series.PositiveFill** has the first priority and {% endhighlight %} -![ASPNETMVC_Chart_WaterfallsImages](Chart-Types_images/Chart-Types_img73.png) +![ASPNETMVC Chart Water falls](Chart-Types_images/Chart-Types_img73.png) [Click](http://mvc.syncfusion.com/demos/web/chart/waterfall) here to view the Waterfall Chart online demo sample. @@ -2444,7 +2444,7 @@ To customize the connector line color, width, opacity and dashArray of the water {% endhighlight %} -![]ASPNETMVC_Chart_TypesImages(Chart-Types_images/Chart-Types_img74.png) +![ASPNETMVC Chart Types](Chart-Types_images/Chart-Types_img74.png) @@ -2471,7 +2471,7 @@ EjChart can generate Error bar for Cartesian type series *(Line, Column, Bar, Sc {% endhighlight %} -![ASPNETMVC_Chart_ErrorBarImages](Chart-Types_images/Chart-Types_img75.png) +![ASPNETMVC Chart Error Bar](Chart-Types_images/Chart-Types_img75.png) [Click](http://mvc.syncfusion.com/demos/web/chart/errorbar) here to view the ErrorBar Chart online demo sample. @@ -2499,7 +2499,7 @@ You can change the error bar rendering type using **Type** *(like FixedValue, Pe {% endhighlight %} -![ASPNETMVC_Chart_ErrorImages](Chart-Types_images/Chart-Types_img76.png) +![ASPNETMVC Chart Error](Chart-Types_images/Chart-Types_img76.png) #### Customizing error bar type @@ -2528,7 +2528,7 @@ To customize the error bar type, set error bar Type as **Custom** and then chang {% endhighlight %} -![ASPNETMVC_Chart_ErrorBar_TypesImages](Chart-Types_images/Chart-Types_img77.png) +![ASPNETMVC Chart Error Bar Types](Chart-Types_images/Chart-Types_img77.png) ### Changing Error Bar Mode @@ -2553,7 +2553,7 @@ Error bar mode is used to define whether the error bar line has to be drawn *Hor {% endhighlight %} -![ASPNETMVC_Chart_ErrorBar_ModeImages](Chart-Types_images/Chart-Types_img78.png) +![ASPNETMVC Chart Error Bar Mode](Chart-Types_images/Chart-Types_img78.png) ### Changing Error Bar Direction @@ -2577,7 +2577,7 @@ You can change the error bar direction to plus, minus or both side using ErrorBa {% endhighlight %} -![ASPNETMVC_Chart_ErrorBar_DirectionImages](Chart-Types_images/Chart-Types_img79.png) +![ASPNETMVC Chart Error Bar Direction](Chart-Types_images/Chart-Types_img79.png) ### Customizing Error bar cap @@ -2605,7 +2605,7 @@ To customize the errorBar cap visibility, length, width and fill color, you can {% endhighlight %} -![ASPNETMVC_Chart_ErrorBar_CapImages](Chart-Types_images/Chart-Types_img80.png) +![ASPNETMVC Chart Error Bar Cap](Chart-Types_images/Chart-Types_img80.png) ## Box and Whisker Chart @@ -2636,7 +2636,7 @@ To render a Box and Whisker Chart, set the series *type* as **BoxAndWhisker** .B {% endhighlight %} -![ASPNETMVC_Chart_WhikerImages](Chart-Types_images/Chart-Types_img90.png) +![ASPNETMVC Chart Whiker](Chart-Types_images/Chart-Types_img90.png) ### BoxPlotMode @@ -2676,7 +2676,7 @@ Box and Whisker *showMedian* property is used to show the box and whisker averag {% endhighlight %} -![ASPNETMVC_Chart_BoxPlot_ModeImages](Chart-Types_images/Chart-Types_img91.png) +![ASPNETMVC Chart BoxPlot Mode](Chart-Types_images/Chart-Types_img91.png) ### Customize the Outlier @@ -2697,7 +2697,7 @@ Outlier symbol, width and height can be customized using outlierSettings through {% endhighlight %} -![ASPNETMVC_Chart_OutlierImages](Chart-Types_images/Chart-Types_img92.png) +![ASPNETMVC Chart Outlier](Chart-Types_images/Chart-Types_img92.png) [Click](http://mvc.syncfusion.com/demos/web/chart/boxandwhisker) here to view the Box and Whisker Chart online demo sample. @@ -2727,7 +2727,7 @@ sr.Points(pt => {% endhighlight %} -![ASPNETMVC_Chart_PieImages](Chart-Types_images/Chart-Types_img93.png) +![ASPNETMVC Chart Pie](Chart-Types_images/Chart-Types_img93.png) [Click](http://mvc.syncfusion.com/demos/web/chart/pieofpie) here to view the Pie Of Pie Chart online demo sample. @@ -2755,7 +2755,7 @@ The points to be displayed in the second pie is decided based on the `splitMode` {% endhighlight %} -![ASPNETMVC_Chart_SplitModeImages](Chart-Types_images/Chart-Types_img94.png) +![ASPNETMVC Chart Split Mode](Chart-Types_images/Chart-Types_img94.png) ### Changing Pie Of Pie Size The size of the second Pie can be customized by using the `PieOfPieCoefficient` property. The default value of pieOfPieCoefficient is **0.6**.Its value ranges from 0 to 1. @@ -2776,7 +2776,7 @@ The size of the second Pie can be customized by using the `PieOfPieCoefficient` The following screenshot represents the pie of pie series with pieOfPieCoefficient as 1 -![ASPNETMVC_Chart_PieSizeImages](Chart-Types_images/Chart-Types_img95.png) +![ASPNETMVC Chart Pie Size](Chart-Types_images/Chart-Types_img95.png) #### Customizing the Gap @@ -2797,7 +2797,7 @@ The distance between the two pies in the pie of pie chart can be controlled by u {% endhighlight %} -![ASPNETMVC_Chart_Gap_TypesImages](Chart-Types_images/Chart-Types_img96.png) +![ASPNETMVC Chart Gap Types](Chart-Types_images/Chart-Types_img96.png) diff --git a/aspnetmvc/Gantt/Serial-Number.md b/aspnetmvc/Gantt/Serial-Number.md index c2b7c40d3..fab1f7dc3 100644 --- a/aspnetmvc/Gantt/Serial-Number.md +++ b/aspnetmvc/Gantt/Serial-Number.md @@ -25,6 +25,6 @@ Code snippets for enabling the serial number is as follows. The following screenshot displays the Serial number column in Gantt control. -![ASPNETMVC_Gantt_Serial-Numberimages](Serial-Number_images/Serial_img1.png) +![ASPNETMVC Gantt Serial Number](Serial-Number_images/Serial_img1.png) The serial number column will be resequenced automatically on performing any actions which will change the row indexes of the tasks such as row drag and drop, deleting, adding. diff --git a/aspnetmvc/Grid/Columns.md b/aspnetmvc/Grid/Columns.md index f356fe1eb..ca2847c8b 100644 --- a/aspnetmvc/Grid/Columns.md +++ b/aspnetmvc/Grid/Columns.md @@ -48,7 +48,7 @@ The columns are automatically generated when `Columns` declaration is empty or u The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_columnsimages](columns_images/columns_img1.png) +![ASPNETMVC Grid columns](columns_images/columns_img1.png) ### How to set the `IsPrimaryKey` for auto generated columns when editing is enabled: @@ -192,7 +192,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_HeaderTextimages](columns_images/columns_img2.png) +![ASPNETMVC Grid Header Text](columns_images/columns_img2.png) ### Header Text alignment @@ -241,7 +241,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_HeaderText_Alignmentimages](columns_images/columns_img3.png) +![ASPNETMVC Grid Header Text Alignment](columns_images/columns_img3.png) ### Header Template @@ -294,7 +294,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Header_templateimages](columns_images/columns_img4.png) +![ASPNETMVC Grid Header template](columns_images/columns_img4.png) ## Text alignment @@ -345,7 +345,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_TextAlignmentimages](columns_images/columns_img5.png) +![ASPNETMVC Grid Text Alignment](columns_images/columns_img5.png) ## Format @@ -389,7 +389,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Formatimages](columns_images/columns_img6.png) +![ASPNETMVC Grid Format](columns_images/columns_img6.png) ## Width @@ -431,7 +431,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Widthimages](columns_images/columns_img7.png) +![ASPNETMVC Grid Width](columns_images/columns_img7.png) ## Resizing @@ -547,7 +547,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Resizingimages](columns_images/columns_img8.png) +![ASPNETMVC Grid Resizing](columns_images/columns_img8.png) ## Reorder @@ -591,7 +591,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Reorderimages](columns_images/columns_img10.png) +![ASPNETMVC Grid Reorder](columns_images/columns_img10.png) ## Visibility @@ -633,7 +633,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_visibilityimages](columns_images/columns_img11.png) +![ASPNETMVC Grid visibility](columns_images/columns_img11.png) ## Unbound Column @@ -689,7 +689,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Unbound_columnsimages](columns_images/columns_img13.png) +![ASPNETMVC Grid Unbound columns](columns_images/columns_img13.png) ## Column Template @@ -738,7 +738,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_columns_templateimages](columns_images/columns_img14.png) +![ASPNETMVC Grid columns template](columns_images/columns_img14.png) ## Controlling Grid actions @@ -825,7 +825,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_gridimages](columns_images/columns_img15.png) +![ASPNETMVC Grid grid](columns_images/columns_img15.png) ## Expression Column @@ -872,7 +872,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Expression_columnsimages](columns_images/columns_img16.png) +![ASPNETMVC Grid Expression columns](columns_images/columns_img16.png) ## Command Column @@ -947,7 +947,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Buttonimages](columns_images/columns_img17.png) +![ASPNETMVC Grid Button](columns_images/columns_img17.png) ### Custom buttons @@ -1012,7 +1012,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_custom_buttonimages](columns_images/columns_img18.png) +![ASPNETMVC Grid custom button](columns_images/columns_img18.png) ## Column Chooser @@ -1055,7 +1055,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_columns_chooserimages](columns_images/columns_img19.png) +![ASPNETMVC Grid columns chooser](columns_images/columns_img19.png) ## Foreign Key Column @@ -1110,7 +1110,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_key_columnsimages](columns_images/columns_img20.png) +![ASPNETMVC Grid key columns](columns_images/columns_img20.png) ## Customize column @@ -1168,7 +1168,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_columnsimages](columns_images/columns_img23.png) +![ASPNETMVC Grid columns](columns_images/columns_img23.png) ## Type @@ -1257,7 +1257,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Typeimages](columns_images/columns_img24.png) +![ASPNETMVC Grid Type](columns_images/columns_img24.png) ## Column Layout @@ -1302,4 +1302,4 @@ You can set the Grid's columns layout based on either Grid width or its columns The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_columns_layoutimages](columns_images/columns_img25.png) \ No newline at end of file +![ASPNETMVC Grid columns layout](columns_images/columns_img25.png) \ No newline at end of file diff --git a/aspnetmvc/Grid/Editing.md b/aspnetmvc/Grid/Editing.md index d5d9cf9fd..ee17f5c3b 100644 --- a/aspnetmvc/Grid/Editing.md +++ b/aspnetmvc/Grid/Editing.md @@ -71,7 +71,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Editingimages](Editing_images/Editing_img1.png) +![ASPNETMVC Grid Editing](Editing_images/Editing_img1.png) ## Cell edit type and its edit options @@ -168,7 +168,7 @@ The following code example describes the above behavior The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_EditTypeimages](Editing_images/Editing_img2.png) +![ASPNETMVC Grid Edit Type](Editing_images/Editing_img2.png) ## Cell Edit Template @@ -251,7 +251,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Edit_Templateimages](Editing_images/Editing_img3.png) +![ASPNETMVC Grid Edit Template](Editing_images/Editing_img3.png) ## Edit Modes @@ -313,7 +313,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Edit_Modeimages](Editing_images/Editing_img4.png) +![ASPNETMVC Grid Edit Mode](Editing_images/Editing_img4.png) ### Inline Form @@ -369,7 +369,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Inline_Formimages](Editing_images/Editing_img5.png) +![ASPNETMVC Grid Inline Form](Editing_images/Editing_img5.png) ### Inline Template Form @@ -479,11 +479,11 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Inline_Templateimages](Editing_images/Editing_img6.png) +![ASPNETMVC Grid Inline Template](Editing_images/Editing_img6.png) Before the template elements are converted to JS controls -![ASPNETMVC_Grid_Editingimages](Editing_images/Editing_img7.png) +![ASPNETMVC Grid Editing](Editing_images/Editing_img7.png) After the template elements are converted to JS controls using actionComplete event. @@ -543,7 +543,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Dialogimages](Editing_images/Editing_img8.png) +![ASPNETMVC Grid Dialog](Editing_images/Editing_img8.png) ### Dialog Template Form @@ -650,11 +650,11 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Dialog_Modeimages](Editing_images/Editing_img9.png) +![ASPNETMVC Grid Dialog Mode](Editing_images/Editing_img9.png) Before the template elements are converted to JS controls -![ASPNETMVC_Grid_Dialogimages](Editing_images/Editing_img10.png) +![ASPNETMVC Grid Dialog](Editing_images/Editing_img10.png) After the template elements are converted to JS controls using actionComplete event. @@ -715,7 +715,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_External_Formimages](Editing_images/Editing_img11.png) +![ASPNETMVC Grid External Form](Editing_images/Editing_img11.png) Form Position: @@ -778,7 +778,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Form_Positionimages](Editing_images/Editing_img12.png) +![ASPNETMVC Grid Form Position](Editing_images/Editing_img12.png) ### External Template Form @@ -884,11 +884,11 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Editing_Templateimages](Editing_images/Editing_img13.png) +![ASPNETMVC Grid Editing Template](Editing_images/Editing_img13.png) Before the template elements are converted to JS controls -![ASPNETMVC_Grid_Editing_template_formimages](Editing_images/Editing_img14.png) +![ASPNETMVC Grid Editing template form](Editing_images/Editing_img14.png) After the template elements are converted to JS controls using actionComplete event. @@ -952,7 +952,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Excel_likeimages](Editing_images/Editing_img15.png) +![ASPNETMVC Grid Excel like](Editing_images/Editing_img15.png) ## Confirmation messages @@ -1013,7 +1013,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Confirmationimages](Editing_images/Editing_img16.png) +![ASPNETMVC Grid Confirmation](Editing_images/Editing_img16.png) To show delete confirm dialog while deleting a record, set `ShowDeleteConfirmDialog` as true. @@ -1073,7 +1073,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Confirm_Dialogimages](Editing_images/Editing_img17.png) +![ASPNETMVC Grid Confirm Dialog](Editing_images/Editing_img17.png) ## Column Validation @@ -1215,7 +1215,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Editingimages](Editing_images/Editing_img18.png) +![ASPNETMVC Grid Editing](Editing_images/Editing_img18.png) N> 1. Refer this [Knowledge Base link](https://www.syncfusion.com/kb/6817/how-to-perform-server-side-validation-in-grid) to perform server side validation in Grid. @@ -1295,7 +1295,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Custom_Validationimages](Editing_images/Editing_img19.png) +![ASPNETMVC Grid Custom Validation](Editing_images/Editing_img19.png) ## Persisting data in Server @@ -1383,7 +1383,7 @@ The grid actions (sorting, filtering, paging, searching, and aggregates) details Please refer the below screen shot. -![ASPNETMVC_Grid_Sortingimages](Editing_images/Editing_img20.png) +![ASPNETMVC Grid Sorting](Editing_images/Editing_img20.png) Also, using 'DataOperations' helper class you can perform grid action at server side. The in-built methods that we have provided in the DataOperations class are listed below. @@ -1562,7 +1562,7 @@ The following code example describes the above behavior. The newly added record details are bound to the 'value' parameter. Please refer the below image. -![ASPNETMVC_Grid_Insertimages](Editing_images/Editing_img21.png) +![ASPNETMVC Grid Insert](Editing_images/Editing_img21.png) ### Update Record: @@ -1583,7 +1583,7 @@ public ActionResult Update(EditableOrder value) The updated record details are bound to the 'value' parameter. Please refer the below image. -![ASPNETMVC_Grid_Update_Recordimages](Editing_images/Editing_img22.png) +![ASPNETMVC Grid Update Record](Editing_images/Editing_img22.png) ### Delete Record: @@ -1604,7 +1604,7 @@ public ActionResult Remove(int key) The deleted record primary key value is bound to the 'key' parameter. Please refer the below image. -![ASPNETMVC_Grid_Delete_Recordimages](Editing_images/Editing_img23.png) +![ASPNETMVC Grid Delete Record](Editing_images/Editing_img23.png) ### CRUD URL: @@ -1662,7 +1662,7 @@ The following code example describes the above behavior. Please refer the below image to know about the action parameter -![ASPNETMVC_Grid_CRUDimages](Editing_images/Editing_img24.png) +![ASPNETMVC Grid CRUD](Editing_images/Editing_img24.png) N> If you specify `InsertURL` along with `CrudURL` then while adding `InsertURL` only called. @@ -1724,7 +1724,7 @@ The following code example describes the above behavior. Please refer the below image for more information about batch parameters -![ASPNETMVC_Grid_Batchimages](Editing_images/Editing_img25.png) +![ASPNETMVC Grid Batch](Editing_images/Editing_img25.png) ### Performing CRUD Operation on ODataV4 Adaptor @@ -1810,7 +1810,7 @@ The following code example describes the above behavior. Please refer the below image. -![ASPNETMVC_Grid_Insert_RecordImage](Editing_images/Editing_img31.png) +![ASPNETMVC Grid Insert Record](Editing_images/Editing_img31.png) Here the newly added record details are bound to the ‘order’ parameter. @@ -1835,7 +1835,7 @@ The following code example describes the above behavior. Please refer the below image. -![ASPNETMVC_Grid_Recordimages](Editing_images/Editing_img32.png) +![ASPNETMVC Grid Record](Editing_images/Editing_img32.png) Here the modified row data will be obtained in the order parameter. @@ -1865,13 +1865,13 @@ The following code example describes the above behavior. Please refer the below image. -![ASPNETMVC_Grid_Delete_Recordimages](Editing_images/Editing_img33.png) +![ASPNETMVC Grid Delete Record](Editing_images/Editing_img33.png) The deleted record primary key value is bound to the ‘key’ parameter. Please refer the below image. -![ASPNETMVC_Grid_Deleteimages](Editing_images/Editing_img34.png) +![ASPNETMVC Grid Delete](Editing_images/Editing_img34.png) ## Adding New Row Position @@ -1929,7 +1929,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Positionimages](Editing_images/Editing_img26.png) +![ASPNETMVC Grid Position](Editing_images/Editing_img26.png) ## Render with blank row for easy add new @@ -1989,7 +1989,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Blank_Rowimages](Editing_images/Editing_img27.png) +![ASPNETMVC Grid Blank Row](Editing_images/Editing_img27.png) N> 1. If it is remote, then the newly added record is placed based on the index from current view data. N> 2. If it is local, then the newly added record is added at the top of the page even if the added new `RowPosition` is mentioned as "Bottom". @@ -2050,7 +2050,7 @@ The following code example describes the above behavior. The following output is displayed as a result of the above code example. -![ASPNETMVC_Grid_Column_Valuesimages](Editing_images/Editing_img28.png) +![ASPNETMVC Grid Column Values](Editing_images/Editing_img28.png) diff --git a/aspnetmvc/Grid/Exporting.md b/aspnetmvc/Grid/Exporting.md index cfd26e7ca..195e5cd7e 100644 --- a/aspnetmvc/Grid/Exporting.md +++ b/aspnetmvc/Grid/Exporting.md @@ -1692,7 +1692,7 @@ The background color of the alternative row of the grid content. {% endtabs %} -![ASPNETMVC_Grid_Exportingimages](Exporting_images/Customizing-Themes_img2.png) +![ASPNETMVC Grid Exporting](Exporting_images/Customizing-Themes_img2.png) ## Exporting server events @@ -1860,7 +1860,7 @@ You can customize the particular cell or particular row of exporting files usin {% endtabs %} -![ASPNETMVC_Grid_Exporting_server_eventsImage](Exporting_images/Exporting_Serverside_Event.png) +![ASPNETMVC Grid Exporting server events](Exporting_images/Exporting_Serverside_Event.png) diff --git a/aspnetmvc/Grid/Responsive.md b/aspnetmvc/Grid/Responsive.md index 41b660902..13d4e7491 100644 --- a/aspnetmvc/Grid/Responsive.md +++ b/aspnetmvc/Grid/Responsive.md @@ -69,7 +69,7 @@ Enabling responsive row makes the grid to render the record values in vertical o {% endtabs %} -![ASPNETMVC_Grid_Responsiveimages](Responsive_images/Responsive_img1.png) +![ASPNETMVC Grid Responsive](Responsive_images/Responsive_img1.png) W> IE8 and IE9 does not support responsive row. The `ejgrid.responsive.css` should be referred to display responsive row. @@ -82,27 +82,27 @@ The customized layout for filtering, sorting, searching and CRUD operations in m {:caption} Responsive row with filtering , sorting and searching -![ASPNETMVC_Grid_Row_Filteringimages](Responsive_images/Responsive_img3.png) +![ASPNETMVC Grid Row Filtering](Responsive_images/Responsive_img3.png) {:caption} CRUD in mobile layout -![ASPNETMVC_Grid_CRUDimages](Responsive_images/Responsive_img4.png) +![ASPNETMVC Grid CRUD](Responsive_images/Responsive_img4.png) {:caption} Filtering in mobile layout -![ASPNETMVC_Grid_Filtering_in_mobile_layoutimages](Responsive_images/Responsive_img5.png) +![ASPNETMVC Grid Filtering in mobile layout](Responsive_images/Responsive_img5.png) {:caption} Filtering in mobile layout -![ASPNETMVC_Grid_Filtering_in_mobile_layoutimages](Responsive_images/Responsive_img6.png) +![ASPNETMVC Grid Filtering in mobile layout](Responsive_images/Responsive_img6.png) {:caption} Sorting in mobile layout -![ASPNETMVC_Grid_Sorting_in_mobile_layoutimages](Responsive_images/Responsive_img7.png) +![ASPNETMVC Grid Sorting in mobile layout](Responsive_images/Responsive_img7.png) {:caption} Searching in mobile layout @@ -211,12 +211,12 @@ If the client width is between 321px and 800px, then the grid will render in tab {% endhighlight %} {% endtabs %} -![ASPNETMVC_Grid_Tablet_layoutimages](Responsive_images/Responsive_img8.png) +![ASPNETMVC Grid Tablet layout](Responsive_images/Responsive_img8.png) {:caption} Default tab layout -![ASPNETMVC_Grid_Default_tab_layoutimages](Responsive_images/Responsive_img9.png) +![ASPNETMVC Grid Default tab layout](Responsive_images/Responsive_img9.png) {:caption} Filtering design in tab layout. diff --git a/aspnetmvc/ListBox/Multiple-Selection.md b/aspnetmvc/ListBox/Multiple-Selection.md index 5173e7b51..016418268 100644 --- a/aspnetmvc/ListBox/Multiple-Selection.md +++ b/aspnetmvc/ListBox/Multiple-Selection.md @@ -55,7 +55,7 @@ The following steps explain you the configuration of the AllowMultiSelection for 2. Output for ListBox control that provides multiple selection is as follows. - ![ASPNETMVC_ListBox_AllowMultiple-Selectionimages](Multiple-Selection_images/Multiple-Selection_img1.png) + ![ASPNETMVC ListBox AllowMultiple Selection](Multiple-Selection_images/Multiple-Selection_img1.png) @@ -122,7 +122,7 @@ The following steps explains you the configuration of SelectedItemList property 2. Output of the above steps. -![ASPNETMVC_ListBox_Multiple-Selectionimages](Multiple-Selection_images/Multiple-Selection_img2.png) +![ASPNETMVC ListBox Multiple Selection](Multiple-Selection_images/Multiple-Selection_img2.png) @@ -218,7 +218,7 @@ The following steps explains you the configuration of checkbox options in ListBo -![ASPNETMVC_ListBox_Checkboximages](Multiple-Selection_images/Multiple-Selection_img3.png) +![ASPNETMVC ListBox Checkbox](Multiple-Selection_images/Multiple-Selection_img3.png) @@ -282,7 +282,7 @@ The following steps explains you the configuration of checkbox options in ListBo -![ASPNETMVC_ListBox_Check_Allimages](Multiple-Selection_images/Multiple-Selection_img4.png) +![ASPNETMVC ListBox Check All](Multiple-Selection_images/Multiple-Selection_img4.png) From 9259a9621957a83fb54809a98c3be0b581da2e76 Mon Sep 17 00:00:00 2001 From: gowthamanthavasiyappan <90315799+gowthamanthavasiyappan@users.noreply.github.com> Date: Wed, 12 Jan 2022 12:18:01 +0530 Subject: [PATCH 3/3] SEO-1870_Site_Audit_Issues_ASPNETMVC --- aspnetmvc/Grid/Responsive.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/aspnetmvc/Grid/Responsive.md b/aspnetmvc/Grid/Responsive.md index 13d4e7491..14a1efdb7 100644 --- a/aspnetmvc/Grid/Responsive.md +++ b/aspnetmvc/Grid/Responsive.md @@ -78,7 +78,7 @@ W> IE8 and IE9 does not support responsive row. The `ejgrid.responsive.css` shou The customized layout for filtering, sorting, searching and CRUD operations in mobile device can be seen in the following screen shots. -![ASPNETMVC_Grid_Featuresimages](Responsive_images/Responsive_img2.png) +![ASPNETMVC Grid Features](Responsive_images/Responsive_img2.png) {:caption} Responsive row with filtering , sorting and searching