🏠 back to Observable

observable-jupyter on Google Colab

The observable-jupyter project is very cool and I just wanted to show off a couple of examples and get some feedback or advice. The example use Google Colab to run some data processing/analysis in Python and then visualize the data using ObservableHQ within the notebook. This should be useful for cases where Jupyter widgets are not supported such as Google Colab.

  • Scatterplot on Deck.gl
    • Observable Scatterplot Template: this notebook includes a scatterplot with placeholder data
    • Google Colab Notebook: this Jupyter notebook runs on Google Colab, generates some two-dimensional data, and passes the data to observable-jupyter which renders a scatterplot of this data.

  • Clustergrammer-gl heatmap
    • this template notebook visualizes gene expression data and performs enrichment analysis
    • this Google Colab notebook loads a gene expression dataset and passes it to the template notebook to visualize

Does anyone know if there is a way to generate a new Observable notebook from this output (e.g. the template notebook with the new data)?

1 Like

You can’t programmatically create notebooks, but I can think of a few options:

  1. Fork the template notebook and replace the data. While this approach isn’t very DRY, it’s a common strategy on Observable and grants you more freedom with regard to changes and iterations.
  2. Add a data input so that users can provide a custom data source (e.g. via a CORS enabled URL, a file field, or a textarea).
  3. Offer an importable API, like functions for data processing and widgets / views for data visualization. Views can be imported by referencing them with the viewof prefix, e.g. import {viewof num_enr_terms} from "...".
  4. Support import overrides. Chances are your notebook already does. Make sure that all your relevant cells have names. Then, even if all your cells are stateful (i.e., contain processed or generated data), authors can still replace cells while importing, via e.g. import {/*...*/} with {myData as data} from "...".

Does that answer your question?

1 Like

Thanks @mootari, option 1 sounds good but I can experiment with the others.