From f04d9f1773b6a0e109867bc6a5546a716565b1a7 Mon Sep 17 00:00:00 2001 From: schneefux Date: Sat, 9 Apr 2016 17:27:37 +0200 Subject: training --- code/errorvis.js | 3 +- code/weightvis.js | 11 +-- code/weightviswrapper.js | 13 ++-- index.css | 11 ++- index.html | 173 ++++++++++++++++++++++++++++++++++++++++++++++- 5 files changed, 196 insertions(+), 15 deletions(-) diff --git a/code/errorvis.js b/code/errorvis.js index 9cd87f4..03c5eba 100644 --- a/code/errorvis.js +++ b/code/errorvis.js @@ -16,7 +16,7 @@ var ErrorVis = (function() { this.svgContainer .style("margin-top", "1.5em") .style("margin-bottom", "1em") - .style("height", "100%") + .style("height", "75%") // TODO find optimal height .style("width", "100%"); this.spinner = this.container.append("div") @@ -82,6 +82,7 @@ var ErrorVis = (function() { .domain(d3.extent(this.data)); var xAxis = d3.svg.axis() + .tickFormat("") .scale(this.scalerX); var yAxis = d3.svg.axis() .orient("left") diff --git a/code/weightvis.js b/code/weightvis.js index 6e9fc1d..428d3ce 100644 --- a/code/weightvis.js +++ b/code/weightvis.js @@ -510,8 +510,8 @@ var NetVisualizer = (function() { this.reposition(); }; - NetVisualizer.prototype.visualActivate = function(inputs) { - var activations = this.activate(inputs); + NetVisualizer.prototype.visualActivate = function(inputs, step) { + var activations = this.activate(inputs, step); var flatActivations = [].concat.apply([], activations); var max = d3.max(flatActivations, Math.abs), min = d3.min(flatActivations, Math.abs); @@ -521,10 +521,13 @@ var NetVisualizer = (function() { .style("fill", fNodeColor); }; - NetVisualizer.prototype.activate = function(inputs) { + NetVisualizer.prototype.activate = function(inputs, step) { // assumes the sigmoid function is used as activation function activation(x) { return 1 / (1 + Math.exp(-x)); } - var weights = this.data[this.layout.data.batches-1][this.layout.data.epochs-1]; + if (typeof(step) == "undefined") step = this.getSteps() - 1; + var batch = Math.floor(step / this.layout.data.epochs), + epoch = step % this.layout.data.epochs; + var weights = this.data[batch][epoch]; var lastLayerOut = inputs; var activations = [inputs]; var hasBias = false; diff --git a/code/weightviswrapper.js b/code/weightviswrapper.js index ca31916..52b60ed 100644 --- a/code/weightviswrapper.js +++ b/code/weightviswrapper.js @@ -17,7 +17,7 @@ var WeightVisWrapper = (function() { this.svgContainer .style("margin-top", "1.5em") .style("margin-bottom", "1em") - .style("height", "85%") // TODO find optimal height + .style("height", "75%") // TODO find optimal height .style("width", "100%"); this.spinner = this.container.append("div") @@ -96,7 +96,7 @@ var WeightVisWrapper = (function() { } }); this.slider.attr("max", this.steps()-1); - this.slider.node().addEventListener("input", function() { self.jumpTo(self.value); }); + this.slider.node().addEventListener("input", function() { self.jumpTo(this.value); }); this.button.node().addEventListener("click", function toggle() { if (self.button.attr("data-pressed") != "true") { var step = self.slider.node().value; @@ -185,13 +185,13 @@ var WeightVisWrapper = (function() { return this.netVisualizer.getSteps(); }; - WeightVisWrapper.prototype.calculate = function(inputs) { + WeightVisWrapper.prototype.calculate = function(inputs, step) { // returns the final layer's outputs - return this.netVisualizer.activate(inputs).pop(); + return this.netVisualizer.activate(inputs, step).pop(); }; - WeightVisWrapper.prototype.activate = function(inputs) { - this.netVisualizer.visualActivate(inputs); + WeightVisWrapper.prototype.activate = function(inputs, step) { + this.netVisualizer.visualActivate(inputs, step); }; return WeightVisWrapper; @@ -200,6 +200,7 @@ var WeightVisWrapper = (function() { /* helps with impress.js' stepenter/stepleave events */ // TODO move into its own file // TODO must be a step's direct child +// TODO not steppable var VisIntegrater = (function() { function VisIntegrater(enterCb, leaveCb, selector) { var self = this; diff --git a/index.css b/index.css index d102771..e4d2096 100644 --- a/index.css +++ b/index.css @@ -17,10 +17,15 @@ body { opacity: 1; } .innerStep { - position: absolute; opacity: 0; transition: opacity 0.5s; } +div.innerStep { + position: absolute; +} +p.stepped { + opacity: 1; +} .lastInnerstep { opacity: 1; } @@ -47,6 +52,10 @@ table.center { #boston-example .table-highlight { background-color: #82B1FF; } +.highlight { + background-color: #82B1FF; +} +} .hidden { display: none; diff --git a/index.html b/index.html index 82c4966..9f29c09 100644 --- a/index.html +++ b/index.html @@ -13,6 +13,7 @@ + @@ -28,6 +29,12 @@ document.addEventListener("DOMContentLoaded", function() { impress().init(); + MathJax.Hub.Config({ + SVG: { + scale: 150 + } + }); + emojione.imageType = 'svg'; emojione.sprites = true; emojione.imagePathSVGSprites = 'dep/emojione.sprites.svg'; @@ -63,7 +70,7 @@ .style("font-size", function() { var lines = d3.select(this).selectAll("p")[0].length+1; // TODO a bit specific, may not work in all cases if (lines<=1) return this.clientWidth/10 + "px"; - return this.clientHeight/10 + "px"; + return this.clientHeight/(lines*1.3) + "px"; // TODO magic numbers }); var scalePicture = function(d, i, me, extraRatio) { // "extraRatio" might scale vertically @@ -163,12 +170,15 @@

Künstliche neuronale Netze

-

Neuron - künstliches Neuron

+

Neuron – künstliches Neuron

Schema Neuron Schema eines künstlichen Neurons +

$$net = \sum_n (x_n \cdot w_n)$$

+

$$o = \frac{1}{1 + e^{-net}}$$

+

$$\Leftrightarrow o = \frac{1}{1 + e^{-\sum_n (x_n \cdot w_n)}}$$

-

Neuronales Netz - künstliches neuronales Netz

+

Neuronales Netz – künstliches neuronales Netz

Foto Neuron Mehrschichtiges Perzeptron
@@ -208,11 +218,167 @@
+
+

Ein künstliches neuronales Netz

+

Und jetzt?

+
+

13 gegebene Attribute :house_with_garden:

+

crim, zn, indus, chas, nox, rm, age, dis, rad, tax, ptratio, b, lstat

+

1 gesuchtes Attribut :moneybag:

+

medv

+
+
+

Eingabe (13 :game_die:)

+

↓

+

künstliches neuronales Netz (:sparkles:)

+

↓

+

Ausgabe (1 :moneybag:)

+
+
+ +
+

Die Netzstruktur

+
+ + +
+
+

Nö. Anders.

+
+ + +
+ +
+

Problem!

+
+

1.13081, 0, 8.14, 0, 0.538, 5.713, 94.1, 4.233, 4, 307, 21, 360.17, 22.6

+

$$o = \frac{1}{1 + e^{-\sum_n (\mathbf{x_n \cdot w_n})}}$$

+

\begin{align} + &(1)\quad 0 \cdot w_n = 0 \\ + &(2)\quad 0.538 \ll 360.17 + \end{align}

+

$$(1)\quad net = (x_n + 1 \cdot b_n) \cdot w_n$$

+

$$(2)\quad x' = \frac{x - \min(x)}{\max(x) - \min(x)}$$ + $$\implies 0 \leq x' \leq 1$$

+
+
+ +
+

(Eine geht noch.)

+

+ Berechneter MEDV-Wert: lade… - Erwarteter MEDV-Wert: lade… + +

+
+ + +
+ +
+

Training :cookie:

+

$$\delta w_{k,j} = l \cdot (t_k - o_k) \sum_l {w_{l, k} \cdot \delta_l} \cdot x_j$$

+
+

:computer: :hammer:

+

+ $$430 \cdot 300 = 129 000$$ + :hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer::hammer:

+
+
+ +
+

Trainingsverlauf

+
+ + +
+ +
+

Fehlerverlauf

+
+ + +
+ +
+

Test :open_mouth:

+
+ +
+

:blush:

+
+
+ -- cgit v1.3.1