Machine Learning - Digit Recognition
Draw a digit (0-9) on the canvas and click "Predict" to see what the machine learning model thinks you drew!
How it works:
- The model is trained on scikit-learn's digits dataset (1,797 samples of 8×8 images)
- When you click Predict, your drawing is converted to base64
- Python receives the image, preprocesses it to 8×8 grayscale with adaptive thresholding
- A K-Nearest Neighbors (KNN) classifier predicts the digit using 5 neighbors
- Distance weighting gives more importance to closer neighbors for better accuracy
- Active learning: If the prediction is wrong, you can correct it and retrain the model live!
- All processing happens in your browser using PyScript!
💡 Active Learning with Positive & Negative Feedback
This model learns from both correct and incorrect predictions! After each prediction, you can:
- Click YES if correct → Reinforces the model's understanding of your drawing style
- Click NO if wrong → Lets you correct it and retrain with the right label
The more feedback you give (positive or negative), the better it gets at recognizing your handwriting!
🏗️ Architecture
This example demonstrates proper separation of concerns with event-driven initialization:
- PyScriptManager - Event-driven lifecycle management (no polling!)
- Python - Pure ML logic, signals ready when initialized, sends only data via callbacks
- DigitRecognitionController - Manages communication layer between Python and UI
- Svelte Components - Pure UI rendering with reactive state
Previous