diff --git a/doc/python/colorscales.md b/doc/python/colorscales.md index fe2ac574227..7e2aeb9ad73 100644 --- a/doc/python/colorscales.md +++ b/doc/python/colorscales.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.3' - jupytext_version: 1.14.5 + jupytext_version: 1.14.6 kernelspec: display_name: Python 3 (ipykernel) language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.10.11 + version: 3.10.8 plotly: description: How to set, create and control continuous color scales and color bars in scatter, bar, map and heatmap figures. @@ -307,11 +307,11 @@ Using `labelalias` you can replace some labels on the `colorbar` with alternativ ```python import plotly.graph_objects as go -import urllib +import urllib.request as request import json # Load heatmap data -response = urllib.request.urlopen( +response = request.urlopen( "https://raw.githubusercontent.com/plotly/datasets/master/custom_heatmap_colorscale.json") dataset = json.load(response) diff --git a/doc/python/legend.md b/doc/python/legend.md index 9ca47748be1..49b989405b5 100644 --- a/doc/python/legend.md +++ b/doc/python/legend.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.3' - jupytext_version: 1.14.5 + jupytext_version: 1.14.6 kernelspec: display_name: Python 3 (ipykernel) language: python @@ -580,7 +580,7 @@ fig.show() By default, all traces appear on one legend. To have multiple legends, specify an alternative legend for a trace using the `legend` property. For a second legend, set `legend="legend2"`. Specify more legends with `legend="legend3"`, `legend="legend4"` and so on. -In this example, the last two scatter traces display on the second legend, "legend2". On the figure's layout, we then position and style this legend to display on the right of the graph below the first legend. +In this example, the last two scatter traces display on the second legend, "legend2". On the figure's layout, we then position and style each legend. ```python @@ -622,20 +622,25 @@ fig = go.Figure( ], layout=dict( title="GDP Per Capita", - legend={"title": "By country", "bgcolor": "Orange",}, + legend={ + "title": "By country", + "xref": "container", + "yref": "container", + "y": 0.65, + "bgcolor": "Orange", + }, legend2={ - "x": 1.155, - "y": 0.55, - "xanchor": "right", - "yanchor": "middle", + "title": "By continent", + "xref": "container", + "yref": "container", + "y": 0.85, "bgcolor": "Gold", - "title": {"text": "By continent"}, + }, ), ) fig.show() - ``` ### Positioning Legends @@ -666,7 +671,6 @@ fig = go.Figure( "xref": "container", "yref": "container", "bgcolor": "Gold", - "title": {"text": "By continent"}, }, ), ) diff --git a/doc/python/shapes.md b/doc/python/shapes.md index f44c6050c48..ca28a81bbb9 100644 --- a/doc/python/shapes.md +++ b/doc/python/shapes.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.3' - jupytext_version: 1.14.5 + jupytext_version: 1.14.6 kernelspec: display_name: Python 3 (ipykernel) language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.8.8 + version: 3.10.10 plotly: description: How to make SVG shapes in python. Examples of lines, circle, rectangle, and path. @@ -917,18 +917,27 @@ fig.show() *New in 5.15* -Use `texttemplate` to add text with variables to shapes. `texttemplate` uses d3 number and date formatting and supports raw variables, which use the raw data from the shape definition, and some calculated variables. Add a variable with "%{variable}". +Use `texttemplate` to add text with variables to shapes. You have access to raw variables (`x0`, `x1`, `y0`, `y1`), which use raw data values from the shape definition, and the following calculated variables: -This example adds the raw variables `x0` and `y0` to a rectangle and shows the calculated variables `height`, `slope`, and `width` on three other shapes. +- `xcenter`: (x0 + x1) / 2 +- `ycenter`: (y0 + y1) / 2 +- `dx`: x1 - x0 +- `dy`: y1 - y0 +- `width`: abs(x1 - x0) +- `height`: abs(y1 - y0) +- `length` (for lines only): sqrt(dx^2 + dy^2) +- `slope`: (y1 - y0) / (x1 - x0) -For a complete list of available variables, see the [Shape Reference Docs](https://plotly.com/python/reference/layout/shapes/). +`texttemplate` supports d3 number and date formatting. +Add a variable with "%{variable}". This example adds the raw variables `x0` and `y0` to a rectangle and shows the calculated variables `height`, `slope`, `length`, and `width` on three other shapes. ```python import plotly.graph_objects as go fig = go.Figure() + fig.add_shape( type="rect", fillcolor="MediumSlateBlue", @@ -955,9 +964,12 @@ fig.add_shape( x0=3, y0=0.5, x1=5, - y1=0.8, + y1=1.5, line_width=3, - label=dict(texttemplate="Slope: %{slope:.3f}", font=dict(size=20)), + label=dict( + texttemplate="Slope of %{slope:.3f} and length of %{length:.3f}", + font=dict(size=20), + ), ) fig.add_shape( type="rect", @@ -980,15 +992,31 @@ fig.show() *New in 5.15* -Use `texttemplate` to add text with variables to new shapes drawn on the graph. This example figure is configured to allow the user to draw lines and automatically labels each line with its slope. Select **Draw line** in the modebar to try it out. +You can also use `texttemplate` to add text with variables to new shapes drawn on the graph. + +In this example, we enable drawing lines on the figure by adding `drawline` to `modeBarButtonsToAdd` in `config`. We then define a `texttemplate` for shapes that shows the calculated variable `dy`. Select **Draw line** in the modebar to try it out. ```python import plotly.graph_objects as go +from plotly import data + +df = data.stocks() fig = go.Figure( - layout=go.Layout(newshape=dict(label=dict(texttemplate="Slope: %{slope:.3f}"))) + data=go.Scatter( + x=df.date, + y=df.GOOG, + ), + layout=go.Layout( + yaxis=dict(title="Price in USD"), + newshape=dict( + label=dict(texttemplate="Change: %{dy:.2f}") + ), + title="Google Share Price 2018/2019", + ), ) + fig.show( config={ "modeBarButtonsToAdd": [ @@ -996,7 +1024,6 @@ fig.show( ] } ) - ``` ### Reference