Ngl SideBySide fix and Mol3d isosurface/shapes

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## Unreleased
+### Fixed
+* [#547](https://github.com/plotly/dash-bio/pull/547) `sideByside` prop fix for NglMoleculeViewer when `ALL` chains are visualized.
+### Added
+* [#547](https://github.com/plotly/dash-bio/pull/547) Added shapes and isosurfaces props to 3dMoleculeViewer to enable rendering additional features on the molecule.
+
 ## [0.6.1] - 2021-02-15
 ### Fixed
 * [#544](https://github.com/plotly/dash-bio/pull/544) Miscellaneous fixes for NglMoleculeViewer component.

DESCRIPTION

@@ -1,6 +1,6 @@
 Package: dashBio
 Title: Open-source Bioinformatics Components for Dash
-Version: 0.6.1
+Version: 0.6.2
 Description: A suite of components that makes it simpler to analyze and visualize bioinformatics data and interact with them in a Dash application.
 Depends: R (>= 3.0.2), manhattanly
 Imports: dash

R/dashbioMolecule3dViewer.R

@@ -1,16 +1,16 @@
 # AUTO GENERATED FILE - DO NOT EDIT
 
-dashbioMolecule3dViewer <- function(id=NULL, selectionType=NULL, backgroundColor=NULL, backgroundOpacity=NULL, styles=NULL, modelData=NULL, atomLabelsShown=NULL, selectedAtomIds=NULL, labels=NULL, onRenderNewData=NULL, onChangeSelection=NULL) {
+dashbioMolecule3dViewer <- function(id=NULL, selectionType=NULL, backgroundColor=NULL, backgroundOpacity=NULL, styles=NULL, modelData=NULL, atomLabelsShown=NULL, selectedAtomIds=NULL, labels=NULL, orbital=NULL, shapes=NULL, onRenderNewData=NULL, onChangeSelection=NULL) {
 
-    props <- list(id=id, selectionType=selectionType, backgroundColor=backgroundColor, backgroundOpacity=backgroundOpacity, styles=styles, modelData=modelData, atomLabelsShown=atomLabelsShown, selectedAtomIds=selectedAtomIds, labels=labels, onRenderNewData=onRenderNewData, onChangeSelection=onChangeSelection)
+    props <- list(id=id, selectionType=selectionType, backgroundColor=backgroundColor, backgroundOpacity=backgroundOpacity, styles=styles, modelData=modelData, atomLabelsShown=atomLabelsShown, selectedAtomIds=selectedAtomIds, labels=labels, orbital=orbital, shapes=shapes, onRenderNewData=onRenderNewData, onChangeSelection=onChangeSelection)
     if (length(props) > 0) {
         props <- props[!vapply(props, is.null, logical(1))]
     }
     component <- list(
         props = props,
         type = 'Molecule3dViewer',
         namespace = 'dash_bio',
-        propNames = c('id', 'selectionType', 'backgroundColor', 'backgroundOpacity', 'styles', 'modelData', 'atomLabelsShown', 'selectedAtomIds', 'labels', 'onRenderNewData', 'onChangeSelection'),
+        propNames = c('id', 'selectionType', 'backgroundColor', 'backgroundOpacity', 'styles', 'modelData', 'atomLabelsShown', 'selectedAtomIds', 'labels', 'orbital', 'shapes', 'onRenderNewData', 'onChangeSelection'),
         package = 'dashBio'
         )
 

R/internal.R

@@ -1,138 +1,138 @@
 .dashBio_js_metadata <- function() {
 deps_metadata <- list(`dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-alignment.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-circos.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-ideogram.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-igv.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-moleculeviewer2.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-moleculeviewer3.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-needle.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-nglmoleculeviewer.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-onco.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-sequence.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-speck.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, async = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-alignment.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-circos.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-ideogram.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-igv.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-moleculeviewer2.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-moleculeviewer3.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-needle.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-nglmoleculeviewer.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-onco.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-sequence.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'async-speck.js.map',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",
 all_files = FALSE, dynamic = TRUE), class = "html_dependency"),
 `dash_bio` = structure(list(name = "dash_bio",
-version = "0.6.1", src = list(href = NULL,
+version = "0.6.2", src = list(href = NULL,
 file = "deps"), meta = NULL,
 script = 'bundle.js',
 stylesheet = NULL, head = NULL, attachment = NULL, package = "dashBio",

dash_bio/Molecule3dViewer.py

@@ -29,14 +29,25 @@ class Molecule3dViewer(Component):
   - bonds (list; optional)
 - atomLabelsShown (boolean; optional): Property to either show or hide labels
 - selectedAtomIds (list; optional): Property that stores a list of all selected atoms
-- labels (list; optional): labels corresponding to the atoms of the molecule"""
+- labels (dict; optional): Labels corresponding to the atoms of the molecule. labels has the following type: list of dicts containing keys 'text'.
+Those keys have the following types:
+  - text (string; optional): The label content
+- orbital (dict; optional): Add an isosurface from volumetric data provided in the `cube_file`. orbital has the following type: dict containing keys 'cube_file', 'iso_val', 'opacity', 'positiveVolumetricColor', 'negativeVolumetricColor'.
+Those keys have the following types:
+  - cube_file (string; optional): The filepath containing raw volumetric data for vertex coloring
+  - iso_val (number; optional): The isovalue to draw the surface at
+  - opacity (number; optional): Transparency of the surface, between 0 and 1
+  - positiveVolumetricColor (string; optional): Color for the positive value of the isosurface orbital
+  - negativeVolumetricColor (string; optional): Color for the negative value of the isosurface orbital
+- shapes (list of dicts; optional): Add a predefined renderable shape objects to the molecule.
+Valid shape types are Arrow, Sphere, and Cylinder."""
     @_explicitize_args
-    def __init__(self, id=Component.UNDEFINED, selectionType=Component.UNDEFINED, backgroundColor=Component.UNDEFINED, backgroundOpacity=Component.UNDEFINED, styles=Component.UNDEFINED, modelData=Component.UNDEFINED, atomLabelsShown=Component.UNDEFINED, selectedAtomIds=Component.UNDEFINED, labels=Component.UNDEFINED, onRenderNewData=Component.UNDEFINED, onChangeSelection=Component.UNDEFINED, **kwargs):
-        self._prop_names = ['id', 'selectionType', 'backgroundColor', 'backgroundOpacity', 'styles', 'modelData', 'atomLabelsShown', 'selectedAtomIds', 'labels']
+    def __init__(self, id=Component.UNDEFINED, selectionType=Component.UNDEFINED, backgroundColor=Component.UNDEFINED, backgroundOpacity=Component.UNDEFINED, styles=Component.UNDEFINED, modelData=Component.UNDEFINED, atomLabelsShown=Component.UNDEFINED, selectedAtomIds=Component.UNDEFINED, labels=Component.UNDEFINED, orbital=Component.UNDEFINED, shapes=Component.UNDEFINED, onRenderNewData=Component.UNDEFINED, onChangeSelection=Component.UNDEFINED, **kwargs):
+        self._prop_names = ['id', 'selectionType', 'backgroundColor', 'backgroundOpacity', 'styles', 'modelData', 'atomLabelsShown', 'selectedAtomIds', 'labels', 'orbital', 'shapes']
         self._type = 'Molecule3dViewer'
         self._namespace = 'dash_bio'
         self._valid_wildcard_attributes =            []
-        self.available_properties = ['id', 'selectionType', 'backgroundColor', 'backgroundOpacity', 'styles', 'modelData', 'atomLabelsShown', 'selectedAtomIds', 'labels']
+        self.available_properties = ['id', 'selectionType', 'backgroundColor', 'backgroundOpacity', 'styles', 'modelData', 'atomLabelsShown', 'selectedAtomIds', 'labels', 'orbital', 'shapes']
         self.available_wildcard_properties =            []
 
         _explicit_args = kwargs.pop('_explicit_args')

dash_bio/metadata.json

@@ -1710,10 +1710,64 @@
       },
       "labels": {
         "type": {
-          "name": "array"
+          "name": "arrayOf",
+          "value": {
+            "name": "shape",
+            "value": {
+              "text": {
+                "name": "string",
+                "description": "The label content",
+                "required": false
+              }
+            }
+          }
+        },
+        "required": false,
+        "description": "Labels corresponding to the atoms of the molecule"
+      },
+      "orbital": {
+        "type": {
+          "name": "exact",
+          "value": {
+            "cube_file": {
+              "name": "string",
+              "description": "The filepath containing raw volumetric data for vertex coloring",
+              "required": false
+            },
+            "iso_val": {
+              "name": "number",
+              "description": "The isovalue to draw the surface at",
+              "required": false
+            },
+            "opacity": {
+              "name": "number",
+              "description": "Transparency of the surface, between 0 and 1",
+              "required": false
+            },
+            "positiveVolumetricColor": {
+              "name": "string",
+              "description": "Color for the positive value of the isosurface orbital",
+              "required": false
+            },
+            "negativeVolumetricColor": {
+              "name": "string",
+              "description": "Color for the negative value of the isosurface orbital",
+              "required": false
+            }
+          }
+        },
+        "required": false,
+        "description": "Add an isosurface from volumetric data provided in the `cube_file`"
+      },
+      "shapes": {
+        "type": {
+          "name": "arrayOf",
+          "value": {
+            "name": "object"
+          }
         },
         "required": false,
-        "description": "labels corresponding to the atoms of the molecule"
+        "description": "Add a predefined renderable shape objects to the molecule.\nValid shape types are Arrow, Sphere, and Cylinder."
       },
       "onRenderNewData": {
         "type": {

dash_bio/package-info.json

@@ -1,6 +1,6 @@
 {
   "name": "dash-bio",
-  "version": "0.6.1",
+  "version": "0.6.2",
   "description": "Dash components for bioinformatics",
   "repository": {
     "type": "git",

man/dashbioMolecule3dViewer.Rd

@@ -13,7 +13,8 @@ The Molecule3dViewer component is used to render schematic diagrams of biomolecu
 dashbioMolecule3dViewer(id=NULL, selectionType=NULL, backgroundColor=NULL,
 backgroundOpacity=NULL, styles=NULL, modelData=NULL,
 atomLabelsShown=NULL, selectedAtomIds=NULL, labels=NULL,
-onRenderNewData=NULL, onChangeSelection=NULL)
+orbital=NULL, shapes=NULL, onRenderNewData=NULL,
+onChangeSelection=NULL)
 }
 
 \arguments{
@@ -42,7 +43,20 @@ and should have two main dictionaries - atoms, bonds}
 
 \item{selectedAtomIds}{Unnamed list. Property that stores a list of all selected atoms}
 
-\item{labels}{Unnamed list. labels corresponding to the atoms of the molecule}
+\item{labels}{List of lists containing elements 'text'.
+those elements have the following types:
+  - text (character; optional): the label contents. Labels corresponding to the atoms of the molecule}
+
+\item{orbital}{Lists containing elements 'cube_file', 'iso_val', 'opacity', 'positivevolumetriccolor', 'negativevolumetriccolor'.
+those elements have the following types:
+  - cube_file (character; optional): the filepath containing raw volumetric data for vertex coloring
+  - iso_val (numeric; optional): the isovalue to draw the surface at
+  - opacity (numeric; optional): transparency of the surface, between 0 and 1
+  - positivevolumetriccolor (character; optional): color for the positive value of the isosurface orbital
+  - negativevolumetriccolor (character; optional): color for the negative value of the isosurface orbital. Add an isosurface from volumetric data provided in the `cube_file`}
+
+\item{shapes}{List of named lists. Add a predefined renderable shape objects to the molecule.
+Valid shape types are Arrow, Sphere, and Cylinder.}
 
 \item{onRenderNewData}{Callback to re-render molecule viewer
 when modelData is changed}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "dash-bio",
-  "version": "0.6.1",
+  "version": "0.6.2",
   "description": "Dash components for bioinformatics",
   "repository": {
     "type": "git",