Skip to content

SEO-1870_Site_Audit_Issues_React #31

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.

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-v19.4.0.38
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
30 changes: 15 additions & 15 deletions ReactJS/Chart/3D-Chart.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ documentation: ug
api : /api/js/ejchart
---

# 3D Chart
# 3D Chart in Syncfusion ReactJS

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 3D Chart](/js/Chart/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 3D Bar Chart](/js/Chart/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 3D Stacked Column Chart](/js/Chart/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 3D 100% Stacked Column Chart](/js/Chart/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 3D Stacked Bar Chart](/js/Chart/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 3D 100% Stacked Bar Chart](/js/Chart/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 3D Pie Chart](/js/Chart/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 3D Doughnut Chart](/js/Chart/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 3D View](/js/Chart/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 Placing Bar](/js/Chart/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 Setting Axis Wall Size](/js/Chart/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 3D Depth](/js/Chart/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 Rotating and Tilting 3D Chart](/js/Chart/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 PerspectiveAngle](/js/Chart/3D-Chart_images/3D-Chart_img14.png)
Loading