Gist 628b2fab1b21dd2fd74ddc2e7469261f

100%

Gist 628b2fab1b21dd2fd74ddc2e7469261f

✓ Published0🌍 Public

Last edited Mar 26, 2017

Created on Mar 26, 2017

This interactive visualization demonstrates a neural network classifying handwritten digits from the MNIST dataset, showing the network’s ten output activations for each input image. It uses Processing’s `loadBytes()` to read 196-byte image data and 10,000 label bytes, splitting the data set so that four out of five cards train the model while every fifth card tests it. The code defines a `Card` class that stores input arrays and output arrays, highlighting the correct answer within the template outputs during label loading.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 0b384246f66fe33ea9666f0d1aec3707

This example displays a neural network’s real-time classification of handwritten digit images from a testing set, cycling through a random card number each time the mouse is pressed. The Processing sketch uses the `Network` class to respond to pixel data from a 196-input layer, then renders the network’s nodes and connections with `smooth()` and `stroke(150)`. The current card index and its label are shown as text at the bottom of the canvas, while the background is cleared each frame with `background(255)`.

CCharlesFr

84% match

Loading thumbnail…

Gist 232b1f382c6798335ff1f889303e9f62

This example visualizes a neural network’s response to input cards, showing how activation flows from the input layer through the hidden layer to the output layer. The code, written in Processing, defines a `Network` class whose `respond()` method assigns each card’s input values to the input layer’s neurons, then sequentially calls `respond()` on each hidden and output neuron to propagate signals. It uses the `Card` class for data inputs and the `Network`’s internal layer arrays to manage neurons, demonstrating a feedforward computation without any external visualization library.

CCharlesFr

82% match

Loading thumbnail…

Gist 99f0384031106e9fdc7a0d325cd88606

This example demonstrates a neural network classifier for handwritten digits. A Processing sketch displays the network architecture, and mouse clicks either train the network on 500 random samples from the training set or respond to a single test sample. The code uses Processing's `loadPixels()` and `redraw()` functions, alongside custom `Network`, `loadData()`, and `setupSigmoid()` methods, to visualize the network’s layered connections in real time.

CCharlesFr

81% match

Loading thumbnail…

Gist 504719be190c80e2cec9228ea8849c7f

This example shows a handwritten digit recognition system built in Processing. It displays a neural network with 196 input nodes, 49 hidden nodes, and 10 output nodes, trained on the MNIST dataset. The sketch loads a sigmoid activation function and constructs the network via the custom `Network` class. As the user draws on a canvas, the network classifies the input and visualizes the activations propagating through the layers. The code uses Processing’s `setup()` and `loadSigmoid()` methods to initialize the model and rendering.

CCharlesFr

78% match

Loading thumbnail…

Gist 6415ca0edd67a967c88fe328b0b26115

This example visualizes the input layer of a neural network as a grid of circles, positioned based on a 14-column layout. The `Network` class initializes an array of `Neuron` objects and sets their output values from a `Card` object's inputs. Rendering is done through Processing's `pushMatrix`, `translate`, and `popMatrix` functions, with each neuron’s display method handling its own drawing. The arrangement uses `height` and `width` for responsive sizing, showing how the network’s initial state is mapped spatially.

CCharlesFr

74% match

Loading thumbnail…

Gist 48900009bc9111ca9bba882570795f41

This example visualizes a three-layer neural network using Processing. It shows the input layer arranged in a grid, a hidden layer in a smaller grid, and an output layer spread horizontally, with each node drawn as a visual element. The code uses Processing’s `pushMatrix`, `translate`, and `popMatrix` to position each node at computed coordinates. The layout is fixed, with the layers placed at different screen positions, and the output layer is drawn with a flag to change its appearance. No data is loaded, and the network structure is hardcoded in the class.

CCharlesFr

71% match

Loading thumbnail…

Gist 36fa85de37aeb50756ec65aa6548b25f

This example implements an artificial neural network where individual neurons are drawn as circles on a canvas. Each neuron connects to a set of previous-layer inputs, multiplying their output values by random weights, then passing the summed result through a sigmoid activation function. The code renders each neuron’s fill color based on its output value, using the Processing API’s `ellipse()` and `fill()` functions to visualize activation levels. The neural activity propagates layer by layer, producing a dynamic, self-contained simulation of a feedforward network without external data inputs.

CCharlesFr

68% match

Loading thumbnail…

Gist d6e2a2307801a1a2d367875fe3cf671a

This example demonstrates a three-layer neural network learning to classify patterns through supervised backpropagation. The Processing sketch uses a custom `Neuron` class with a training loop that adjusts connection weights based on error signals. The code shows the core training mathematics, including a hyperbolic tangent activation function, delta computation, and weight updates scaled by a fixed learning rate. The visualization itself is not present in this code fragment, which focuses solely on the algorithmic update logic for each neuron’s error and weight adjustment.

CCharlesFr

68% match