dash-bio docs posts

CHANGELOG.md

@@ -2,6 +2,17 @@
 All notable changes to this project will be documented in this file.
 This project adheres to [Semantic Versioning](http://semver.org/).
 
+## [next] - ???
+
+### Added
+  - dash-bio posts in /doc/python/{alignment-chart.md,circos.md,clustergram.md,molecular-visualizations.md,volacano-plot.md}
+
+### Fixed
+  - Fixed error when serializing dict with mix of string and non-string keys [#3380](https://github.com/plotly/plotly.py/issues/3380)
+
+### Updated
+  - The JSON serialization engines no longer sort their keys [#3380](https://github.com/plotly/plotly.py/issues/3380)
+
 ## [5.3.1] - 2021-08-31
 
 ### Updated

doc/python/bio-alignment-chart.md

@@ -0,0 +1,62 @@
+---
+jupyter:
+  jupytext:
+    notebook_metadata_filter: all
+    text_representation:
+      extension: .md
+      format_name: markdown
+      format_version: '1.3'
+      jupytext_version: 1.13.0
+  kernelspec:
+    display_name: Python 3 (ipykernel)
+    language: python
+    name: python3
+  language_info:
+    codemirror_mode:
+      name: ipython
+      version: 3
+    file_extension: .py
+    mimetype: text/x-python
+    name: python
+    nbconvert_exporter: python
+    pygments_lexer: ipython3
+    version: 3.9.7
+  plotly:
+    display_as: bio
+    language: python
+    layout: base
+    name: Alignment Chart
+    order: 1
+    page_type: u-guide
+    permalink: python/alignment-chart/
+    thumbnail: thumbnail/alignment-chart.png
+---
+
+## Alignment Viewer (link to dash alignment section below)
+
+The Alignment Viewer (MSA) component is used to align multiple genomic or proteomic sequences from a FASTA or Clustal file. Among its extensive set of features, the multiple sequence alignment viewer can display multiple subplots showing gap and conservation info, alongside industry standard colorscale support and consensus sequence. No matter what size your alignment is, Alignment Viewer is able to display your genes or proteins snappily thanks to the underlying WebGL architecture powering the component. You can quickly scroll through your long sequence with a slider or a heatmap overview.
+
+Note that the AlignmentChart only returns a chart of the sequence, while AlignmentViewer has integrated controls for colorscale, heatmaps, and subplots allowing you to interactively control your sequences.
+
+## Bar Chart for conservation visualization
+
+```python
+import plotly.express as px
+import pandas as pd
+
+df = (pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/Dash_Bio/Genetic/gene_conservation.csv')
+        .set_index('0')
+        .loc[['consensus','conservation']]
+        .T)
+
+fig = px.bar(df, labels={ 'index': 'base' }, hover_name='consensus', y='conservation')
+fig.show()
+```
+
+## Alignment Chart in dash_bio
+
+```python no_display=true
+from IPython.display import IFrame
+snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/'
+IFrame(snippet_url + 'bio-alignmentchart', width='100%', height=630)
+```

doc/python/bio-clustergram.md

@@ -0,0 +1,114 @@
+---
+jupyter:
+  jupytext:
+    notebook_metadata_filter: all
+    text_representation:
+      extension: .md
+      format_name: markdown
+      format_version: '1.3'
+      jupytext_version: 1.13.0
+  kernelspec:
+    display_name: Python 3 (ipykernel)
+    language: python
+    name: python3
+  language_info:
+    codemirror_mode:
+      name: ipython
+      version: 3
+    file_extension: .py
+    mimetype: text/x-python
+    name: python
+    nbconvert_exporter: python
+    pygments_lexer: ipython3
+    version: 3.9.7
+  plotly:
+    display_as: bio
+    language: python
+    layout: base
+    name: Clustergram
+    order: 1
+    page_type: u-guide
+    permalink: python/clustergram/
+    thumbnail: thumbnail/clustergram.png
+---
+
+## Default Clustergram
+A clustergram is a combination heatmap-dendrogram that is commonly used in gene expression data. The hierarchical clustering that is represented by the dendrograms can be used to identify groups of genes with related expression levels. The Dash Bio Clustergram component is a Python-based component that uses plotly.py to generate a figure. It takes as input a two-dimensional numpy array of floating-point values. Imputation of missing data and computation of hierarchical clustering both occur within the component itself. Clusters that meet or exceed a user-defined threshold of similarity comprise single traces in the corresponding dendrogram, and can be highlighted with annotations. The user can specify additional parameters to customize the metrics and methods used to compute parts of the clustering, such as the pairwise distance between observations and the linkage matrix.
+
+```python
+import pandas as pd
+import dash_bio
+
+
+df = pd.read_csv(
+    'https://raw.githubusercontent.com/plotly/datasets/master/Dash_Bio/Chromosomal/' +
+    'clustergram_brain_cancer.csv', 
+)
+
+dash_bio.Clustergram(
+    data=df,
+    column_labels=list(df.columns.values),
+    row_labels=list(df.index),
+    height=800,
+    width=700
+)
+```
+
+## Dendrogram Cluster Colors/Line Widths
+Change the colors of the dendrogram traces that are used to represent clusters, and configure their line widths.
+
+
+```python
+import pandas as pd
+import dash_bio
+
+df = pd.read_csv(
+    'https://raw.githubusercontent.com/plotly/datasets/master/Dash_Bio/Chromosomal/' +
+    'clustergram_brain_cancer.csv', 
+)
+
+dash_bio.Clustergram(
+    data=df,
+    column_labels=list(df.columns.values),
+    row_labels=list(df.index),
+    height=800,
+    width=700,
+    color_list={
+        'row': ['#636EFA', '#00CC96', '#19D3F3'],
+        'col': ['#AB63FA', '#EF553B'],
+        'bg': '#506784'
+    },
+    line_width=2
+)
+```
+
+## Relative Dendrogram Size
+Change the relative width and height of, respectively, the row and column dendrograms compared to the width and height of the heatmap.
+
+
+```python
+import pandas as pd
+import dash_bio
+
+df = pd.read_csv(
+    'https://raw.githubusercontent.com/plotly/datasets/master/Dash_Bio/Chromosomal/' +
+    'clustergram_brain_cancer.csv', 
+)
+
+dash_bio.Clustergram(
+    data=df,
+    column_labels=list(df.columns.values),
+    row_labels=list(df.index),
+    height=800,
+    width=700,
+    display_ratio=[0.1, 0.7]
+)
+```
+
+## Clustergram with Dash
+
+```python no_display=true
+from IPython.display import IFrame
+snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/'
+IFrame(snippet_url + 'bio-clustergram', width='100%', height=630)
+```

doc/python/bio-manhattanplot.md

@@ -0,0 +1,75 @@
+---
+jupyter:
+  celltoolbar: Tags
+  jupytext:
+    notebook_metadata_filter: all
+    text_representation:
+      extension: .md
+      format_name: markdown
+      format_version: '1.3'
+      jupytext_version: 1.13.0
+  kernelspec:
+    display_name: Python 3 (ipykernel)
+    language: python
+    name: python3
+  language_info:
+    codemirror_mode:
+      name: ipython
+      version: 3
+    file_extension: .py
+    mimetype: text/x-python
+    name: python
+    nbconvert_exporter: python
+    pygments_lexer: ipython3
+    version: 3.9.7
+  plotly:
+    display_as: bio
+    language: python
+    layout: base
+    name: Manhattan Plot
+    order: 1
+    page_type: u-guide
+    permalink: python/manhattan-plot/ 
+    thumbnail: thumbnail/manhttan-plot.png
+---
+
+## Manhattan Plot
+ManhattanPlot allows you to visualize genome-wide association studies (GWAS) efficiently. Using WebGL under the hood, you can interactively explore overviews of massive datasets comprising hundreds of thousands of points at once, or take a closer look at a small subset of your data. Hover data and click data are accessible from within the Dash app.
+
+```python
+import pandas as pd
+import dash_bio as dashbio
+
+df = pd.read_csv('https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/manhattan_data.csv')
+
+
+dashbio.ManhattanPlot(
+    dataframe=df,
+)
+```
+
+## Highlighted points color, and colors of the suggestive line and the genome-wide line.
+Change the color of the points that are considered significant.
+
+```python
+import pandas as pd
+import dash_bio as dashbio
+
+
+df = pd.read_csv('https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/manhattan_data.csv')
+
+dashbio.ManhattanPlot(
+    dataframe=df,
+    highlight_color='#00FFAA',
+    suggestiveline_color='#AA00AA',
+    genomewideline_color='#AA5500'
+)
+```
+
+## ManhattanPlot with Dash
+
+```python no_display=true
+from IPython.display import IFrame
+snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/'
+IFrame(snippet_url + 'bio-manhattanplot', width='100%', height=630)
+```

doc/python/bio-volcano-plot.md

@@ -0,0 +1,78 @@
+---
+jupyter:
+  celltoolbar: Tags
+  jupytext:
+    notebook_metadata_filter: all
+    text_representation:
+      extension: .md
+      format_name: markdown
+      format_version: '1.3'
+      jupytext_version: 1.13.0
+  kernelspec:
+    display_name: Python 3 (ipykernel)
+    language: python
+    name: python3
+  language_info:
+    codemirror_mode:
+      name: ipython
+      version: 3
+    file_extension: .py
+    mimetype: text/x-python
+    name: python
+    nbconvert_exporter: python
+    pygments_lexer: ipython3
+    version: 3.9.7
+  plotly:
+    display_as: bio
+    language: python
+    layout: base
+    name: Volcano Plot
+    order: 1
+    page_type: u-guide
+    permalink: python/volcano-plot/
+    thumbnail: thumbnail/volcano-plot.png
+---
+
+## VolcanoPlot
+Volcano Plot interactively identifies clinically meaningful markers in genomic experiments, i.e., markers that are statistically significant and have an effect size greater than some threshold. Specifically, volcano plots depict the negative log-base-10 p-values plotted against their effect size.
+
+```python
+import pandas as pd
+import dash_bio 
+
+
+df = pd.read_csv(
+    'https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/' +
+    'volcano_data1.csv'
+)
+
+dash_bio.VolcanoPlot(
+    dataframe=df,
+)
+```
+
+## Point Sizes And Line Widths
+Change the size of the points on the scatter plot, and the widths of the effect lines and genome-wide line.
+
+
+```python
+import pandas as pd
+import dash_bio as dashbio
+
+df = pd.read_csv('https://raw.githubusercontent.com/plotly/dash-bio-docs-files/master/volcano_data1.csv')
+
+dashbio.VolcanoPlot(
+    dataframe=df,
+    point_size=10,
+    effect_size_line_width=4,
+    genomewideline_width=2
+)
+```
+
+## VolcanoPlot with Dash
+
+```python no_display=true
+from IPython.display import IFrame
+snippet_url = 'https://dash-gallery.plotly.host/python-docs-dash-snippets/'
+IFrame(snippet_url + 'bio-volcano', width='100%', height=630)
+```

doc/requirements.txt

@@ -1,5 +1,6 @@
 plotly==5.3.1
 jupytext==1.1.1
+jupyter-client<7
 jupyter
 notebook
 pandas==1.0.3
@@ -32,3 +33,4 @@ pooch
 wget
 nbconvert==5.6.1
 orjson
+dash-bio

packages/python/plotly/plotly/io/_json.py

@@ -112,7 +112,7 @@ def to_json_plotly(plotly_object, pretty=False, engine=None):
     # Dump to a JSON string and return
     # --------------------------------
     if engine == "json":
-        opts = {"sort_keys": True}
+        opts = {}
         if pretty:
             opts["indent"] = 2
         else:
@@ -124,7 +124,7 @@ def to_json_plotly(plotly_object, pretty=False, engine=None):
         return json.dumps(plotly_object, cls=PlotlyJSONEncoder, **opts)
     elif engine == "orjson":
         JsonConfig.validate_orjson()
-        opts = orjson.OPT_SORT_KEYS | orjson.OPT_SERIALIZE_NUMPY
+        opts = orjson.OPT_NON_STR_KEYS | orjson.OPT_SERIALIZE_NUMPY
 
         if pretty:
             opts |= orjson.OPT_INDENT_2
@@ -462,7 +462,7 @@ def clean_to_json_compatible(obj, **kwargs):
         return obj
 
     if isinstance(obj, dict):
-        return {str(k): clean_to_json_compatible(v, **kwargs) for k, v in obj.items()}
+        return {k: clean_to_json_compatible(v, **kwargs) for k, v in obj.items()}
     elif isinstance(obj, (list, tuple)):
         if obj:
             # Must process list recursively even though it may be slow

packages/python/plotly/plotly/tests/test_core/test_graph_objs/test_template.py

@@ -356,7 +356,7 @@ def test_move_nested_trace_properties(self):
             },
         )
 
-        self.assertEqual(pio.to_json(templated_fig), pio.to_json(expected_fig))
+        self.assertEqual(templated_fig.to_dict(), expected_fig.to_dict())
 
     def test_move_nested_trace_properties_existing_traces(self):
         fig = go.Figure(