Skip to content

SEO-2557 - ReactJS renamed image #152

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

Open
wants to merge 1 commit into
base: hotfix/hotfix-v20.2.0.43
Choose a base branch
from
Open

SEO-2557 - ReactJS renamed image #152

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 18 additions & 18 deletions ReactJS/Chart/3D-Chart.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
layout: post
title: 3D Chart types available in Essential JavaScript Chart
description: Learn about the different types of 3D charts supported by Syncfusion Essential JavaScript Chart and how to customize the 3D view.
platform: js
title: 3D in ReactJS Chart Control | Syncfusion
description: Learn here all about 3D support in Syncfusion Essential ReactJS Chart control, its elements, and more.
platform: ReactJS
control: Chart
documentation: ug
api : /api/js/ejchart
---

# 3D Chart
# 3D Chart in ReactJS 3D Chart

Essential 3D Chart for JavaScript allows you to view 8 chart types in 3D view such as [`Bar`](chart-types#bar-chart), [`StackingBar`](chart-types#stacked-bar-chart), [`StackingBar100`](chart-types#stacked-bar-chart-1), [`Column`](chart-types#column-chart), [`Stacked Column`](chart-types#stacked-column-chart), [`100% Stacked Column`](chart-types#stacked-column-chart-1), [`Pie`](chart-types#pie-chart), [`Doughnut`](chart-types#doughnut-chart).

Expand Down Expand Up @@ -44,7 +44,7 @@ For rendering a 3D Column Chart, specify the series [`type`](../api/ejchart#memb
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img1.png)
![ReactJS Chart 3D Column](3D-Chart_images/3D-Chart_img1.png)


[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/column) here to view the 3D Column Chart online demo sample.
Expand Down Expand Up @@ -80,7 +80,7 @@ You can create a 3D Bar Chart by setting the series [`type`](../api/ejchart#memb
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img2.png)
![ReactJS Chart 3D Bar](3D-Chart_images/3D-Chart_img2.png)


[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/bar) here to view the 3D Bar Chart online demo sample.
Expand Down Expand Up @@ -121,7 +121,7 @@ Stacking Column 3DChart is rendered by specifying the series [`type`](../api/ejc
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img3.png)
![ReactJS Chart 3D Stacked Column](3D-Chart_images/3D-Chart_img3.png)

[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/stackedcolumn) here to view the Stacked Column 3DChart online demo sample.

Expand Down Expand Up @@ -161,7 +161,7 @@ Stacking Column 3DChart is rendered by specifying the series [`type`](../api/ejc
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img4.png)
![ReactJS Chart 3D 100% Stacked Column](3D-Chart_images/3D-Chart_img4.png)


[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/100%stackedcolumn) here to view the 100% Stacked Column 3DChart online demo sample.
Expand Down Expand Up @@ -202,7 +202,7 @@ To create Stacking Bar 3DChart, set the series [`type`](../api/ejchart#members:s
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img5.png)
![ReactJS Chart 3D Stacked Bar](3D-Chart_images/3D-Chart_img5.png)

[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/stackedbar) here to view the Stacked Bar 3DChart online demo sample.

Expand Down Expand Up @@ -242,7 +242,7 @@ You can create 100% Stacking Bar 3DChart by setting the series [`type`](../api/e
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img6.png)
![ReactJS Chart 3D 100% Stacked Bar](3D-Chart_images/3D-Chart_img6.png)

[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/100%stackedbar) here to view the 100% Stacking Bar 3DChart online demo sample.

Expand Down Expand Up @@ -278,7 +278,7 @@ To render the Pie Chart in 3D view, enable the **enbel3D** option in the chart a
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img7.png)
![ReactJS Chart 3D Pie](3D-Chart_images/3D-Chart_img7.png)

[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/pie) here to view the Pie 3DChart online demo sample.

Expand Down Expand Up @@ -314,7 +314,7 @@ To render the Doughnut Chart in 3D view, enable the **enbel3D** option in the ch
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img8.png)
![ReactJS Chart 3D Doughnut](3D-Chart_images/3D-Chart_img8.png)


[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/doughnut) here to view the Doughnut 3DChart online demo sample.
Expand Down Expand Up @@ -345,7 +345,7 @@ To render the EjChart in 3D view, set the [`enable3D`](../api/ejchart#members:en
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img9.png)
![ReactJS Chart 3D View](3D-Chart_images/3D-Chart_img9.png)

[Click](http://js.syncfusion.com/demos/web/#!/azure/chart/3d/column) here to view the 3DChart online demo sample.

Expand All @@ -371,7 +371,7 @@ To render the EjChart in 3D view, set the [`enable3D`](../api/ejchart#members:en
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img10.png)
![ReactJS Chart Placing Bar](3D-Chart_images/3D-Chart_img10.png)


### Setting Axis Wall Size
Expand All @@ -395,7 +395,7 @@ In 3DChart, Cartesian axes lines are represented as walls and it defines the wid
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img11.png)
![ReactJS Chart Setting Axis Wall Size](3D-Chart_images/3D-Chart_img11.png)


### 3D Depth
Expand All @@ -418,7 +418,7 @@ By using the [`depth`](../api/ejchart#members:depth) property, you can view the
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img12.png)
![ReactJS Chart 3D Depth](3D-Chart_images/3D-Chart_img12.png)


### Rotating and Tilting 3D Chart
Expand Down Expand Up @@ -449,7 +449,7 @@ To spin the 3D Chart on mouse dragging, enable [`enableRotation`](../api/ejchart
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img13.png)
![ReactJS Chart Rotating and Tilting 3D](3D-Chart_images/3D-Chart_img13.png)


### PerspectiveAngle
Expand All @@ -473,4 +473,4 @@ The [`perspectiveAngle`](../api/ejchart#members:perspectiveangle) specifies the
{% endhighlight %}


![](/js/Chart/3D-Chart_images/3D-Chart_img14.png)
![ReactJS Chart Perspective Angle](3D-Chart_images/3D-Chart_img14.png)