Multi Hidden Layer Support (another proposal)

README.md

@@ -6,6 +6,7 @@ Neural Network JavaScript library for Coding Train tutorials
 Here are some demos running directly in the browser:
 * [XOR problem](https://codingtrain.github.io/Toy-Neural-Network-JS/examples/xor/)
 * [Handwritten digit recognition](https://codingtrain.github.io/Toy-Neural-Network-JS/examples/mnist/)
+* [Multiple hidden layers](https://maksuel.github.io/Toy-Neural-Network-JS/examples/doodle_classification/)
 
 ## To-Do List
 
@@ -20,7 +21,7 @@ Here are some demos running directly in the browser:
     * only use testing data
 * [ ] Support for saving / restoring network (see [#50](https://github.com/CodingTrain/Toy-Neural-Network-JS/pull/50))
 * [ ] Support for different activation functions (see [#45](https://github.com/CodingTrain/Toy-Neural-Network-JS/pull/45), [#62](https://github.com/CodingTrain/Toy-Neural-Network-JS/pull/62))
-* [ ] Support for multiple hidden layers (see [#61](https://github.com/CodingTrain/Toy-Neural-Network-JS/pull/61))
+* [x] Support for multiple hidden layers (see [#107](https://github.com/CodingTrain/Toy-Neural-Network-JS/pull/107))
 * [ ] Support for neuro-evolution
     * [ ] play flappy bird (many players at once). 
     * [ ] play pong (many game simulations at once)

examples/doodle_classification/index.html

@@ -12,6 +12,7 @@
 	<script src="loadbinary.js"></script>
 	<script src="traintest.js"></script>
 	<script src="dataprep.js"></script>
+	<script src="visualization.js"></script>
 	<script src="sketch.js"></script>
 	<script src="../../lib/nn.js"></script>
 	<script src="../../lib/matrix.js"></script>

examples/doodle_classification/sketch.js

@@ -15,6 +15,8 @@ let rainbows = {};
 
 let nn;
 
+let visualization;
+
 function preload() {
   catsData = loadBytes('data/cats1000.bin');
   trainsData = loadBytes('data/trains1000.bin');
@@ -31,8 +33,8 @@ function setup() {
   prepareData(rainbows, rainbowsData, RAINBOW);
   prepareData(trains, trainsData, TRAIN);
 
-  // Making the neural network
-  nn = new NeuralNetwork(784, 64, 3);
+  // Making the neural network (multi-hidden layers)
+  nn = new NeuralNetwork(784, 256, 64, 3);
 
   // Randomizing the data
   let training = [];
@@ -95,6 +97,8 @@ function setup() {
   //   let percent = testAll(testing);
   //   console.log("% Correct: " + percent);
   // }
+
+  visualization = new Visualization(nn);
 }
 
 

examples/doodle_classification/visualization.js

@@ -0,0 +1,36 @@
+class Visualization {
+
+    static _check(nn) {
+        if(typeof p5 !== 'function') {
+            throw new Error('Need to include p5js');
+        } else if(!nn instanceof NeuralNetwork) {
+            throw new Error('Need a instance of NeuralNetwork');
+        }
+    }
+
+    static _getLayers(nn) {
+        let layers = [];
+
+        for(let layer of nn.layers) {
+            layers.push(layer.nodes);
+        }
+
+        return layers;
+    }
+
+    static graphics(nn) {
+        this._check(nn);
+
+        let layers = this._getLayers(nn);
+
+        let w = floor(layers.length * 20);
+        let h = floor(layers[0] * 20);
+
+        let graphics = createGraphics(w,h);
+
+        console.log(graphics.width, graphics.height);
+
+        return graphics;
+
+    }
+}