Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Commit acfd037

Browse filesBrowse files
authored
px examples for pie, funnel/funnelarea, sunburst/treemap (plotly#1995)
* pie chart tutorial using px * funnel chart * examples for sunburst and treemap * px intro
1 parent 9ecae0a commit acfd037
Copy full SHA for acfd037

File tree

Expand file treeCollapse file tree

4 files changed

+175
-25
lines changed
Filter options
Expand file treeCollapse file tree

4 files changed

+175
-25
lines changed

‎doc/python/funnel-charts.md

Copy file name to clipboardExpand all lines: doc/python/funnel-charts.md
+59-11Lines changed: 59 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,27 @@
11
---
22
jupyter:
33
jupytext:
4+
notebook_metadata_filter: plotly
45
text_representation:
56
extension: .md
67
format_name: markdown
7-
format_version: '1.1'
8-
jupytext_version: 1.1.1
8+
format_version: '1.2'
9+
jupytext_version: 1.3.0
910
kernelspec:
1011
display_name: Python 3
1112
language: python
1213
name: python3
1314
plotly:
14-
permalink: python/funnel-charts/
15-
redirect_from: python/funnel-chart/
1615
description: How to make funnel-chart plots in Python with Plotly.
17-
name: Funnel Chart
18-
thumbnail: thumbnail/funnel.jpg
19-
language: python
2016
display_as: financial
21-
order: 4
17+
language: python
2218
layout: base
19+
name: Funnel Chart
20+
order: 4
2321
page_type: example_index
22+
permalink: python/funnel-charts/
23+
redirect_from: python/funnel-chart/
24+
thumbnail: thumbnail/funnel.jpg
2425
---
2526

2627

@@ -29,7 +30,40 @@ jupyter:
2930
Funnel charts are often used to represent data in different stages of a business process. It’s an important mechanism in Business Intelligence to identify potential problem areas of a process. For example, it’s used to observe the revenue or loss in a sales process for each stage, and displays values that are decreasing progressively. Each stage is illustrated as a percentage of the total of all values.
3031

3132

32-
### Basic Funnel Plot
33+
### Basic Funnel Plot with plotly.express
34+
35+
[Plotly Express](/python/plotly-express/) is the easy-to-use, high-level interface to Plotly, which [operates on "tidy" data](/python/px-arguments/).
36+
37+
With `px.funnel`, each row of the DataFrame is represented as a stage of the funnel.
38+
39+
40+
```python
41+
import plotly.express as px
42+
data = dict(
43+
number=[39, 27.4, 20.6, 11, 2],
44+
stage=["Website visit", "Downloads", "Potential customers", "Requested price", "invoice sent"])
45+
fig = px.funnel(data, x='number', y='stage')
46+
fig.show()
47+
```
48+
49+
### Stacked Funnel Plot with plotly.express
50+
51+
```python
52+
import plotly.express as px
53+
import pandas as pd
54+
stages = ["Website visit", "Downloads", "Potential customers", "Requested price", "invoice sent"]
55+
df_mtl = pd.DataFrame(dict(number=[39, 27.4, 20.6, 11, 3], stage=stages))
56+
df_mtl['office'] = 'Montreal'
57+
df_toronto = pd.DataFrame(dict(number=[52, 36, 18, 14, 5], stage=stages))
58+
df_toronto['office'] = 'Toronto'
59+
df = pd.concat([df_mtl, df_toronto], axis=0)
60+
fig = px.funnel(df, x='number', y='stage', color='office')
61+
fig.show()
62+
```
63+
64+
### Basic Funnel Chart with graph_objects trace go.Funnel
65+
66+
If Plotly Express does not provide a good starting point, it is also possible to use the more generic `go.Funnel` function from `plotly.graph_objects`.
3367

3468
```python
3569
from plotly import graph_objects as go
@@ -60,7 +94,7 @@ fig = go.Figure(go.Funnel(
6094
fig.show()
6195
```
6296

63-
### Stacked Funnel Plot
97+
### Stacked Funnel Plot with go.Funnel
6498

6599
```python
66100
from plotly import graph_objects as go
@@ -92,7 +126,21 @@ fig.add_trace(go.Funnel(
92126
fig.show()
93127
```
94128

95-
#### Basic Area Funnel Plot
129+
### Basic Area Funnel Plot with plotly.express
130+
131+
With `px.funnel_area`, each row of the DataFrame is represented as a stage of
132+
the funnel.
133+
134+
```python
135+
import plotly.express as px
136+
fig = px.funnel_area(names=["The 1st","The 2nd", "The 3rd", "The 4th", "The 5th"],
137+
values=[5, 4, 3, 2, 1])
138+
fig.show()
139+
```
140+
141+
### Basic Area Funnel Plot with go.Funnelarea
142+
143+
If Plotly Express does not provide a good starting point, it is also possible to use the more generic `go.Funnelarea` function from `plotly.graph_objects`.
96144

97145
```python
98146
from plotly import graph_objects as go

‎doc/python/pie-charts.md

Copy file name to clipboardExpand all lines: doc/python/pie-charts.md
+61-4Lines changed: 61 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ jupyter:
55
text_representation:
66
extension: .md
77
format_name: markdown
8-
format_version: '1.1'
9-
jupytext_version: 1.1.1
8+
format_version: '1.2'
9+
jupytext_version: 1.3.0
1010
kernelspec:
1111
display_name: Python 3
1212
language: python
@@ -33,9 +33,66 @@ jupyter:
3333
thumbnail: thumbnail/pie-chart.jpg
3434
---
3535

36-
### Basic Pie Chart ###
36+
A pie chart is a circular statistical chart, which is divided into sectors to illustrate numerical proportion.
3737

38-
A pie chart ``go.Pie`` object is a circular statistical chart, which is divided into sectors to illustrate numerical proportion. Data visualized by the sectors of the pie is set in `values`. The sector labels are set in `labels`. The sector colors are set in `marker.colors`.
38+
If you're looking instead for a multilevel hierarchical pie-like chart, go to the
39+
[Sunburst tutorial](/python/sunburst-charts/).
40+
41+
### Pie chart with plotly express
42+
43+
[Plotly Express](/python/plotly-express/) is the easy-to-use, high-level interface to Plotly, which [operates on "tidy" data](/python/px-arguments/).
44+
45+
In `px.pie`, data visualized by the sectors of the pie is set in `values`. The sector labels are set in `names`.
46+
47+
```python
48+
import plotly.express as px
49+
df = px.data.gapminder().query("year == 2007").query("continent == 'Europe'")
50+
df.loc[df['pop'] < 2.e6, 'country'] = 'Other countries' # Represent only large countries
51+
fig = px.pie(df, values='pop', names='country', title='Population of European continent')
52+
fig.show()
53+
```
54+
55+
### Pie chart with repeated labels
56+
57+
Lines of the dataframe with the same value for `names` are grouped together in the same sector.
58+
59+
```python
60+
import plotly.express as px
61+
# This dataframe has 244 lines, but 4 distinct values for `day`
62+
df = px.data.tips()
63+
fig = px.pie(df, values='tip', names='day')
64+
fig.show()
65+
```
66+
67+
### Setting the color of pie sectors with px.pie
68+
69+
```python
70+
import plotly.express as px
71+
df = px.data.tips()
72+
fig = px.pie(df, values='tip', names='day', color_discrete_sequence=px.colors.sequential.RdBu)
73+
fig.show()
74+
```
75+
76+
### Customizing a pie chart created with px.pie
77+
78+
In the example below, we first create a pie chart with `px,pie`, using some of its options such as `hover_data` (which columns should appear in the hover) or `labels` (renaming column names). For further tuning, we call `fig.update_traces` to set other parameters of the chart (you can also use `fig.update_layout` for changing the layout).
79+
80+
```python
81+
import plotly.express as px
82+
df = px.data.gapminder().query("year == 2007").query("continent == 'Americas'")
83+
fig = px.pie(df, values='pop', names='country',
84+
title='Population of American continent',
85+
hover_data=['lifeExp'], labels={'lifeExp':'life expectancy'})
86+
fig.update_traces(textposition='inside', textinfo='percent+label')
87+
fig.show()
88+
```
89+
90+
### Basic Pie Chart with go.Pie
91+
92+
If Plotly Express does not provide a good starting point, it is also possible to use the more generic `go.Pie` function from `plotly.graph_objects`.
93+
94+
95+
In `go.Pie`, data visualized by the sectors of the pie is set in `values`. The sector labels are set in `labels`. The sector colors are set in `marker.colors`.
3996

4097
If you're looking instead for a multilevel hierarchical pie-like chart, go to the
4198
[Sunburst tutorial](/python/sunburst-charts/).

‎doc/python/sunburst-charts.md

Copy file name to clipboardExpand all lines: doc/python/sunburst-charts.md
+31-5Lines changed: 31 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ jupyter:
55
text_representation:
66
extension: .md
77
format_name: markdown
8-
format_version: '1.1'
9-
jupytext_version: 1.1.1
8+
format_version: '1.2'
9+
jupytext_version: 1.3.0
1010
kernelspec:
1111
display_name: Python 3
1212
language: python
@@ -33,14 +33,40 @@ jupyter:
3333
thumbnail: thumbnail/sunburst.gif
3434
---
3535

36-
### Basic Sunburst Plot ###
37-
Sunburst plots visualize hierarchical data spanning outwards radially from root to leaves. The sunburst sector hierarchy is determined by the entries in `labels` and in `parents`. The root starts from the center and children are added to the outer rings.
36+
Sunburst plots visualize hierarchical data spanning outwards radially from root to leaves. The sunburst sector hierarchy is determined by the entries in `labels` (`names` in `px.sunburst`) and in `parents`. The root starts from the center and children are added to the outer rings.
3837

3938
Main arguments:
40-
1. `labels`: sets the labels of sunburst sectors.
39+
1. `labels` (`names` in `px.sunburst` since `labels` is reserved for overriding columns names): sets the labels of sunburst sectors.
4140
2. `parents`: sets the parent sectors of sunburst sectors. An empty string `''` is used for the root node in the hierarchy. In this example, the root is "Eve".
4241
3. `values`: sets the values associated with sunburst sectors, determining their width (See the `branchvalues` section below for different modes for setting the width).
4342

43+
### Basic Sunburst Plot with plotly.express
44+
45+
[Plotly Express](/python/plotly-express/) is the easy-to-use, high-level interface to Plotly, which [operates on "tidy" data](/python/px-arguments/).
46+
47+
With `px.sunburst`, each row of the DataFrame is represented as a sector of the sunburst.
48+
49+
```python
50+
import plotly.express as px
51+
data = dict(
52+
character=["Eve", "Cain", "Seth", "Enos", "Noam", "Abel", "Awan", "Enoch", "Azura"],
53+
parent=["", "Eve", "Eve", "Seth", "Seth", "Eve", "Eve", "Awan", "Eve" ],
54+
value=[10, 14, 12, 10, 2, 6, 6, 4, 4])
55+
56+
fig =px.sunburst(
57+
data,
58+
names='character',
59+
parents='parent',
60+
values='value',
61+
)
62+
fig.show()
63+
```
64+
65+
### Basic Sunburst Plot with go.Sunburst
66+
67+
If Plotly Express does not provide a good starting point, it is also possible to use the more generic `go.Sunburst` function from `plotly.graph_objects`.
68+
69+
4470
```python
4571
import plotly.graph_objects as go
4672

‎doc/python/treemaps.md

Copy file name to clipboardExpand all lines: doc/python/treemaps.md
+24-5Lines changed: 24 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ jupyter:
55
text_representation:
66
extension: .md
77
format_name: markdown
8-
format_version: '1.1'
9-
jupytext_version: 1.1.1
8+
format_version: '1.2'
9+
jupytext_version: 1.3.0
1010
kernelspec:
1111
display_name: Python 3
1212
language: python
@@ -33,9 +33,28 @@ jupyter:
3333
thumbnail: thumbnail/treemap.png
3434
---
3535

36-
### Basic Treemap
3736

38-
[Treemap charts](https://en.wikipedia.org/wiki/Treemapping) visualize hierarchical data using nested rectangles. Same as [Sunburst](https://plot.ly/python/sunburst-charts/) the hierarchy is defined by [labels](https://plot.ly/python/reference/#treemap-labels) and [parents](https://plot.ly/python/reference/#treemap-parents) attributes. Click on one sector to zoom in/out, which also displays a pathbar in the upper-left corner of your treemap. To zoom out you can use the path bar as well.
37+
[Treemap charts](https://en.wikipedia.org/wiki/Treemapping) visualize hierarchical data using nested rectangles. Same as [Sunburst](https://plot.ly/python/sunburst-charts/) the hierarchy is defined by [labels](https://plot.ly/python/reference/#treemap-labels) (`names` for `px.treemap`) and [parents](https://plot.ly/python/reference/#treemap-parents) attributes. Click on one sector to zoom in/out, which also displays a pathbar in the upper-left corner of your treemap. To zoom out you can use the path bar as well.
38+
39+
### Basic Treemap with plotly.express
40+
41+
[Plotly Express](/python/plotly-express/) is the easy-to-use, high-level interface to Plotly, which [operates on "tidy" data](/python/px-arguments/).
42+
43+
With `px.treemap`, each row of the DataFrame is represented as a sector of the treemap.
44+
45+
```python
46+
import plotly.express as px
47+
fig = px.treemap(
48+
names = ["Eve","Cain", "Seth", "Enos", "Noam", "Abel", "Awan", "Enoch", "Azura"],
49+
parents = ["", "Eve", "Eve", "Seth", "Seth", "Eve", "Eve", "Awan", "Eve"]
50+
)
51+
fig.show()
52+
```
53+
54+
### Basic Treemap with go.Treemap
55+
56+
If Plotly Express does not provide a good starting point, it is also possible to use the more generic `go.Treemap` function from `plotly.graph_objects`.
57+
3958

4059
```python
4160
import plotly.graph_objects as go
@@ -269,4 +288,4 @@ fig.show()
269288
```
270289

271290
#### Reference
272-
See https://plot.ly/python/reference/#treemap for more information and chart attribute options!
291+
See https://plot.ly/python/reference/#treemap for more information and chart attribute options!

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.