Publish kepler.gl for jupyter notebook

[heshan0131]

Feature
Publish a kepler.gl for jupyter python package to load kepler.gl inside jupyter notebook

Solution

• Create a kepler.gl build to embed js and css into a single html
• Create a jupyter notebook python package to load keplergl.html inside an iframe
• Publish kepler.gl for jupyter
• Allow adding data and config via python API

Appendix

Kepler.gl Jupyter Integration Slides

[rmanisthebest]

May i ask any notebook template or example for this feature?

[heshan0131]

This work is still in progress

[ibgreen]

Links to deck.gl Python RFC

• RFC: Python Integration visgl/deck.gl#2746
• Python Integration RFC visgl/deck.gl#2747

[briantcl]

1. user testing
2. need marketing plan for the release
3. medium post/ marketing release (TBD)

Target release date: next sprint

[briantcl]

to-do:

1. publish to the code base

Launch Plan:

1. medium post
2. Share the medium post url through linkedin, twitter
3. demo notebooks

[murari-goswami]

Any date for release ?

[emiliomartin84]

Any update about the release date?

[murari-goswami]

Hi Briantcl, any update on the launch plan ?

[chintanp]

Are there plans to support Jupyter lab? I am able to test it with jupyter notebook and it works. :)

[wasauce]

FYI - https://medium.com/vis-gl/introducing-kepler-gl-for-jupyter-f72d41659fbf - I hadn't seen this and was thinking it wasn't released yet. Very exciting! Thank you!

[saulshanabrook]

I have hacked together some JupyterLab support. There is currently a JuptyerLab plugin in this repo, but it isn't being built currently, as far as I can tell.

To use this with JupyterLab 1.0:

conda create -n kepler-jupyterlab -c conda-forge jupyterlab=1.0.0
conda activate kepler-jupyterlab
pip install ipywidgets keplergl
jupyter labextension install @jupyter-widgets/jupyterlab-manager
git clone [email protected]:saulshanabrook/kepler.gl.git
cd kepler.gl/bindings/kepler.gl-jupyter/js
yarn
env MapboxAccessTokenJupyter=<YOUR_TOKEN> npx babel lib --out-dir babel
jupyter labextension install .

It seems to work OK:

from keplergl import KeplerGl 
map_1 = KeplerGl(height=500)
map_1

# new cell
import pandas as pd
df = pd.DataFrame(
    {'City': ['Buenos Aires', 'Brasilia', 'Santiago', 'Bogota', 'Caracas'],
     'Latitude': [-34.58, -15.78, -33.45, 4.60, 10.48],
     'Longitude': [-58.66, -47.91, -70.66, -74.08, -66.86]})

map_1.add_data(data=df, name='cities')

The changes I made were:

• Build version of JS files that doesn't include JSX syntax, using babel. Also turn off some of babels plugins, so that ES6 imports are preserved
• Change some imports so they build properly with JL
• Update the @jupyter-widgets/base dependency so it matches the one in JL. There are probably breaking changes in here, but I am not sure if they matter for this use case.

[heshan0131]

@saulshanabrook Thank you so much for this!! I will implement your changes and test it

[heshan0131]

keplergl==0.1.0 and [email protected] can now be installed on jupyter Labs
(Python 3 tested)

#764

[heshan0131]

Add installation instruction for Jupyter Lab
https://github.com/keplergl/kepler.gl/tree/master/bindings/kepler.gl-jupyter#installation
Close this for now 🥂