From a427e6195e65be896f97bae72dc18801f080c344 Mon Sep 17 00:00:00 2001 From: smukilansf3478 Date: Wed, 19 Aug 2026 12:22:01 +0530 Subject: [PATCH] 101780: Clear front matter errors 3D chart --- chart-sdk/angular/3d-charts/accessibility.md | 4 +- chart-sdk/angular/3d-charts/appearance.md | 40 +++++++++---------- .../angular/3d-charts/axis-customization.md | 16 ++++---- chart-sdk/angular/3d-charts/axis-labels.md | 10 ++--- chart-sdk/angular/3d-charts/category-axis.md | 10 ++--- .../angular/3d-charts/chart-types/bar.md | 16 ++++---- .../angular/3d-charts/chart-types/column.md | 16 ++++---- .../3d-charts/chart-types/stack-bar.md | 14 +++---- .../3d-charts/chart-types/stack-column.md | 14 +++---- .../3d-charts/chart-types/stacked-bar.md | 12 +++--- .../3d-charts/chart-types/stacked-column.md | 14 +++---- chart-sdk/angular/3d-charts/data-labels.md | 20 +++++----- chart-sdk/angular/3d-charts/datetime-axis.md | 22 +++++----- chart-sdk/angular/3d-charts/dimensions.md | 6 +-- .../angular/3d-charts/getting-started.md | 4 +- chart-sdk/angular/3d-charts/legend.md | 4 +- .../angular/3d-charts/logarithmic-axis.md | 12 +++--- chart-sdk/angular/3d-charts/multi-panes.md | 22 +++++----- chart-sdk/angular/3d-charts/numeric-axis.md | 22 +++++----- chart-sdk/angular/3d-charts/print-export.md | 8 ++-- chart-sdk/angular/3d-charts/selection.md | 16 ++++---- chart-sdk/angular/3d-charts/tool-tip.md | 4 +- .../angular/3d-charts/working-with-data.md | 12 +++--- 23 files changed, 159 insertions(+), 159 deletions(-) diff --git a/chart-sdk/angular/3d-charts/accessibility.md b/chart-sdk/angular/3d-charts/accessibility.md index 894294404..6422d2449 100644 --- a/chart-sdk/angular/3d-charts/accessibility.md +++ b/chart-sdk/angular/3d-charts/accessibility.md @@ -1,6 +1,6 @@ --- layout: post -title: Accessibility in Angular 3D Chart control | Syncfusion +title: Accessibility in Angular 3D Chart | Syncfusion description: Learn here all about accessibility in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,7 +8,7 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Accessibility in Angular 3D Chart control +# Accessibility in Angular 3D Chart Accessibility is achieved in the 3D chart control through WAI-ARIA standard and keyboard navigation. The 3D chart features can be effectively accessed through assistive technologies such as screen readers. diff --git a/chart-sdk/angular/3d-charts/appearance.md b/chart-sdk/angular/3d-charts/appearance.md index 0c83f7971..c378143df 100644 --- a/chart-sdk/angular/3d-charts/appearance.md +++ b/chart-sdk/angular/3d-charts/appearance.md @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Appearance in Angular 3D Chart control +# Appearance in Angular 3D Chart ## Custom color palette -The default color of series or points can be customized by providing a custom color palette of your choice by using the [`palettes`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#palettes) property. +The default color of series or points can be customized by providing a custom color palette of your choice by using the [`palettes`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#palettes) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -32,7 +32,7 @@ The color of an individual data point can be customized using the below options. ### Point color mapping -The color for the points can be bound from the [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#datasource) for the series by utilizing the [`pointColorMapping`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#pointcolormapping) property. +The color for the points can be bound from the [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#datasource) for the series by utilizing the [`pointColorMapping`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#pointcolormapping) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -70,7 +70,7 @@ The data label and fill color of each data point can be customized using the [`p **Customize the chart background** -The background color and border of the 3D chart can be customized using the [`background`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#background) and [`border`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#border) properties. +The background color and border of the 3D chart can be customized using the [`background`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#background) and [`border`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#border) properties. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -86,7 +86,7 @@ The background color and border of the 3D chart can be customized using the [`ba **Chart margin** -The 3D chart's margin can be set from its container using the [`margin`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#margin) property. +The 3D chart's margin can be set from its container using the [`margin`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#margin) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -102,7 +102,7 @@ The 3D chart's margin can be set from its container using the [`margin`](https:/ ## Animation -To customize the animation for a particular series, the [`animation`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#animation) property can be used. It can be enabled or disabled by using the [`enable`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/animationModel/#enable) property. The [`duration`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/animationModel/#duration) property specifies the duration of an animation and the [`delay`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/animationModel/#delay) property allows us to start the animation at desire time. +To customize the animation for a particular series, the [`animation`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#animation) property can be used. It can be enabled or disabled by using the [`enable`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/animationModel#enable) property. The [`duration`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/animationModel#duration) property specifies the duration of an animation and the [`delay`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/animationModel#delay) property allows us to start the animation at desire time. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -118,7 +118,7 @@ To customize the animation for a particular series, the [`animation`](https://ej ## Chart rotation -The 3D chart can be rotated by using the [`enableRotation`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#enablerotation) property. +The 3D chart can be rotated by using the [`enableRotation`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#enablerotation) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -134,7 +134,7 @@ The 3D chart can be rotated by using the [`enableRotation`](https://ej2.syncfusi ## Title -The 3D chart can be given a title by using [`title`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#title) property, to show the information about the data plotted. +The 3D chart can be given a title by using [`title`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#title) property, to show the information about the data plotted. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -150,7 +150,7 @@ The 3D chart can be given a title by using [`title`](https://ej2.syncfusion.com/ ### Title position -By using the [`position`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#position) property in [`titleStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#titlestyle), the [`title`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#title) can be positioned at left, right, top or bottom of the 3D chart. The title is positioned at the top of the 3D chart, by default. +By using the [`position`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#position) property in [`titleStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#titlestyle), the [`title`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#title) can be positioned at left, right, top or bottom of the 3D chart. The title is positioned at the top of the 3D chart, by default. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -164,7 +164,7 @@ By using the [`position`](https://ej2.syncfusion.com/angular/documentation/api/ {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/appearance/appearance-cs8" %} -The custom option is used to position the title anywhere in the 3D chart using [`x`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#x) and [`y`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#y) coordinates. +The custom option is used to position the title anywhere in the 3D chart using [`x`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#x) and [`y`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#y) coordinates. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -180,7 +180,7 @@ The custom option is used to position the title anywhere in the 3D chart using [ ### Title alignment -The title can be aligned to the near, far, or center of the 3D chart by using the [`textAlignment`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#textalignment) property. +The title can be aligned to the near, far, or center of the 3D chart by using the [`textAlignment`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#textalignment) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -196,16 +196,16 @@ The title can be aligned to the near, far, or center of the 3D chart by using th ### Title customization -The [`titleStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#titlestyle) property of the 3D chart provides options to customize the title by using the following properties. +The [`titleStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#titlestyle) property of the 3D chart provides options to customize the title by using the following properties. -* [`size`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#size) - Specifies the size of the title. -* [`color`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#color) - Specifies the color for the title. -* [`fontFamily`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#fontfamily) - Specifies the font family for the title. -* [`fontWeight`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#fontweight) - Specifies the font weight of the title. -* [`fontStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#fontstyle) - Specifies the font style for the title. -* [`opacity`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#opacity) - Specifies the opacity for the color of the title. -* [`textAlignment`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#textalignment) - Specifies the alignment of the title. -* [`textOverflow`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel/#textoverflow) - Specifies the overflow of the title. +* [`size`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#size) - Specifies the size of the title. +* [`color`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#color) - Specifies the color for the title. +* [`fontFamily`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#fontfamily) - Specifies the font family for the title. +* [`fontWeight`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#fontweight) - Specifies the font weight of the title. +* [`fontStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#fontstyle) - Specifies the font style for the title. +* [`opacity`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#opacity) - Specifies the opacity for the color of the title. +* [`textAlignment`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#textalignment) - Specifies the alignment of the title. +* [`textOverflow`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/titleSettingsModel#textoverflow) - Specifies the overflow of the title. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/axis-customization.md b/chart-sdk/angular/3d-charts/axis-customization.md index 0abd48397..3b34b0810 100644 --- a/chart-sdk/angular/3d-charts/axis-customization.md +++ b/chart-sdk/angular/3d-charts/axis-customization.md @@ -1,6 +1,6 @@ --- layout: post -title: Axis customization in Angular 3D Chart control | Syncfusion +title: Axis Customization in Angular 3D Chart | Syncfusion description: Learn here all about axis customization in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis customization in Angular 3D Chart control +# Axis Customization in Angular 3D Chart control ## Title -The title for the axis can be added by using the [`title`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#title) property. It helps to provide quick information to the user about the data plotted in the axis. Title style can be customized using [`titleStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#titlestyle) property of the axis. +The title for the axis can be added by using the [`title`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#title) property. It helps to provide quick information to the user about the data plotted in the axis. Title style can be customized using [`titleStyle`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#titlestyle) property of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ The title for the axis can be added by using the [`title`](https://ej2.syncfusio ## Title rotation -The title can be rotated from 0 to 360 degree by using the [`titleRotation`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#titlerotation) property. +The title can be rotated from 0 to 360 degree by using the [`titleRotation`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#titlerotation) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The title can be rotated from 0 to 360 degree by using the [`titleRotation`](htt ## Tick lines customization -The [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minorTickModel/#width), [`color`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minorTickModel/#color) and [`height`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minorTickModel/#height) of the minor and major tick lines can be customized by using the [`majorTickLines`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#majorticklines) and [`minorTickLines`](../api/chart3d/axis3D/#https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minorticklines) properties in the axis. +The [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minorTickModel#width), [`color`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minorTickModel#color) and [`height`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minorTickModel#height) of the minor and major tick lines can be customized by using the [`majorTickLines`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#majorticklines) and [`minorTickLines`](../api/chart3d/axis3D#https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minorticklines) properties in the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -60,7 +60,7 @@ The [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/minor ## Grid lines customization -The [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/majorGridModel/#width) and [`color`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/majorGridModel/#color) of the minor and major grid lines can be customized by using the [`majorGridLines`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#majorgridlines) and [`minorGridLines`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minorgridlines) properties in the axis. +The [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/majorGridModel#width) and [`color`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/majorGridModel#color) of the minor and major grid lines can be customized by using the [`majorGridLines`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#majorgridlines) and [`minorGridLines`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minorgridlines) properties in the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -94,7 +94,7 @@ In addition to primary X and Y axis, n number of axis can be added to the chart. -When an axis is inversed, highest value of the axis comes closer to origin and vice versa. To place an axis in inversed manner, set the [`isInversed`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#isinversed) property to **true**. +When an axis is inversed, highest value of the axis comes closer to origin and vice versa. To place an axis in inversed manner, set the [`isInversed`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#isinversed) property to **true**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -110,7 +110,7 @@ When an axis is inversed, highest value of the axis comes closer to origin and v ## Opposed position -To place an axis opposite from its original position, set the [`opposedPosition`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#opposedposition) property to **true**. +To place an axis opposite from its original position, set the [`opposedPosition`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#opposedposition) property to **true**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/axis-labels.md b/chart-sdk/angular/3d-charts/axis-labels.md index bbf4b3b1b..c58b44f28 100644 --- a/chart-sdk/angular/3d-charts/axis-labels.md +++ b/chart-sdk/angular/3d-charts/axis-labels.md @@ -1,6 +1,6 @@ --- layout: post -title: Axis labels in Angular 3D Chart control | Syncfusion +title: Axis Labels in Angular 3D Chart | Syncfusion description: Learn here all about axis labels in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,13 +8,13 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Axis labels in Angular 3D Chart control +# Axis Labels in Angular 3D Chart Axis labels are the labels that are positioned adjacent to the y-axis and beneath the x-axis. It provides descriptive information about the axis. ## Smart axis labels -When the axis labels overlap with each other, [`labelIntersectAction`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#labelintersectaction) property in the axis can be used to place them smartly. +When the axis labels overlap with each other, [`labelIntersectAction`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#labelintersectaction) property in the axis can be used to place them smartly. **Case 1:** When setting `labelIntersectAction` as `Hide`. @@ -61,7 +61,7 @@ When the axis labels overlap with each other, [`labelIntersectAction`](https:// ## Edge label placement Labels with long text at the edges of an axis may appear partially in the 3D chart. To avoid this, -use the [`edgeLabelPlacement`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#edgelabelplacement) property in axis, which moves the label inside the chart area for better appearance or hides it. +use the [`edgeLabelPlacement`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#edgelabelplacement) property in axis, which moves the label inside the chart area for better appearance or hides it. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -77,7 +77,7 @@ use the [`edgeLabelPlacement`](https://ej2.syncfusion.com/angular/documentation ## Maximum labels -The labels will be rendered based on the count in the [`maximumLabels`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#maximumlabels) property per 100 pixel. If the range (minimum, maximum, interval) and `maximumLabels` are set, then the priority goes to range. If the range is not set, then the priority goes to `maximumLabels` property. +The labels will be rendered based on the count in the [`maximumLabels`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#maximumlabels) property per 100 pixel. If the range (minimum, maximum, interval) and `maximumLabels` are set, then the priority goes to range. If the range is not set, then the priority goes to `maximumLabels` property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/category-axis.md b/chart-sdk/angular/3d-charts/category-axis.md index 00f27e569..a3e3e23c0 100644 --- a/chart-sdk/angular/3d-charts/category-axis.md +++ b/chart-sdk/angular/3d-charts/category-axis.md @@ -1,6 +1,6 @@ --- layout: post -title: Category axis in Angular 3D Chart control | Syncfusion +title: Category Axis in Angular 3D Chart control | Syncfusion description: Learn here all about category axis in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,7 +8,7 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Category axis in Angular 3D Chart control +# Category Axis in Angular 3D Chart control The category axis is the horizontal axis of a 3D chart that shows text values rather than numerical values. Compared to the vertical axis, this axis has fewer labels. The following sample shows to render the 3D chart using category axis. @@ -24,11 +24,11 @@ The category axis is the horizontal axis of a 3D chart that shows text values ra {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/category-axis/category-axis-cs1" %} ->Note: To use category axis, we need to inject `Category3DService` module into the `@NgModule.providers` and set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#valuetype) of axis to **Category**. +>Note: To use category axis, we need to inject `Category3DService` module into the `@NgModule.providers` and set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#valuetype) of axis to **Category**. ## Range -The range of the category axis can be customized using [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) properties of the axis. +The range of the category axis can be customized using [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) properties of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The range of the category axis can be customized using [`minimum`](https://ej2.s ## Indexed category axis -The category axis can also be rendered based on the index values of the data source. This can be achieved by defining the [`isIndexed`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#isindexed) property to **true** in the axis. +The category axis can also be rendered based on the index values of the data source. This can be achieved by defining the [`isIndexed`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#isindexed) property to **true** in the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/chart-types/bar.md b/chart-sdk/angular/3d-charts/chart-types/bar.md index 6da19a537..b98d9384f 100644 --- a/chart-sdk/angular/3d-charts/chart-types/bar.md +++ b/chart-sdk/angular/3d-charts/chart-types/bar.md @@ -1,6 +1,6 @@ --- layout: post -title: Bar Chart in Angular 3D Chart control | Syncfusion +title: Bar Chart in Angular 3D Chart | Syncfusion description: Learn here all about bar chart in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Bar Chart in Angular 3D Chart control +# Bar Chart in Angular 3D Chart ## Bar chart -To render a bar series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#type) as `Bar` and inject `BarSeries3DService` module into the `@NgModule.providers`. +To render a bar series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#type) as `Bar` and inject `BarSeries3DService` module into the `@NgModule.providers`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ To render a bar series, use series [`type`](https://ej2.syncfusion.com/angular/d ## Bar space and width -The [`columnSpacing`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnspacing) and [`columnWidth`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnwidth) properties are used to customize the space between bars. +The [`columnSpacing`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnspacing) and [`columnWidth`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnwidth) properties are used to customize the space between bars. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The [`columnSpacing`](https://ej2.syncfusion.com/angular/documentation/api/chart ## Grouped bar -The data points can be grouped in the bar type charts by using the [`groupName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#groupname) property. Data points with same group name are grouped together. +The data points can be grouped in the bar type charts by using the [`groupName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#groupname) property. Data points with same group name are grouped together. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -60,7 +60,7 @@ The data points can be grouped in the bar type charts by using the [`groupName`] ## Cylindrical bar chart -To render a cylindrical bar chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnfacet) property to `Cylinder` in the chart series. +To render a cylindrical bar chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnfacet) property to `Cylinder` in the chart series. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -78,8 +78,8 @@ To render a cylindrical bar chart, set the [`columnFacet`](https://ej2.syncfusio The following properties can be used to customize the `bar` series. -* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) – Specifies the color of the series. -* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) color. +* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) – Specifies the color of the series. +* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) color. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/chart-types/column.md b/chart-sdk/angular/3d-charts/chart-types/column.md index 3e6cab7f6..f6c9fec52 100644 --- a/chart-sdk/angular/3d-charts/chart-types/column.md +++ b/chart-sdk/angular/3d-charts/chart-types/column.md @@ -1,6 +1,6 @@ --- layout: post -title: Column Chart in Angular 3D Chart control | Syncfusion +title: Column Chart in Angular 3D Chart | Syncfusion description: Learn here all about column chart in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Column Chart in Angular 3D Chart control +# Column Chart in Angular 3D Chart ## Column chart -To render a column series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#type) as `Column` and inject `ColumnSeries3DService` module into the `@NgModule.providers`. +To render a column series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#type) as `Column` and inject `ColumnSeries3DService` module into the `@NgModule.providers`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ To render a column series, use series [`type`](https://ej2.syncfusion.com/angula ## Column space and width -The [`columnSpacing`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnspacing) and [`columnWidth`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnwidth) properties are used to customize the space between columns. +The [`columnSpacing`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnspacing) and [`columnWidth`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnwidth) properties are used to customize the space between columns. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The [`columnSpacing`](https://ej2.syncfusion.com/angular/documentation/api/chart ## Grouped column -The data points can be grouped in the column type charts by using the [`groupName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#groupname) property. Data points with same group name are grouped together. +The data points can be grouped in the column type charts by using the [`groupName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#groupname) property. Data points with same group name are grouped together. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -60,7 +60,7 @@ The data points can be grouped in the column type charts by using the [`groupNam ## Cylindrical column chart -To render a cylindrical column chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnfacet) property to `Cylinder` in the chart series. +To render a cylindrical column chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnfacet) property to `Cylinder` in the chart series. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -78,8 +78,8 @@ To render a cylindrical column chart, set the [`columnFacet`](https://ej2.syncfu The following properties can be used to customize the `column` series. -* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) – Specifies the color of the series. -* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) color. +* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) – Specifies the color of the series. +* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) color. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/chart-types/stack-bar.md b/chart-sdk/angular/3d-charts/chart-types/stack-bar.md index d40919433..d4032a2ac 100644 --- a/chart-sdk/angular/3d-charts/chart-types/stack-bar.md +++ b/chart-sdk/angular/3d-charts/chart-types/stack-bar.md @@ -1,6 +1,6 @@ --- layout: post -title: Stacked Bar Chart in Angular 3D Chart control | Syncfusion +title: Stacked Bar Chart in Angular 3D Chart | Syncfusion description: Learn here all about stacked bar chart in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Stacked bar chart in Angular 3D Chart control +# Stacked Bar Chart in Angular 3D Chart ## Stacked bar chart -To render a stacked bar series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#type) as `StackingBar` and inject `StackingBarSeries3DService` module into the `@NgModule.providers`. +To render a stacked bar series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#type) as `StackingBar` and inject `StackingBarSeries3DService` module into the `@NgModule.providers`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ To render a stacked bar series, use series [`type`](https://ej2.syncfusion.com/a ## Stacking group -To group the stacked bar, the [`stackingGroup`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#stackinggroup) property can be used. The columns with same group name are stacked on top of each other. +To group the stacked bar, the [`stackingGroup`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#stackinggroup) property can be used. The columns with same group name are stacked on top of each other. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ To group the stacked bar, the [`stackingGroup`](https://ej2.syncfusion.com/angul ## Cylindrical stacked bar chart -To render a cylindrical stacked bar chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnfacet) property to `Cylinder` in the chart series. +To render a cylindrical stacked bar chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnfacet) property to `Cylinder` in the chart series. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -62,8 +62,8 @@ To render a cylindrical stacked bar chart, set the [`columnFacet`](https://ej2.s The following properties can be used to customize the `stacked bar` series. -* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) – Specifies the color of the series. -* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) color. +* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) – Specifies the color of the series. +* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) color. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/chart-types/stack-column.md b/chart-sdk/angular/3d-charts/chart-types/stack-column.md index 6445a9d28..c649ffa1e 100644 --- a/chart-sdk/angular/3d-charts/chart-types/stack-column.md +++ b/chart-sdk/angular/3d-charts/chart-types/stack-column.md @@ -1,6 +1,6 @@ --- layout: post -title: Stacked Column Chart in Angular 3D Chart control | Syncfusion +title: Stacked Column Chart in Angular 3D Chart | Syncfusion description: Learn here all about stacked column chart in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Stacked column chart in Angular 3D Chart control +# Stacked Column Chart in Angular 3D Chart ## Stacked column chart -To render a stacked column series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#type) as `StackingColumn` and inject `StackingColumnSeries3DService` module into the `@NgModule.providers`. +To render a stacked column series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#type) as `StackingColumn` and inject `StackingColumnSeries3DService` module into the `@NgModule.providers`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ To render a stacked column series, use series [`type`](https://ej2.syncfusion.co ## Stacking group -To group the stacked column, the [`stackingGroup`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#stackinggroup) property can be used. The columns with same group name are stacked on top of each other. +To group the stacked column, the [`stackingGroup`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#stackinggroup) property can be used. The columns with same group name are stacked on top of each other. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ To group the stacked column, the [`stackingGroup`](https://ej2.syncfusion.com/an ## Cylindrical stacked column chart -To render a cylindrical stacked column chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnfacet) property to `Cylinder` in the chart series. +To render a cylindrical stacked column chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnfacet) property to `Cylinder` in the chart series. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -62,8 +62,8 @@ To render a cylindrical stacked column chart, set the [`columnFacet`](https://ej The following properties can be used to customize the `stacked column` series. -* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) – Specifies the color of the series. -* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) color. +* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) – Specifies the color of the series. +* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) color. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/chart-types/stacked-bar.md b/chart-sdk/angular/3d-charts/chart-types/stacked-bar.md index 1ea715791..56cde84ac 100644 --- a/chart-sdk/angular/3d-charts/chart-types/stacked-bar.md +++ b/chart-sdk/angular/3d-charts/chart-types/stacked-bar.md @@ -1,6 +1,6 @@ --- layout: post -title: 100% Stacked Bar Chart in Angular 3D Chart control | Syncfusion +title: 100% Stacked Bar Chart in Angular 3D Chart | Syncfusion description: Learn here all about 100% stacked bar chart in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# 100% Stacked bar chart in Angular 3D Chart control +# 100% Stacked Bar Chart in Angular 3D Chart ## 100% Stacked bar chart -To render a 100% stacked bar series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#type) as `StackingBar100` and inject `StackingBarSeries3DService` module into the `@NgModule.providers`. +To render a 100% stacked bar series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#type) as `StackingBar100` and inject `StackingBarSeries3DService` module into the `@NgModule.providers`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ To render a 100% stacked bar series, use series [`type`](https://ej2.syncfusion. ## 100% Cylindrical stacked bar chart -To render a cylindrical 100% stacked bar chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnfacet) property to `Cylinder` in the chart series. +To render a cylindrical 100% stacked bar chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnfacet) property to `Cylinder` in the chart series. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -46,8 +46,8 @@ To render a cylindrical 100% stacked bar chart, set the [`columnFacet`](https:// The following properties can be used to customize the `100% stacked bar` series. -* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) – Specifies the color of the series. -* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) color. +* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) – Specifies the color of the series. +* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) color. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/chart-types/stacked-column.md b/chart-sdk/angular/3d-charts/chart-types/stacked-column.md index 699df0a6f..00f9316c8 100644 --- a/chart-sdk/angular/3d-charts/chart-types/stacked-column.md +++ b/chart-sdk/angular/3d-charts/chart-types/stacked-column.md @@ -1,6 +1,6 @@ --- layout: post -title: 100% Stacked Column Chart in Angular 3D Chart control | Syncfusion +title: 100% Stacked Column Chart in Angular 3D Chart | Syncfusion description: Learn here all about 100% stacked column chart in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# 100% Stacked column chart in Angular 3D Chart control +# 100% Stacked column chart in Angular 3D Chart -## 100% Stacked column chart +## 100% Stacked Column Chart -To render a 100% stacked column series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#type) as `StackingColumn100` and inject `StackingColumnSeries3DService` module into the `@NgModule.providers`. +To render a 100% stacked column series, use series [`type`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#type) as `StackingColumn100` and inject `StackingColumnSeries3DService` module into the `@NgModule.providers`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ To render a 100% stacked column series, use series [`type`](https://ej2.syncfusi ## 100% Cylindrical stacked column chart -To render a 100% cylindrical stacked column chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#columnfacet) property to `Cylinder` in the chart series. +To render a 100% cylindrical stacked column chart, set the [`columnFacet`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#columnfacet) property to `Cylinder` in the chart series. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -46,8 +46,8 @@ To render a 100% cylindrical stacked column chart, set the [`columnFacet`](https The following properties can be used to customize the `100% stacked column` series. -* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) – Specifies the color of the series. -* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#fill) color. +* [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) – Specifies the color of the series. +* [opacity](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#opacity) – Specifies the opacity of the [fill](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#fill) color. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/data-labels.md b/chart-sdk/angular/3d-charts/data-labels.md index 46d3c8c4c..9b0c422d0 100644 --- a/chart-sdk/angular/3d-charts/data-labels.md +++ b/chart-sdk/angular/3d-charts/data-labels.md @@ -1,6 +1,6 @@ --- layout: post -title: Data labels in Angular 3D Chart control | Syncfusion +title: Data Labels in Angular 3D Chart | Syncfusion description: Learn here all about data labels in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,9 +8,9 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Data labels in Angular 3D Chart control +# Data labels in Angular 3D Chart -Data labels are fields that includes information about the sample point connected to an output. It can be added to a chart series by enabling the [`visible`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#visible) property in the [`dataLabel`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#datalabel). By default, the labels will arrange smartly without overlapping. +Data labels are fields that includes information about the sample point connected to an output. It can be added to a chart series by enabling the [`visible`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#visible) property in the [`dataLabel`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#datalabel). By default, the labels will arrange smartly without overlapping. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ Data labels are fields that includes information about the sample point connecte ## Position -The [`position`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#position) property is used to place the label either on `Top`, `Middle`, or `Bottom`. +The [`position`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#position) property is used to place the label either on `Top`, `Middle`, or `Bottom`. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The [`position`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/da ## Template -Label content can be formatted by using the template option. Inside the template, the placeholder text `${point.x}` and `${point.y}` can be added to display corresponding data points x & y value. Using [`template`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#template) property, the data label template can be set. +Label content can be formatted by using the template option. Inside the template, the placeholder text `${point.x}` and `${point.y}` can be added to display corresponding data points x & y value. Using [`template`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#template) property, the data label template can be set. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -60,7 +60,7 @@ Label content can be formatted by using the template option. Inside the template ## Text mapping -Text from the data source can be mapped using the [`name`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#name) property. +Text from the data source can be mapped using the [`name`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#name) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -76,7 +76,7 @@ Text from the data source can be mapped using the [`name`](https://ej2.syncfusio ## Format -Data label for the chart can be formatted using the [`format`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#format) property. The global formatting options can be used as 'n', 'p', and 'c'. +Data label for the chart can be formatted using the [`format`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#format) property. The global formatting options can be used as 'n', 'p', and 'c'. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -149,7 +149,7 @@ Data label for the chart can be formatted using the [`format`](https://ej2.syncf ## Margin -The [`margin`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#margin) for data label can be applied by using [`left`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel/#left), [`right`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel/#right), [`bottom`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel/#bottom) and [`top`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel/#top) properties. +The [`margin`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#margin) for data label can be applied by using [`left`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel#left), [`right`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel#right), [`bottom`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel#bottom) and [`top`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/marginModel#top) properties. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -165,7 +165,7 @@ The [`margin`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/data ## Customization -The `stroke` and `border` of data label can be customized using [`fill`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#fill) and [`border`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel/#border) properties. +The `stroke` and `border` of data label can be customized using [`fill`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#fill) and [`border`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/dataLabelStyleModel#border) properties. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -181,7 +181,7 @@ The `stroke` and `border` of data label can be customized using [`fill`](https:/ ## Customizing specific label -A specific label can be customized by using the [`textRender`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/i3DTextRenderEventArgs/) event. The `textRender` event allows you to change the label text for the point. +A specific label can be customized by using the [`textRender`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/i3DTextRenderEventArgs) event. The `textRender` event allows you to change the label text for the point. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/datetime-axis.md b/chart-sdk/angular/3d-charts/datetime-axis.md index 6a84196ff..1a931afac 100644 --- a/chart-sdk/angular/3d-charts/datetime-axis.md +++ b/chart-sdk/angular/3d-charts/datetime-axis.md @@ -1,6 +1,6 @@ --- layout: post -title: DateTime axis in Angular 3D Chart control | Syncfusion +title: DateTime Axis in Angular 3D Chart | Syncfusion description: Learn here all about DateTime axis in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -9,7 +9,7 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# DateTime axis in Angular 3D Chart control +# DateTime axis in Angular 3D Chart ## DateTime axis @@ -27,7 +27,7 @@ DateTime axis uses date time scale and displays the date time values as axis lab {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/date-time-axis/date-time-cs1" %} ->Note: To use datetime axis, we need to inject `DateTime3DService` module into the `@NgModule.providers` and set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#valuetype) of axis to **DateTime**. +>Note: To use datetime axis, we need to inject `DateTime3DService` module into the `@NgModule.providers` and set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#valuetype) of axis to **DateTime**. ## DateTime category axis @@ -45,11 +45,11 @@ DateTime category axis is used to display the date time values with non-linear i {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/date-time-axis/date-time-cs2" %} ->Note: To use datetime category axis, we need to inject `DateTimeCategory3DService` module into the `@NgModule.providers` and set the [`valueType`](../api/chart3d/axis3D/#valuetype) of axis to **DateTimeCategory**. +>Note: To use datetime category axis, we need to inject `DateTimeCategory3DService` module into the `@NgModule.providers` and set the [`valueType`](../api/chart3d/axis3D#valuetype) of axis to **DateTimeCategory**. ### Range -Range of an axis will be calculated automatically based on the provided data. You can also customize the range of an axis using [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) properties. +Range of an axis will be calculated automatically based on the provided data. You can also customize the range of an axis using [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) properties. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -65,7 +65,7 @@ Range of an axis will be calculated automatically based on the provided data. Yo ### Interval customization -Date time intervals can be customized by using the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) and [`intervalType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#intervaltype) properties of the axis. For example, when you set `interval` as **2** and `intervalType` as **Years**, it considers 2 years as interval. DateTime axis supports following interval types, +Date time intervals can be customized by using the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) and [`intervalType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#intervaltype) properties of the axis. For example, when you set `interval` as **2** and `intervalType` as **Years**, it considers 2 years as interval. DateTime axis supports following interval types, * Auto * Years @@ -89,7 +89,7 @@ Date time intervals can be customized by using the [`interval`](https://ej2.sync **Applying padding to the range** -Padding can be applied to the minimum and maximum extremes of the range by using the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) property. DateTime axis supports the following types of padding, +Padding can be applied to the minimum and maximum extremes of the range by using the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) property. DateTime axis supports the following types of padding, * None * Round @@ -97,7 +97,7 @@ Padding can be applied to the minimum and maximum extremes of the range by using **DateTime - None** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to `None`, minimum and maximum of an axis is based on the data. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to `None`, minimum and maximum of an axis is based on the data. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -113,7 +113,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **DateTime - Round** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to `Round`, minimum and maximum will be rounded to the nearest possible value, which is divisible by interval. For example, when the minimum is **15th Jan**, interval is **1** and interval type is **Month**, then the axis minimum will be **Jan 1st**. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to `Round`, minimum and maximum will be rounded to the nearest possible value, which is divisible by interval. For example, when the minimum is **15th Jan**, interval is **1** and interval type is **Month**, then the axis minimum will be **Jan 1st**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -129,7 +129,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **DateTime - Additional** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to `Additional`, interval of an axis will be padded to the minimum and maximum of the axis. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to `Additional`, interval of an axis will be padded to the minimum and maximum of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -145,7 +145,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c ## Label format -The date can be formatted and parsed to all globalize format using the [`labelFormat`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#labelformat) property in an axis. +The date can be formatted and parsed to all globalize format using the [`labelFormat`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#labelformat) property in an axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/dimensions.md b/chart-sdk/angular/3d-charts/dimensions.md index a68c25ea8..7e2991e3f 100644 --- a/chart-sdk/angular/3d-charts/dimensions.md +++ b/chart-sdk/angular/3d-charts/dimensions.md @@ -1,6 +1,6 @@ --- layout: post -title: Dimensions in Angular 3D Chart control | Syncfusion +title: Dimensions in Angular 3D Chart | Syncfusion description: Learn here all about dimensions in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,7 +8,7 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Dimensions in Angular 3D Chart control +# Dimensions in Angular 3D Chart ## Size for container @@ -38,7 +38,7 @@ The 3D chart can be rendered to its container size and it can be set via inline -The size of the 3D chart can be set directly through [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#width) and [`height`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#height) properties. +The size of the 3D chart can be set directly through [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#width) and [`height`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#height) properties. **In Pixel** diff --git a/chart-sdk/angular/3d-charts/getting-started.md b/chart-sdk/angular/3d-charts/getting-started.md index cc793f3e3..bd7517afd 100644 --- a/chart-sdk/angular/3d-charts/getting-started.md +++ b/chart-sdk/angular/3d-charts/getting-started.md @@ -1,6 +1,6 @@ --- layout: post -title: Getting Started with Angular 3D Chart component | Syncfusion +title: Getting Started with Angular 3D Chart | Syncfusion description: Check out and learn about Getting Started with Angular 3D Chart component of Syncfusion Essential JS 2 and more details. platform: chart-sdk control: Getting Started @@ -8,7 +8,7 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Getting Started with Angular 3D Chart Component +# Getting Started with Angular 3D Chart This section explains the steps required to create a simple [Angular 3D Chart](https://www.syncfusion.com/angular-components/angular-3d-chart) and demonstrates the basic usage of the Angular 3D Chart component. diff --git a/chart-sdk/angular/3d-charts/legend.md b/chart-sdk/angular/3d-charts/legend.md index 4635d117a..6367fce9f 100644 --- a/chart-sdk/angular/3d-charts/legend.md +++ b/chart-sdk/angular/3d-charts/legend.md @@ -1,6 +1,6 @@ --- layout: post -title: Legend in Angular 3D Chart control | Syncfusion +title: Legend in Angular 3D Chart | Syncfusion description: Learn here all about legend in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Legend in Angular 3D Chart control +# Legend in Angular 3D Chart diff --git a/chart-sdk/angular/3d-charts/logarithmic-axis.md b/chart-sdk/angular/3d-charts/logarithmic-axis.md index e269602d2..2f0eb5826 100644 --- a/chart-sdk/angular/3d-charts/logarithmic-axis.md +++ b/chart-sdk/angular/3d-charts/logarithmic-axis.md @@ -1,6 +1,6 @@ --- layout: post -title: Logarithmic axis in Angular 3D Chart control | Syncfusion +title: Logarithmic Axis in Angular 3D Chart | Syncfusion description: Learn here all about logarithmic axis in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,7 +8,7 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Logarithmic axis in Angular 3D Chart control +# Logarithmic axis in Angular 3D Chart Logarithmic axis uses logarithmic scale and it is very useful in visualizing data, when it has numerical values in both lower order of magnitude (eg: 10-6) and higher order of magnitude (eg: 106). @@ -24,11 +24,11 @@ Logarithmic axis uses logarithmic scale and it is very useful in visualizing dat {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/logarithmic-axis/logatithmic-axis-cs1" %} ->Note: To use logarithmic axis, we need to inject `Logarithmic3DService` module into the `@NgModule.providers` and set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#valuetype) of the axis to **Logarithmic**. +>Note: To use logarithmic axis, we need to inject `Logarithmic3DService` module into the `@NgModule.providers` and set the [`valueType`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#valuetype) of the axis to **Logarithmic**. ## Range -The range of an axis will be calculated automatically based on the provided data and it can also be customized by using the [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) properties of the axis. +The range of an axis will be calculated automatically based on the provided data and it can also be customized by using the [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) properties of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The range of an axis will be calculated automatically based on the provided data ## Logarithmic base -Logarithmic base can be customized by using the [`logBase`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#logbase) property of the axis. For example when the `logBase` is **5**, the axis values follows 5-2, 5-1, 50, 51, 52 etc. +Logarithmic base can be customized by using the [`logBase`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#logbase) property of the axis. For example when the `logBase` is **5**, the axis values follows 5-2, 5-1, 50, 51, 52 etc. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -60,7 +60,7 @@ Logarithmic base can be customized by using the [`logBase`](https://ej2.syncfus ## Logarithmic interval -The interval of the logarithmic axis can be customized by using the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) property in the axis. When the logarithmic base is 10 and logarithmic **interval** is 2, then the axis labels are placed at an interval of 102. The default value of the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) is **1**. +The interval of the logarithmic axis can be customized by using the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) property in the axis. When the logarithmic base is 10 and logarithmic **interval** is 2, then the axis labels are placed at an interval of 102. The default value of the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) is **1**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/multi-panes.md b/chart-sdk/angular/3d-charts/multi-panes.md index ae1d01a4f..6f8ceb850 100644 --- a/chart-sdk/angular/3d-charts/multi-panes.md +++ b/chart-sdk/angular/3d-charts/multi-panes.md @@ -1,6 +1,6 @@ --- layout: post -title: Multiple panes in Angular 3D Chart control | Syncfusion +title: Multiple Panes in Angular 3D Chart | Syncfusion description: Learn here all about multiple panes in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,16 +8,16 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Multiple panes in Angular 3D Chart control +# Multiple panes in Angular 3D Chart -The chart area can be divided into multiple panes using [`rows`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#rows) and [`columns`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#columns). +The chart area can be divided into multiple panes using [`rows`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#rows) and [`columns`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#columns). ## Rows -To split the chart area vertically into number of rows, use [`rows`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#rows) property of the 3D chart. +To split the chart area vertically into number of rows, use [`rows`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#rows) property of the 3D chart. -* The space for each row can be allocated by using the [`height`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionRowModel/#height) property. The value can be either in percentage or in pixel. -* To associate a vertical axis to a particular row, specify its index to [`rowIndex`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rowindex) property of the axis. +* The space for each row can be allocated by using the [`height`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionRowModel#height) property. The value can be either in percentage or in pixel. +* To associate a vertical axis to a particular row, specify its index to [`rowIndex`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rowindex) property of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -31,7 +31,7 @@ To split the chart area vertically into number of rows, use [`rows`](https://ej2 {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/multi-pane/multi-pane-cs1" %} -For spanning the vertical axis along multiple rows, use [`span`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#span) property of an axis. +For spanning the vertical axis along multiple rows, use [`span`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#span) property of an axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -47,10 +47,10 @@ For spanning the vertical axis along multiple rows, use [`span`](https://ej2.sy ## Columns -To split the chart area horizontally into number of columns, use [`columns`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#columns) property of the 3D chart. +To split the chart area horizontally into number of columns, use [`columns`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#columns) property of the 3D chart. -* The space for each column can be allocated by using the [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionColumnModel/#width) property. The given width can be either in percentage or in pixel. -* To associate a horizontal axis to a particular column, specify its index to [`columnIndex`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#columnindex) property of the axis. +* The space for each column can be allocated by using the [`width`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionColumnModel#width) property. The given width can be either in percentage or in pixel. +* To associate a horizontal axis to a particular column, specify its index to [`columnIndex`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#columnindex) property of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -64,7 +64,7 @@ To split the chart area horizontally into number of columns, use [`columns`](htt {% previewsample "https://help.syncfusion.com/samples/chart-sdk/angular/3d-charts/multi-pane/multi-pane-cs3" %} -For spanning the vertical axis along multiple column, you can use [`span`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#span) property of an axis. +For spanning the vertical axis along multiple column, you can use [`span`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#span) property of an axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/numeric-axis.md b/chart-sdk/angular/3d-charts/numeric-axis.md index 4fb10bc43..1edc90cfd 100644 --- a/chart-sdk/angular/3d-charts/numeric-axis.md +++ b/chart-sdk/angular/3d-charts/numeric-axis.md @@ -1,6 +1,6 @@ --- layout: post -title: Numeric axis in Angular 3D Chart control | Syncfusion +title: Numeric Axis in Angular 3D Chart | Syncfusion description: Learn here all about numeric axis in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Numeric axis in Angular 3D Chart control +# Numeric Axis in Angular 3D Chart The numeric axis can be used to represent the numeric values of data in 3D chart. By default, the `valueType` of an axis is **Double**. @@ -28,7 +28,7 @@ The numeric axis can be used to represent the numeric values of data in 3D chart ## Range -The range of an axis will be calculated automatically based on the provided data, and it can also be customized by using the [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) properties of the axis. +The range of an axis will be calculated automatically based on the provided data, and it can also be customized by using the [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minimum), [`maximum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#maximum) and [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) properties of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -44,7 +44,7 @@ The range of an axis will be calculated automatically based on the provided data ## Range padding -Padding can be applied to the minimum and maximum extremes of an axis range by using the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) property. Numeric axis supports the following types of padding. +Padding can be applied to the minimum and maximum extremes of an axis range by using the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) property. Numeric axis supports the following types of padding. * None * Round @@ -54,7 +54,7 @@ Padding can be applied to the minimum and maximum extremes of an axis range by u **Numeric - None** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to `None`, minimum and maximum of the axis is based on the data. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to `None`, minimum and maximum of the axis is based on the data. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -70,7 +70,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **Numeric - Round** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to **Round**, minimum and maximum will be rounded to the nearest possible value, which is divisible by interval. For example, when the [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#minimum) is **3.5** and the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#interval) is **1**, then the minimum will be rounded to **3**. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to **Round**, minimum and maximum will be rounded to the nearest possible value, which is divisible by interval. For example, when the [`minimum`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#minimum) is **3.5** and the [`interval`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#interval) is **1**, then the minimum will be rounded to **3**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -86,7 +86,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **Numeric - Additional** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to **Additional**, interval of an axis will be added to the minimum and maximum of the axis. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to **Additional**, interval of an axis will be added to the minimum and maximum of the axis. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -102,7 +102,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **Numeric - Normal** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to **Normal**, padding is applied to the axis based on default range calculation. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to **Normal**, padding is applied to the axis based on default range calculation. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -118,7 +118,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **Numeric - Auto** -When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#rangepadding) is set to **Auto**, horizontal numeric axis takes **None** as padding calculation, while the vertical numeric axis takes **Normal** as padding calculation. +When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#rangepadding) is set to **Auto**, horizontal numeric axis takes **None** as padding calculation, while the vertical numeric axis takes **Normal** as padding calculation. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -136,7 +136,7 @@ When the [`rangePadding`](https://ej2.syncfusion.com/angular/documentation/api/c **Numeric label format** -Numeric labels can be formatted by using the [`labelFormat`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel/#labelformat) property. Also, it supports all globalize format. +Numeric labels can be formatted by using the [`labelFormat`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/axis3DModel#labelformat) property. Also, it supports all globalize format. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -212,7 +212,7 @@ The following table describes the result of applying some commonly used label fo ## Grouping separator -To separate the y-axis labels to groups of thousands, set the [`useGroupingSeparator`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#usegroupingseparator) property to **true** in the 3D chart. +To separate the y-axis labels to groups of thousands, set the [`useGroupingSeparator`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#usegroupingseparator) property to **true** in the 3D chart. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/print-export.md b/chart-sdk/angular/3d-charts/print-export.md index 83e570572..365ecc763 100644 --- a/chart-sdk/angular/3d-charts/print-export.md +++ b/chart-sdk/angular/3d-charts/print-export.md @@ -1,6 +1,6 @@ --- layout: post -title: Print and Export in Angular 3D Chart control | Syncfusion +title: Print and Export in Angular 3D Chart | Syncfusion description: Learn here all about print and export in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,11 +8,11 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Print and Export in Angular 3D Chart control +# Print and Export in Angular 3D Chart ## Print -The rendered 3D chart can be printed directly from the browser by calling the public method [`print`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/printUtils/#print). The ID of the 3D chart's div element must be passed as the input parameter to that method. +The rendered 3D chart can be printed directly from the browser by calling the public method [`print`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/printUtils#print). The ID of the 3D chart's div element must be passed as the input parameter to that method. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -28,7 +28,7 @@ The rendered 3D chart can be printed directly from the browser by calling the pu ## Export -The rendered 3D chart can be exported to `JPEG`, `PNG`, `SVG`, or `PDF` format using the [`export`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/exportUtils/#export) method. The input parameters for this method are: `type` for format and `fileName` for result. +The rendered 3D chart can be exported to `JPEG`, `PNG`, `SVG`, or `PDF` format using the [`export`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/exportUtils#export) method. The input parameters for this method are: `type` for format and `fileName` for result. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/selection.md b/chart-sdk/angular/3d-charts/selection.md index 4b5e7ce87..cb5dcaffc 100644 --- a/chart-sdk/angular/3d-charts/selection.md +++ b/chart-sdk/angular/3d-charts/selection.md @@ -1,6 +1,6 @@ --- layout: post -title: Selection in Angular 3D Chart control | Syncfusion +title: Selection in Angular 3D Chart | Syncfusion description: Learn here all about selection in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -10,7 +10,7 @@ domainurl: https://help.syncfusion.com/chart-sdk -# Selection in Angular 3D Chart control +# Selection in Angular 3D Chart The 3D chart provides selection support for the series and its data points on mouse click. @@ -25,7 +25,7 @@ We have different types of selection mode for selecting a data. ## Point -To select a point, set the [`selectionMode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#selectionmode) property to **Point**. +To select a point, set the [`selectionMode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#selectionmode) property to **Point**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -41,7 +41,7 @@ To select a point, set the [`selectionMode`](https://ej2.syncfusion.com/angular/ ## Series -To select a series, set the [`selectionMode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#selectionmode) property to **Series**. +To select a series, set the [`selectionMode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#selectionmode) property to **Series**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -57,7 +57,7 @@ To select a series, set the [`selectionMode`](https://ej2.syncfusion.com/angular ## Cluster -To select the points that corresponds to the same index in all the series, set the [`selectionMode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#selectionmode) property to **Cluster**. +To select the points that corresponds to the same index in all the series, set the [`selectionMode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#selectionmode) property to **Cluster**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -73,7 +73,7 @@ To select the points that corresponds to the same index in all the series, set t ## Selection type -To select multiple points or series, enable the [`isMultiSelect`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#ismultiselect) property. +To select multiple points or series, enable the [`isMultiSelect`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#ismultiselect) property. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -89,7 +89,7 @@ To select multiple points or series, enable the [`isMultiSelect`](https://ej2.sy ## Selection during initial loading -In a 3D chart, selecting a point or series during initial loading can only be done programmatically. The [`selectedDataIndexes`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel/#selecteddataindexes) property can be used for this. +In a 3D chart, selecting a point or series during initial loading can only be done programmatically. The [`selectedDataIndexes`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/chart3DModel#selecteddataindexes) property can be used for this. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -105,7 +105,7 @@ In a 3D chart, selecting a point or series during initial loading can only be do ## Selection through legend -To select a point or series through legend use the [`toggleVisibility`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalLegendSettingsModel/#togglevisibility) property. Also, use [`enableHighlight`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalLegendSettingsModel/#enablehighlight) property for highlighting the series through legend. +To select a point or series through legend use the [`toggleVisibility`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalLegendSettingsModel#togglevisibility) property. Also, use [`enableHighlight`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalLegendSettingsModel#enablehighlight) property for highlighting the series through legend. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} diff --git a/chart-sdk/angular/3d-charts/tool-tip.md b/chart-sdk/angular/3d-charts/tool-tip.md index bae70b834..e135af382 100644 --- a/chart-sdk/angular/3d-charts/tool-tip.md +++ b/chart-sdk/angular/3d-charts/tool-tip.md @@ -1,6 +1,6 @@ --- layout: post -title: Tooltip in Angular 3D Chart control | Syncfusion +title: Tooltip in Angular 3D Chart | Syncfusion description: Learn here all about tooltip in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -8,7 +8,7 @@ documentation: ug domainurl: https://help.syncfusion.com/chart-sdk --- -# Tooltip in Angular 3D Chart control +# Tooltip in Angular 3D Chart diff --git a/chart-sdk/angular/3d-charts/working-with-data.md b/chart-sdk/angular/3d-charts/working-with-data.md index 2ff819ba2..eb9823df1 100644 --- a/chart-sdk/angular/3d-charts/working-with-data.md +++ b/chart-sdk/angular/3d-charts/working-with-data.md @@ -1,6 +1,6 @@ --- layout: post -title: Working with data source in Angular 3D Chart control | Syncfusion +title: Working with Data in Angular 3D Chart | Syncfusion description: Learn here all about working with data source in Syncfusion Angular 3D Chart control of Syncfusion Essential JS 2 and more. platform: chart-sdk control: 3D Chart @@ -9,11 +9,11 @@ domainurl: https://help.syncfusion.com/chart-sdk --- -# Working with data in Angular 3D Chart control +# Working with Data in Angular 3D Chart ## Local data -A simple JSON data can be bound to the 3D chart using [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#datasource) property in series. Now map the fields in JSON to [`xName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#xname) and [`yName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#yname) properties. +A simple JSON data can be bound to the 3D chart using [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#datasource) property in series. Now map the fields in JSON to [`xName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#xname) and [`yName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#yname) properties. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -29,7 +29,7 @@ A simple JSON data can be bound to the 3D chart using [`dataSource`](https://ej2 ## Remote data -The remote data can be bound to the 3D chart using the [`DataManager`](https://ej2.syncfusion.com/documentation/api/data/dataManager/). The `DataManager` requires minimal information like web service URL, adaptor and cross domain to interact with service endpoint properly. Assign the instance of the `DataManager` to the [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#datasource) property in series and map the fields of data to [`xName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#xname) and [`yName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#yname) properties. You can also use the [`query`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#query) property of the series to filter the data. +The remote data can be bound to the 3D chart using the [`DataManager`](https://ej2.syncfusion.com/documentation/api/data/dataManager/). The `DataManager` requires minimal information like web service URL, adaptor and cross domain to interact with service endpoint properly. Assign the instance of the `DataManager` to the [`dataSource`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#datasource) property in series and map the fields of data to [`xName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#xname) and [`yName`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#yname) properties. You can also use the [`query`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#query) property of the series to filter the data. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -61,7 +61,7 @@ The remote data can be bound to the 3D chart using the [`DataManager`](https://e ## Empty points -The data points that uses the `null` or `undefined` as value are considered as empty points. The empty data points are ignored and is not plotted in the chart. When the data is provided by using the points property, by using [`emptyPointSettings`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#emptypointsettings) property in series, the empty can be customized. The default [`mode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalEmptyPointSettingsModel/#mode) of the empty point is **Gap**. +The data points that uses the `null` or `undefined` as value are considered as empty points. The empty data points are ignored and is not plotted in the chart. When the data is provided by using the points property, by using [`emptyPointSettings`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#emptypointsettings) property in series, the empty can be customized. The default [`mode`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalEmptyPointSettingsModel#mode) of the empty point is **Gap**. {% tabs %} {% highlight ts tabtitle="app.component.ts" %} @@ -77,7 +77,7 @@ The data points that uses the `null` or `undefined` as value are considered as e **Customizing empty point** -The specific color for empty point can be set by the [`fill`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalEmptyPointSettingsModel/#fill) property in [`emptyPointSettings`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel/#emptypointsettings). +The specific color for empty point can be set by the [`fill`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/threeDimensionalEmptyPointSettingsModel#fill) property in [`emptyPointSettings`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/series3DModel#emptypointsettings). {% tabs %} {% highlight ts tabtitle="app.component.ts" %}