The Jupyter ecosystem already comes with popular libraries for creating interactive charts such as Bokeh and Plotly. But in some situations, we need access to a lower level API to draw custom shapes (triangles, circles, squares). The purpose of this presentation is to go through examples of custom JupyterLab extension using Jupyter Widgets and a JavaScript library called Pixi.js.
The Jupyter notebook has been the reference tool for interactive computing. Looking at the Python Visualization Landscape, we can notice a huge list of libraries, each serving a specific purpose and type of data.
But what if we want to visualize a very domain specific data set, not covered by these tools?
Recent additions to the Jupyter ecosystem such as the Jupyter Widgets and JupyterLab provide a more convenient way to leverage existing JavaScript libraries to create rich interactive experiences in the browser. And this will be the purpose of this presentation: going through examples of widgets built with Pixi.js for specific use cases.
The first part of the presentation will be an overview of the Jupyter Widgets and the Pixi.js JavaScript rendering library and how they can be combined to draw squares and circles and interact with them.
A second slightly more advanced example will show how to visually understand a computer science concept such as recursion.
The last example will be a demo of how to embed an existing web-based tool used to visualize and analyze the game state of users, directly in JupyterLab.