From f4e94d1fbb4c81ad747b58a28ce7471aac553b9e Mon Sep 17 00:00:00 2001 From: xhlulu Date: Mon, 7 Dec 2020 16:21:47 -0500 Subject: [PATCH 1/2] Added 11 new Dash Snippets renderers builtin-colorscales interactive-html-export network-graphs multiple-axes mapbox-county-choropleth knn-classification roc-and-pr-curves pca-visualization troubleshooting horizontal-vertical-shapes --- doc/python/builtin-colorscales.md | 17 +++++++++++++++-- doc/python/horizontal-vertical-shapes.md | 17 +++++++++++++++-- doc/python/interactive-html-export.md | 19 ++++++++++++++++--- doc/python/mapbox-county-choropleth.md | 17 +++++++++++++++-- doc/python/ml-knn.md | 19 ++++++++++++++++--- doc/python/ml-pca.md | 21 +++++++++++++++++---- doc/python/ml-roc-pr.md | 19 ++++++++++++++++--- doc/python/multiple-axes.md | 19 ++++++++++++++++--- doc/python/network-graphs.md | 21 +++++++++++++++++---- doc/python/renderers.md | 18 ++++++++++++++++-- doc/python/troubleshooting.md | 17 +++++++++++++---- 11 files changed, 172 insertions(+), 32 deletions(-) diff --git a/doc/python/builtin-colorscales.md b/doc/python/builtin-colorscales.md index 1fede07a2d1..5015146bbe8 100644 --- a/doc/python/builtin-colorscales.md +++ b/doc/python/builtin-colorscales.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.4.2 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: A reference for the built-in named continuous (sequential, diverging and cylclical) color scales in Plotly. @@ -74,6 +74,19 @@ import plotly.express as px print(px.colors.sequential.Plasma) ``` +### Continuous Color Scales in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'builtin-colorscales', width='100%', height=630) +``` + ### Built-In Sequential Color scales A collection of predefined sequential colorscales is provided in the `plotly.colors.sequential` module. Sequential color scales are appropriate for most continuous data, but in some cases it can be helpful to use a diverging or cyclical color scale (see below). diff --git a/doc/python/horizontal-vertical-shapes.md b/doc/python/horizontal-vertical-shapes.md index cdc3f22c3e8..f75a8ebf88d 100644 --- a/doc/python/horizontal-vertical-shapes.md +++ b/doc/python/horizontal-vertical-shapes.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.4.2 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: How to add annotated horizontal and vertical lines in Python. display_as: file_settings @@ -67,6 +67,19 @@ fig.add_hrect(y0=0.9, y1=2.6, line_width=0, fillcolor="red", opacity=0.2) fig.show() ``` +#### Horizontal and vertical lines in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'horizontal-vertical-shapes', width='100%', height=630) +``` + #### Adding Text Annotations [Text annotations](/python/text-and-annotations) can optionally be added to an autoshape diff --git a/doc/python/interactive-html-export.md b/doc/python/interactive-html-export.md index c986f234381..901b6b10f51 100644 --- a/doc/python/interactive-html-export.md +++ b/doc/python/interactive-html-export.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.3.1 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.6.8 + version: 3.7.6 plotly: description: Plotly allows you to save interactive HTML versions of your figures to your local disk. @@ -56,10 +56,23 @@ fig.write_html("path/to/file.html") By default, the resulting HTML file is a fully self-contained HTML file which can be uploaded to a web server or shared via email or other file-sharing mechanisms. The downside to this approach is that the file is very large (5Mb+) because it contains an inlined copy of the Plotly.js library required to make the figure interactive. This can be controlled via the `include_plotlyjs` argument (see below). +### HTML export in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'interactive-html-export', width='100%', height=630) +``` + ### Full Parameter Documentation ```python import plotly.graph_objects as go help(go.Figure.write_html) -``` \ No newline at end of file +``` diff --git a/doc/python/mapbox-county-choropleth.md b/doc/python/mapbox-county-choropleth.md index 6851ebe03df..15a0f2bb0b8 100644 --- a/doc/python/mapbox-county-choropleth.md +++ b/doc/python/mapbox-county-choropleth.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.4.2 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: How to make a Mapbox Choropleth Map of US Counties in Python with Plotly. @@ -107,6 +107,19 @@ fig.update_layout(margin={"r":0,"t":0,"l":0,"b":0}) fig.show() ``` +### Choropleth maps in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'mapbox-county-choropleth', width='100%', height=630) +``` + ### Indexing by GeoJSON Properties If the GeoJSON you are using either does not have an `id` field or you wish you use one of the keys in the `properties` field, you may use the `featureidkey` parameter to specify where to match the values of `locations`. diff --git a/doc/python/ml-knn.md b/doc/python/ml-knn.md index 676d07f2be6..ac54b3993b5 100644 --- a/doc/python/ml-knn.md +++ b/doc/python/ml-knn.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.4.2 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: Visualize scikit-learn's k-Nearest Neighbors (kNN) classification in Python with Plotly. @@ -236,6 +236,19 @@ fig.add_trace( fig.show() ``` +## k-NN classification in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'knn-classification', width='100%', height=630) +``` + ## Multi-class prediction confidence with [`go.Heatmap`](https://plotly.com/python/heatmaps/) It is also possible to visualize the prediction confidence of the model using [heatmaps](https://plotly.com/python/heatmaps/). In this example, you can see how to compute how confident the model is about its prediction at every point in the 2D grid. Here, we define the confidence as the difference between the highest score and the score of the other classes summed, at a certain point. @@ -321,4 +334,4 @@ Learn more about `px`, `go.Contour`, and `go.Heatmap` here: This tutorial was inspired by amazing examples from the official scikit-learn docs: * https://scikit-learn.org/stable/auto_examples/neighbors/plot_classification.html * https://scikit-learn.org/stable/auto_examples/classification/plot_classifier_comparison.html -* https://scikit-learn.org/stable/auto_examples/datasets/plot_iris_dataset.html \ No newline at end of file +* https://scikit-learn.org/stable/auto_examples/datasets/plot_iris_dataset.html diff --git a/doc/python/ml-pca.md b/doc/python/ml-pca.md index a72087d5462..a691532a4ad 100644 --- a/doc/python/ml-pca.md +++ b/doc/python/ml-pca.md @@ -5,8 +5,8 @@ jupyter: text_representation: extension: .md format_name: markdown - format_version: '1.1' - jupytext_version: 1.1.1 + format_version: '1.2' + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: Visualize Principle Component Analysis (PCA) of your high-dimensional data in Python with Plotly. @@ -136,6 +136,19 @@ fig.update_traces(diagonal_visible=False) fig.show() ``` +## PCA analysis in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'pca-visualization', width='100%', height=630) +``` + ## 2D PCA Scatter Plot In the previous examples, you saw how to visualize high-dimensional PCs. In this example, we show you how to simply visualize the first two principal components of a PCA, by reducing a dataset of 4 dimensions to 2D. @@ -262,4 +275,4 @@ The following resources offer an in-depth overview of PCA and explained variance * https://scikit-learn.org/stable/modules/decomposition.html#pca * https://stats.stackexchange.com/questions/2691/making-sense-of-principal-component-analysis-eigenvectors-eigenvalues/140579#140579 * https://stats.stackexchange.com/questions/143905/loadings-vs-eigenvectors-in-pca-when-to-use-one-or-another -* https://stats.stackexchange.com/questions/22569/pca-and-proportion-of-variance-explained \ No newline at end of file +* https://stats.stackexchange.com/questions/22569/pca-and-proportion-of-variance-explained diff --git a/doc/python/ml-roc-pr.md b/doc/python/ml-roc-pr.md index f31e35a12de..06431a68a95 100644 --- a/doc/python/ml-roc-pr.md +++ b/doc/python/ml-roc-pr.md @@ -5,8 +5,8 @@ jupyter: text_representation: extension: .md format_name: markdown - format_version: '1.1' - jupytext_version: 1.1.1 + format_version: '1.2' + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: Interpret the results of your classification using Receiver Operating Characteristics (ROC) and Precision-Recall (PR) Curves in Python with Plotly. @@ -119,6 +119,19 @@ fig.update_xaxes(constrain='domain') fig.show() ``` +## ROC curve in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'roc-and-pr-curves', width='100%', height=630) +``` + ## Multiclass ROC Curve When you have more than 2 classes, you will need to plot the ROC curve for each class separately. Make sure that you use a [one-versus-rest](https://scikit-learn.org/stable/modules/multiclass.html#one-vs-the-rest) model, or make sure that your problem has a [multi-label](https://scikit-learn.org/stable/modules/multiclass.html#multilabel-classification-format) format; otherwise, your ROC curve might not return the expected results. diff --git a/doc/python/multiple-axes.md b/doc/python/multiple-axes.md index df666acad23..df50f8efb87 100644 --- a/doc/python/multiple-axes.md +++ b/doc/python/multiple-axes.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.4.2 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.7 + version: 3.7.6 plotly: description: How to make a graph with multiple axes (dual y-axis plots, plots with secondary axes) in python. @@ -75,6 +75,19 @@ fig.update_yaxes(title_text="secondary yaxis title", secondary_y=True) fig.show() ``` +### Multiple axes in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'multiple-axes', width='100%', height=630) +``` + #### Muliple Y-Axes Subplots ```python @@ -233,4 +246,4 @@ fig.show() ``` #### Reference -All of the y-axis properties are found here: https://plotly.com/python/reference/YAxis/. For more information on creating subplots see the [Subplots in Python](/python/subplots/) section. \ No newline at end of file +All of the y-axis properties are found here: https://plotly.com/python/reference/YAxis/. For more information on creating subplots see the [Subplots in Python](/python/subplots/) section. diff --git a/doc/python/network-graphs.md b/doc/python/network-graphs.md index f6dae5c338c..a2381efc733 100644 --- a/doc/python/network-graphs.md +++ b/doc/python/network-graphs.md @@ -5,8 +5,8 @@ jupyter: text_representation: extension: .md format_name: markdown - format_version: '1.1' - jupytext_version: 1.1.1 + format_version: '1.2' + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.6.8 + version: 3.7.6 plotly: description: How to make Network Graphs in Python with Plotly. One examples of a network graph with NetworkX @@ -145,5 +145,18 @@ fig.show() ``` +### Network graphs in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash dash-cytoscape`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'network-graphs', width='100%', height=630) +``` + #### Reference -See https://plotly.com/python/reference/scatter/ for more information and chart attribute options! \ No newline at end of file +See https://plotly.com/python/reference/scatter/ for more information and chart attribute options! diff --git a/doc/python/renderers.md b/doc/python/renderers.md index 62b41134ad2..ead291cf4b8 100644 --- a/doc/python/renderers.md +++ b/doc/python/renderers.md @@ -6,7 +6,7 @@ jupyter: extension: .md format_name: markdown format_version: '1.2' - jupytext_version: 1.3.2 + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.7.0 + version: 3.7.6 plotly: description: Displaying Figures using Plotly's Python graphing library display_as: file_settings @@ -80,6 +80,20 @@ Next, we will show how to configure the default renderer. After that, we will d > Note: The `renderers` framework is a generalization of the `plotly.offline.iplot` and `plotly.offline.plot` functions that were the recommended way to display figures prior to `plotly.py` version 4. These functions have been reimplemented using the `renderers` framework and are still supported for backward compatibility, but they will not be discussed here. + +### Displaying figures in Dash + +[Dash](https://plotly.com/dash/) is the best way to build analytical apps in Python using Plotly figures. To run the app below, run `pip install dash`, click "Download" to get the code and run `python app.py`. + +Get started with [the official Dash docs](https://dash.plotly.com/installation) and **learn how to effortlessly [style](https://plotly.com/dash/design-kit/) & [deploy](https://plotly.com/dash/app-manager/) apps like this with Dash Enterprise.** + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'renderers', width='100%', height=630) +``` + #### Setting The Default Renderer The current and available renderers are configured using the `plotly.io.renderers` configuration object. Display this object to see the current default renderer and the list of all available renderers. diff --git a/doc/python/troubleshooting.md b/doc/python/troubleshooting.md index e86eec22eaa..5095c565725 100644 --- a/doc/python/troubleshooting.md +++ b/doc/python/troubleshooting.md @@ -5,8 +5,8 @@ jupyter: text_representation: extension: .md format_name: markdown - format_version: '1.1' - jupytext_version: 1.1.1 + format_version: '1.2' + jupytext_version: 1.6.0 kernelspec: display_name: Python 3 language: python @@ -20,7 +20,7 @@ jupyter: name: python nbconvert_exporter: python pygments_lexer: ipython3 - version: 3.6.8 + version: 3.7.6 plotly: description: How to troubleshoot import and rendering problems in Plotly with Python. @@ -52,6 +52,16 @@ $ pip remove plotly If you are encountering problems using `plotly` with [Dash](https://dash.plotly.com/) please first ensure that you have upgraded `dash` to the latest version, which will automatically upgrade `dash-core-components` to the latest version, ensuring that Dash is using an up-to-date version of the Plotly.js rendering engine for `plotly`. If this does not resolve your issue, please visit our [Dash Community Forum](https://community.plotly.com/) and we will be glad to help you out. +This is an example of a `plotly` graph correctly rendering inside `dash`: + + +```python hide_code=true +from IPython.display import IFrame +snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' +IFrame(snippet_url + 'troubleshooting', width='100%', height=630) +``` + + ### Jupyter Notebook Classic Problems The classic Jupyter Notebook (i.e. launched with `jupyter notebook`) sometimes suffers from a problem whereby if you close the window and reopen it, your plots render as blank spaces. @@ -111,7 +121,6 @@ unset NODE_OPTIONS # (Windows) set NODE_OPTIONS= ``` - ### VSCode Notebook, Nteract and Streamlit Problems From 395f76d54784bc8f8698a5369cc6a0bca78196eb Mon Sep 17 00:00:00 2001 From: Nicolas Kruchten Date: Thu, 10 Dec 2020 10:02:04 -0500 Subject: [PATCH 2/2] Update doc/python/troubleshooting.md --- doc/python/troubleshooting.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/python/troubleshooting.md b/doc/python/troubleshooting.md index 5095c565725..2800b609dce 100644 --- a/doc/python/troubleshooting.md +++ b/doc/python/troubleshooting.md @@ -58,7 +58,7 @@ This is an example of a `plotly` graph correctly rendering inside `dash`: ```python hide_code=true from IPython.display import IFrame snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/' -IFrame(snippet_url + 'troubleshooting', width='100%', height=630) +IFrame(snippet_url + 'renderers', width='100%', height=630) ```