Skip to content

documentation(101780): Improved angular chart UG against AI #88

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
smukilansf3478 wants to merge 5 commits into from
Closed

documentation(101780): Improved angular chart UG against AI #88

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
1db8b62
101780: Improved angular chart UG against AI
smukilansf3478 Aug 21, 2026
a308a5e
101780: Improved angular chart UG against AI
smukilansf3478 Aug 21, 2026
5ddae46
101780: Improved angular chart UG against AI
smukilansf3478 Aug 21, 2026
91ea4f7
101780: Improved chart UG against AI.
smukilansf3478 Aug 31, 2026
10b8ca8
Merge branch 'development' of https://github.com/syncfusion-content/c…
smukilansf3478 Aug 31, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
The diff you're trying to view is too large. We only load the first 3000 changed files.
81 changes: 0 additions & 81 deletions chart-sdk/Release-Notes/v34.2.5.md
View file
Open in desktop

This file was deleted.

4 changes: 2 additions & 2 deletions chart-sdk/angular/3d-charts/accessibility.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
layout: post
title: Accessibility in Angular 3D Chart | Syncfusion
title: Accessibility in Angular 3D Chart control | 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
documentation: ug
domainurl: https://help.syncfusion.com/chart-sdk
---

# Accessibility in Angular 3D Chart
# Accessibility in Angular 3D Chart control

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.

Expand Down
42 changes: 21 additions & 21 deletions chart-sdk/angular/3d-charts/appearance.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@ documentation: ug
domainurl: https://help.syncfusion.com/chart-sdk
---

# Appearance in Angular 3D Chart
# Appearance in Angular 3D Chart control

## 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" %}
Expand All @@ -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" %}
Expand All @@ -48,7 +48,7 @@ The color for the points can be bound from the [`dataSource`](https://ej2.syncfu

## Point level customization

The data label and fill color of each data point can be customized using the [`pointRender`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/i3DPointRenderEventArgs) and [`textRender`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/i3DTextRenderEventArgs) events.
The data label and fill color of each data point can be customized using the [`pointRender`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/i3DPointRenderEventArgs/) and [`textRender`](https://ej2.syncfusion.com/angular/documentation/api/chart3d/i3DTextRenderEventArgs/) events.

{% tabs %}
{% highlight ts tabtitle="app.component.ts" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand All @@ -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" %}
Expand Down
Loading