Skip to content

Commit 1e62371

Browse files
author
“mahdis-z”
committed
added an example from v3
1 parent 85a47a7 commit 1e62371

File tree

1 file changed

+30
-1
lines changed

1 file changed

+30
-1
lines changed

python/hover-text-and-formatting.md

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,6 +110,33 @@ To customize the tooltip on your graph you can use [hovertemplate](https://plot.
110110
This template string can include `variables` in %{variable} format, `numbers` in [d3-format's syntax](https://github.com/d3/d3-3.x-api-reference/blob/master/Formatting.md#d3_forma), and `date` in [d3-time-fomrat's syntax](https://github.com/d3/d3-3.x-api-reference/blob/master/Time-Formatting.md#format).
111111
Hovertemplate customize the tooltip text vs. [texttemplate](https://plot.ly/python/reference/#pie-texttemplate) which customizes the text that appears on your chart.
112112

113+
```python
114+
import plotly.graph_objs as go
115+
import plotly.io as pio
116+
117+
fig = go.Figure(go.Scatter(
118+
x = [1,2,3,4,5],
119+
y = [2.02825,1.63728,6.83839,4.8485,4.73463],
120+
hovertemplate =
121+
'<i>Price</i>: $%{y:.2f}'+
122+
'<br><b>X</b>: %{x}<br>'+
123+
'<b>%{text}</b>',
124+
text = ['Custom text {}'.format(i + 1) for i in range(5)],
125+
showlegend = False))
126+
127+
fig.add_trace(go.Scatter(
128+
x = [1,2,3,4,5],
129+
y = [3.02825,2.63728,4.83839,3.8485,1.73463],
130+
hovertemplate = 'Price: %{y:$.2f}<extra></extra>',
131+
showlegend = False))
132+
133+
fig.update_layout(
134+
title = "Set hover text with hovertemplate",
135+
template = pio.templates['plotly'])
136+
137+
fig.show()
138+
```
139+
113140
```python
114141
import plotly.graph_objects as go
115142

@@ -124,7 +151,9 @@ fig = go.Figure(go.Pie(
124151
fig.show()
125152
```
126153

127-
### Format Hover Template
154+
### Advanced Hover Template
155+
### Advanced Hover Template
156+
The following example shows how to format hover template. [Here](https://plot.ly/python/v3/hover-text-and-formatting/#dash-example) is an example to see how to format hovetemplate in Dash.
128157

129158
```python
130159
import plotly.graph_objects as go

0 commit comments

Comments
 (0)