Skip to content

V4.3 docs #192

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

Merged
merged 24 commits into from
Nov 12, 2019
Merged

V4.3 docs #192

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
cfac436
new tutorial on displaying image data
emmanuelle Nov 1, 2019
2056d13
minor changes
emmanuelle Nov 5, 2019
6ac3f3d
Document simple_white template
joelostblom Nov 5, 2019
dbbfad2
Change number of themes
joelostblom Nov 5, 2019
10d64b9
minor changes
emmanuelle Nov 6, 2019
4654c06
updated how to disable ticks
emmanuelle Nov 6, 2019
f97dfc4
zmax update
emmanuelle Nov 7, 2019
1aa14f0
Merge pull request #169 from joelostblom/Document-simple_white-template
nicolaskruchten Nov 11, 2019
e41bc91
Merge branch 'master' into v4.3-docs
nicolaskruchten Nov 12, 2019
878d394
Update animations.md
nicolaskruchten Nov 11, 2019
d39828e
added example about facet_col_wrap, and one example for disabling axi…
emmanuelle Nov 4, 2019
2b03f57
unmatched facet warning
nicolaskruchten Nov 12, 2019
7756589
Merge pull request #166 from plotly/facet_col_wrap
nicolaskruchten Nov 12, 2019
4f3bc89
new tutorial on displaying image data
emmanuelle Nov 1, 2019
67c1830
minor changes
emmanuelle Nov 5, 2019
cc59b3c
minor changes
emmanuelle Nov 6, 2019
9d01e29
updated how to disable ticks
emmanuelle Nov 6, 2019
4e93741
zmax update
emmanuelle Nov 7, 2019
7696258
Merge branch 'image' of https://github.com/plotly/plotly.py-docs into…
emmanuelle Nov 12, 2019
bd06f3b
fix color_continuous_scale
emmanuelle Nov 12, 2019
46a3a33
Merge pull request #163 from plotly/image
nicolaskruchten Nov 12, 2019
89e1943
Merge branch 'master' into v4.3-docs
nicolaskruchten Nov 12, 2019
01adb32
fixing kwarg error
nicolaskruchten Nov 12, 2019
43d1ed1
fixing duplicate permalink
nicolaskruchten Nov 12, 2019
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
Prev Previous commit
Next Next commit
minor changes
  • Loading branch information
@emmanuelle @nicolaskruchten
emmanuelle authored and nicolaskruchten committed Nov 12, 2019
commit 67c18302626f3fe2b9c2e59493d53153be6f26e8
42 changes: 18 additions & 24 deletions python/images.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ jupyter:

#### Add a Background Image

In this page we explain how to add static, non-interactive images as background, logo or annotation images to a figure. For exploring image data in interactive charts, see the [tutorial on displaying image data](./imshow/).
In this page we explain how to add static, non-interactive images as background, logo or annotation images to a figure. For exploring image data in interactive charts, see the [tutorial on displaying image data](/python/imshow).

```python
import plotly.graph_objects as go
Expand All @@ -48,8 +48,7 @@ fig.add_trace(
)

# Add images
fig.update_layout(
images=[
fig.add_layout_image(
go.layout.Image(
source="https://images.plot.ly/language-icons/api-home/python-logo.png",
xref="x",
Expand All @@ -61,7 +60,6 @@ fig.update_layout(
sizing="stretch",
opacity=0.5,
layer="below")
]
)

# Set templates
Expand Down Expand Up @@ -114,14 +112,14 @@ fig.add_trace(
)

# Add image
fig.update_layout(
images=[dict(
fig.add_layout_image(
dict(
source="https://raw.githubusercontent.com/cldougl/plot_images/add_r_img/vox.png",
xref="paper", yref="paper",
x=1, y=1.05,
sizex=0.2, sizey=0.2,
xanchor="right", yanchor="bottom"
)],
)
)

# update layout properties
Expand Down Expand Up @@ -173,30 +171,26 @@ for (x, y), n in zip(simulated_absorptions, names):
fig.add_trace(go.Scatter(x=x, y=y, name=n))

# Add images
fig.update_layout(
images=[go.layout.Image(
fig.add_layout_image(
go.layout.Image(
source="https://raw.githubusercontent.com/michaelbabyn/plot_data/master/benzene.png",
xref="paper",
yref="paper",
x=0.75,
y=0.65,
sizex=0.3,
sizey=0.3,
xanchor="right",
yanchor="bottom"
), go.layout.Image(
))
fig.add_layout_image(go.layout.Image(
source="https://raw.githubusercontent.com/michaelbabyn/plot_data/master/naphthalene.png",
xref="paper",
yref="paper",
x=0.9,
y=0.3,
)
)
fig.update_layout_images(dict(
xref="paper",
yref="paper",
sizex=0.3,
sizey=0.3,
xanchor="right",
yanchor="bottom"
)
]
)
))

# Add annotations
fig.update_layout(
Expand Down Expand Up @@ -279,8 +273,8 @@ fig.update_yaxes(
)

# Add image
fig.update_layout(
images=[go.layout.Image(
fig.add_layout_image(
go.layout.Image(
x=0,
sizex=img_width * scale_factor,
y=img_height * scale_factor,
Expand All @@ -290,7 +284,7 @@ fig.update_layout(
opacity=1.0,
layer="below",
sizing="stretch",
source="https://raw.githubusercontent.com/michaelbabyn/plot_data/master/bridge.jpg")]
source="https://raw.githubusercontent.com/michaelbabyn/plot_data/master/bridge.jpg")
)

# Configure other layout
Expand Down
11 changes: 7 additions & 4 deletions python/imshow.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,10 @@ jupyter:
v4upgrade: true
---

This tutorial shows how to display and explore image data. If you would like
instead a logo or static image, use `go.layout.Image` as explained
[here](/python/images).

### Displaying RBG image data with px.imshow

`px.imshow` displays multichannel (RGB) or single-channel ("grayscale") image data.
Expand Down Expand Up @@ -73,7 +77,7 @@ fig.show()

### Display single-channel 2D image as grayscale

For a 2D image, `px.imshows` uses a colorscale to map scalar data to colors. The default colorscale is `gray`, ie grayscale images.
For a 2D image, `px.imshow` uses a colorscale to map scalar data to colors. The default colorscale is `gray`, ie grayscale images.

```python
import plotly.express as px
Expand All @@ -85,7 +89,6 @@ fig.show()

### Choose the colorscale to display a single-channel image

For a 2D image, `px.imshows` uses a colorscale to map scalar data to colors. The default colorscale is `gray`, ie grayscale images.

```python
import plotly.express as px
Expand All @@ -97,9 +100,9 @@ fig.show()

### Display multichannel image data with go.Image

It is also possible to use the `go.Image` trace from the low-level `graph_objects` API in order to display image data. Note that `go.Image` only accepts multichannel images. For single images, use [`go.Heatmap`](https://plot.ly/python/heatmaps/).
It is also possible to use the `go.Image` trace from the low-level `graph_objects` API in order to display image data. Note that `go.Image` only accepts multichannel images. For single images, use [`go.Heatmap`](/python/heatmaps).

Note that the `go.Image` trace is different from the `go.layout.Image` class, which can be used for [adding background images or logos to figures](./images/).
Note that the `go.Image` trace is different from the `go.layout.Image` class, which can be used for [adding background images or logos to figures](/python/images).

```python
import plotly.graph_objects as go
Expand Down