diff --git a/js/Chart/3D-Chart.md b/js/Chart/3D-Chart.md index a52d50528..cac211db8 100644 --- a/js/Chart/3D-Chart.md +++ b/js/Chart/3D-Chart.md @@ -1,6 +1,6 @@ --- layout: post -title: 3D Chart types available in Essential JavaScript Chart +title: 3D Chart types in Essential JavaScript Chart Control | Syncfusion description: Learn about the different types of 3D charts supported by Syncfusion Essential JavaScript Chart and how to customize the 3D view. platform: js control: Chart @@ -8,8 +8,7 @@ documentation: ug api : /api/js/ejchart --- -# 3D Chart - +# 3D Chart types available in JavaScript Chart Essential 3D Chart for JavaScript allows you to view 8 chart types in 3D view such as [`Bar`](chart-types#bar-chart), [`StackingBar`](chart-types#stacked-bar-chart), [`StackingBar100`](chart-types#stacked-bar-chart-1), [`Column`](chart-types#column-chart), [`Stacked Column`](chart-types#stacked-column-chart), [`100% Stacked Column`](chart-types#stacked-column-chart-1), [`Pie`](chart-types#pie-chart), [`Doughnut`](chart-types#doughnut-chart). @@ -36,7 +35,7 @@ For rendering a 3D Column Chart, specify the series [`type`](../api/ejchart#memb {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img1.png) +![3D column chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img1.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/column) here to view the 3D Column Chart online demo sample. @@ -65,7 +64,7 @@ You can create a 3D Bar Chart by setting the series [`type`](../api/ejchart#memb {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img2.png) +![3D bar chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img2.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/bar) here to view the 3D Bar Chart online demo sample. @@ -98,7 +97,7 @@ Stacking Column 3DChart is rendered by specifying the series [`type`](../api/ejc {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img3.png) +![3D stacked column Chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img3.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/stackedcolumn) here to view the Stacked Column 3DChart online demo sample. @@ -130,7 +129,7 @@ Stacking Column 3DChart is rendered by specifying the series [`type`](../api/ejc {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img4.png) +![3D 100% stacked column Chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img4.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/100%stackedcolumn) here to view the 100% Stacked Column 3DChart online demo sample. @@ -163,7 +162,7 @@ To create Stacking Bar 3DChart, set the series [`type`](../api/ejchart#members:s {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img5.png) +![3D stacked bar Chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img5.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/stackedbar) here to view the Stacked Bar 3DChart online demo sample. @@ -195,7 +194,7 @@ You can create 100% Stacking Bar 3DChart by setting the series [`type`](../api/e {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img6.png) +![3D 100% stacked bar Chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img6.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/100%stackedbar) here to view the 100% Stacking Bar 3DChart online demo sample. @@ -223,7 +222,7 @@ To render the Pie Chart in 3D view, enable the **enbel3D** option in the chart a {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img7.png) +![3D pie chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img7.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/pie) here to view the Pie 3DChart online demo sample. @@ -251,7 +250,7 @@ To render the Doughnut Chart in 3D view, enable the **enbel3D** option in the ch {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img8.png) +![3D doughnut chart in JavaScript](/js/Chart/3D-Chart_images/3D-Chart_img8.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/doughnut) here to view the Doughnut 3DChart online demo sample. @@ -276,7 +275,7 @@ To render the EjChart in 3D view, set the [`enable3D`](../api/ejchart#members:en {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img9.png) +![3D view in JavaScript Chart](/js/Chart/3D-Chart_images/3D-Chart_img9.png) [Click](https://ej2.syncfusion.com/home/#!/azure/chart/3d/column) here to view the 3DChart online demo sample. @@ -298,7 +297,7 @@ To render the EjChart in 3D view, set the [`enable3D`](../api/ejchart#members:en {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img10.png) +![Placing bar and column kind of series side-by-side in JavaScript Chart](/js/Chart/3D-Chart_images/3D-Chart_img10.png) ### Setting Axis Wall Size @@ -318,7 +317,7 @@ In 3DChart, Cartesian axes lines are represented as walls and it defines the wid {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img11.png) +![Setting axis wall size in JavaScript Chart](/js/Chart/3D-Chart_images/3D-Chart_img11.png) ### 3D Depth @@ -338,7 +337,7 @@ By using the [`depth`](../api/ejchart#members:depth) property, you can view the {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img12.png) +![3D depth in JavaScript Chart](/js/Chart/3D-Chart_images/3D-Chart_img12.png) ### Rotating and Tilting 3D Chart @@ -366,7 +365,7 @@ To spin the 3D Chart on mouse dragging, enable [`enableRotation`](../api/ejchart {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img13.png) +![Rotating and tilting 3D chart in JavaSCript](/js/Chart/3D-Chart_images/3D-Chart_img13.png) ### PerspectiveAngle @@ -387,6 +386,6 @@ The [`perspectiveAngle`](../api/ejchart#members:perspectiveangle) specifies the {% endhighlight %} -![](/js/Chart/3D-Chart_images/3D-Chart_img14.png) +![PerspectiveAngle in JavaScript Chart](/js/Chart/3D-Chart_images/3D-Chart_img14.png) diff --git a/js/DropDownTree/Checkbox.md b/js/DropDownTree/Checkbox.md index e65b0eb2a..efe21b271 100644 --- a/js/DropDownTree/Checkbox.md +++ b/js/DropDownTree/Checkbox.md @@ -1,7 +1,7 @@ --- layout: post -title: CheckBox with DropDownTree widget for Syncfusion Essential JS -description: Describes about Checkbox functionalities in DropDownTree widget for Syncfusion Essential JS +title: Checkbox in JavaScript DropDownTree Control | Syncfusion +description: Learn here about Checkbox functionalities in Syncfusion Essential JavaScript DropDownTree Control, its elements, and more. platform: js control: DropDownTree documentation: ug @@ -9,7 +9,7 @@ keywords: Checkbox, dropdown,textModes, Delimiter api: /api/js/ejDropDownTree --- -# Checkbox +# Checkbox in JavaScript DropDownTree DropDownTree displays checkboxes to the left of each item when you set [treeViewSettings.showCheckBox](https://help.syncfusion.com/api/js/ejdropdowntree#members:treeViewSettings) property to true. It allows you to select more than one item at a time from the DropDownTree. Popup list stays open until selection is complete. Click on an item’s text or checkbox to change the checkbox’s checked status. @@ -139,7 +139,7 @@ var localData = [{ }); {% endhighlight %} -![](Checkbox_images/Checkbox_img1.png) +![Checkbox with JavaScript DropDownTree widget](Checkbox_images/Checkbox_img1.png) N> If you want to showcase the DropDownTree with default checked items on data binding, use `checkedNodes` in the `treeViewSettings` property. @@ -288,7 +288,7 @@ var localData = [{ } {% endhighlight %} -![](Checkbox_images/Checkbox_img2.png) +![Check an uncheck all in JavaScript DropDownTree](Checkbox_images/Checkbox_img2.png) ## checkNode/uncheckNode You can check/uncheck a particular node at run time by using [checkNode](https://help.syncfusion.com/api/js/ejdropdowntree#methods:checkNode) and [uncheckNode](https://help.syncfusion.com/api/js/ejdropdowntree#methods:uncheckNode) methods. By default, no item will be in checked state. @@ -434,4 +434,4 @@ function onCheckUncheckAll(args) { {% endhighlight %} -![](Checkbox_images/Checkbox_img2.png) \ No newline at end of file +![checkNode and uncheckNode in JavaScript DropdownTree](Checkbox_images/Checkbox_img2.png) \ No newline at end of file diff --git a/js/Grid/Paging.md b/js/Grid/Paging.md index 3411e3103..76d6a2e2b 100644 --- a/js/Grid/Paging.md +++ b/js/Grid/Paging.md @@ -1,13 +1,13 @@ --- layout: post -title: Paging with Grid widget for Syncfusion Essential JS -description: How to enable paging and its functionalites. +title: Paging in JavaScript Grid Control | Syncfusion +description: Learn here about how to enable paging and its functionalites in Syncfusion Essential JavaScript Grid Control, its elements, and more. platform: js control: Grid documentation: ug api: /api/js/ejgrid --- -# Paging +# Paging in JavaScript Grid You can display the Grid records in paged view, by setting [`allowPaging`](https://help.syncfusion.com/api/js/ejgrid#members:allowpaging "allowPaging") property as `true`. @@ -30,7 +30,7 @@ $(function () { The following output is displayed as a result of the above code example. -![](paging_images/paging_img1.png) +![Paging in JavaScript Grid](paging_images/paging_img1.png) ## Pager with query string @@ -57,7 +57,7 @@ $(function () { The following output is displayed as a result of the above code example. -![](paging_images/paging_img2.png) +![Pager with query string in JavaScript Grid](paging_images/paging_img2.png) ## Pager template @@ -111,7 +111,7 @@ function btnClick(args) { The following output is displayed as a result of the above code example. -![](paging_images/paging_img3.png) +![Pager template in JavaScript Grid](paging_images/paging_img3.png) ## Pager with pageSize drop down @@ -137,7 +137,7 @@ $(function () { The following output is displayed as a result of the above code example. -![](paging_images/paging_img4.png) +![Pager with pageSize drop down in JavaScript Grid](paging_images/paging_img4.png) ## Pager with pageSettings @@ -169,4 +169,4 @@ $(function () { The following output is displayed as a result of the above code example. -![](paging_images/paging_img6.png) +![Pager with pageSettings in JavaScript Grid](paging_images/paging_img6.png) diff --git a/js/GroupButton/Overview.md b/js/GroupButton/Overview.md index 5e42b0ba8..106e9904a 100644 --- a/js/GroupButton/Overview.md +++ b/js/GroupButton/Overview.md @@ -1,18 +1,18 @@ --- layout: post -title: Overview -description: overview +title: Overview of JavaScript GroupButton Control | Syncfusion +description: Learn here about overview of Syncfusion Essential JavaScript GroupButton Control, its elements, and more. platform: js control: GroupButton documentation: ug api: /api/js/ejgroupbutton --- -# Overview +# Overview of JavaScript GroupButton Wrapping a multiple Button into single group that allows to managing the multiple actions by changing the state of the buttons in a group. Different modes with GroupButton gives the flexible and rich options to manage the actions based on the application needs. -![](/js/GroupButton/Overview_images/overview.png) +![Overview in JavaScript GroupButton](/js/GroupButton/Overview_images/overview.png) The list of rich features of GroupButton control in JavaScript is as follows. diff --git a/js/MediaPlayer/Getting-Started.md b/js/MediaPlayer/Getting-Started.md index f6f290560..2f48f33c4 100644 --- a/js/MediaPlayer/Getting-Started.md +++ b/js/MediaPlayer/Getting-Started.md @@ -1,13 +1,13 @@ --- layout: post -title: Getting started with MediaPlayer -description: To get start with MediaPlayer by adding references. +title: Getting started with JavaScript MediaPlayer Control | Syncfusion +description: Learn here about how to get start with MediaPlayer by adding references in Syncfusion Essential JS MediaPlayer Control, its elements, and more. platform: js control: MediaPlayer documentation: ug api: /api/js/ejmediaplayer --- -# Getting Started +# Getting Started with JavaScript MediaPlayer This section explains you the steps required to create a simple Media Player component and configure its available functionalities. @@ -110,7 +110,7 @@ Add the HTML
element for Media Player component into your index.html Execute the above code to render the following output. -![](/js/MediaPlayer/Display_images/Getting_img1.png) +![Adding Media Player component in JavaScript](/js/MediaPlayer/Display_images/Getting_img1.png) diff --git a/js/Menu/Data-binding.md b/js/Menu/Data-binding.md index dfdb97e09..73fc16e34 100644 --- a/js/Menu/Data-binding.md +++ b/js/Menu/Data-binding.md @@ -1,14 +1,14 @@ --- layout: post -title: Data-binding -description: data binding +title: Data-binding in JavaScript Menu Control | Syncfusion +description: Learn here about data binding support in Syncfusion Essential JavaScript Menu Control, its elements, and more. platform: js control: Menu documentation: ug api: /api/js/ejmenu --- -# Data binding +# Data binding in JavaScript Menu Data binding enables you to synchronize the elements with different sources of data. You can bind data using two ways, Local data and remote data. @@ -142,7 +142,7 @@ Add the following code in your **HTML** page. The following screenshot displays the output of the above code. -![](/js/Menu/Data-binding_images/Data-binding_img1.png) +![Field members in JavaScript Menu](/js/Menu/Data-binding_images/Data-binding_img1.png) ## Remote data @@ -195,4 +195,4 @@ Add the following code in your **HTML** page. The following screenshot displays the output of the above code. -![](/js/Menu/Data-binding_images/Data-binding_img2.png) \ No newline at end of file +![Remote data in JavaScript Menu](/js/Menu/Data-binding_images/Data-binding_img2.png) \ No newline at end of file diff --git a/js/Toolbar/Data-binding.md b/js/Toolbar/Data-binding.md index 6b15c8893..a7fbb5a4c 100644 --- a/js/Toolbar/Data-binding.md +++ b/js/Toolbar/Data-binding.md @@ -1,14 +1,14 @@ --- layout: post -title: Data-binding -description: data binding +title: Data-binding in JavaScript Toolbar Control | Syncfusion +description: Learn here about data binding support in Syncfusion Essential JavaScript Toolbar Control, its elements, and more. platform: js control: Toolbar documentation: ug api: /api/js/ejtoolbar --- -# Data binding +# Data binding in JavaScript Toolbar **Toolbar** provides you a flexible approach for binding data from various data sources. There are various properties in **Toolbar** for Data Binding. @@ -175,7 +175,7 @@ And also you can add image, image styles, sprite CSS class, query and HTML attri {% endhighlight %} -![](/js/Toolbar/Data-binding_images/Data-binding_img1.png) +![Data fields and configuration in JavaScript Toolbar](/js/Toolbar/Data-binding_images/Data-binding_img1.png) ## Remote data @@ -213,7 +213,7 @@ To bind Remote data to **Toolbar** and [query](https://help.syncfusion.com/api/j {% endhighlight %} -![](/js/Toolbar/Data-binding_images/Data-binding_img2.png) +![Remote data in JavaScript Toolbar](/js/Toolbar/Data-binding_images/Data-binding_img2.png) ## KnockoutJS binding @@ -268,7 +268,7 @@ The following code example depicts you the way to bind data to the **Toolbar** t {% endhighlight %} - ![](/js/Toolbar/Data-binding_images/Data-binding_img4.png) + ![KnockoutJS binding in JavaScript Toolbar](/js/Toolbar/Data-binding_images/Data-binding_img4.png) ## AngularJS binding @@ -419,5 +419,5 @@ The following code example depicts you the way to bind data to the **Toolbar** w {% endhighlight %} -![](/js/Toolbar/Data-binding_images/Data-binding_img6.png) +![AngularJS binding in JavaScript Toolbar](/js/Toolbar/Data-binding_images/Data-binding_img6.png)