https://github.com/stefano-meschiari/sklearn-classifiers-playground
Web app using Pyodide to demo different types of Scikit-learn classifiers
https://github.com/stefano-meschiari/sklearn-classifiers-playground
pyodide python react sklearn
Last synced: about 2 months ago
JSON representation
Web app using Pyodide to demo different types of Scikit-learn classifiers
- Host: GitHub
- URL: https://github.com/stefano-meschiari/sklearn-classifiers-playground
- Owner: stefano-meschiari
- License: mit
- Created: 2022-01-30T00:37:54.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-04-16T01:30:19.000Z (about 3 years ago)
- Last Synced: 2025-04-14T10:12:32.934Z (about 2 months ago)
- Topics: pyodide, python, react, sklearn
- Language: JavaScript
- Homepage:
- Size: 5.37 MB
- Stars: 12
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Scikit-learn Classifiers Playground
**[Try it online](https://www.stefanom.io/sklearn-classifiers-playground/)**
## What is it?
:construction: **NOTE: This document is a work in progress!** :construction:
This web application interactively trains Scikit-learn classification algorithms and plots class boundaries using Matplotlib. This is implemented without any server component using [Pyodide](https://pyodide.org/en/stable/) -- **it's all running on your browser**!
The following classifiers can be trained:
* Logistic Regression
* Decision Tree
* Random Forest
* SVM (RBF kernel)
* K-nearest neighbors
* A 2-layer Neural Network
* Gaussian Process
on a variety of 2D datasets.
## Implementation
Briefly, a Python class (`SklearnClassifiers`, defined in [sklearn_classifiers.py](py/sklearn_classifiers.py)) first defines the set of inputs (the type of classifier, the dataset, a random seed, etc.). This set of inputs is used to build the React components in the sidebar ([PyodideApplet](src/PyodideApplet.js)).
On first run, or when the value of the inputs change, the React app calls the `compute()` method defined in `SklearnClassifiers`. This method trains a classifier, computes a 2D matrix of predictions, plots them on a Matplotlib figure, base64-encodes the output image, and returns it to the React app. Finally, the React app displays the base64-encoded image in an `![]()
` tag.
Note that I also implemented (in a very flawed way) the ability to add additional "custom" points to the dataset simply by clicking on the plot. Each point added by the user is draggable. Since the underlying plot is a static image, I overlay draggable elements whose coordinates are sent to the Python code, translated into the Matplotlib figure coordinate space, and added to the dataset used to train the classifier. I will probably remove this code eventually, since it is very hacky.
#### TODOs
- [ ] Run Pyodide in a Web Worker to avoid locking the main thread
- [ ] Document development in a blog post
- [ ] Switch from Matplotlib to an SVG-based plotting library
- [ ] Add the ability to set hyperparameters for each type of classifier
- [ ] Mobile-friendly layout
- [ ] Add the ability to import a 2D dataset (e.g. as a CSV file)