repo init

1DGAN/.babelrc

@@ -0,0 +1,18 @@
+{
+  "presets": [
+    [
+      "env",
+      {
+        "esmodules": false,
+        "targets": {
+          "browsers": [
+            "> 3%"
+          ]
+        }
+      }
+    ]
+  ],
+  "plugins": [
+    "@babel/plugin-transform-runtime"
+  ]
+}

1DGAN/README.md

@@ -0,0 +1,15 @@
+# TensorFlow.js Example: Multivariate Regression for browser
+
+This example shows you how to perform regression with more than one input feature using [Boston Housing Dataset](https://www.cs.toronto.edu/~delve/data/boston/bostonDetail.html) which is a famous dataset derived from information collected by the U.S. Census Service concerning housing in the area of Boston Massachusetts.
+
+Prepare the environment:
+```sh
+$ npm install
+# Or
+$ yarn
+```
+
+To build and watch the example, run:
+```sh
+$ yarn watch
+```

1DGAN/data.js

@@ -0,0 +1,126 @@
+/**
+ * @license
+ * Copyright 2018 Google LLC. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * =============================================================================
+ */
+
+const Papa = require('papaparse');
+
+
+// Boston Housing data constants:
+const BASE_URL =
+    'https://storage.googleapis.com/tfjs-examples/multivariate-linear-regression/data/';
+
+const TRAIN_FEATURES_FN = 'train-data.csv';
+const TRAIN_TARGET_FN = 'train-target.csv';
+const TEST_FEATURES_FN = 'test-data.csv';
+const TEST_TARGET_FN = 'test-target.csv';
+
+/**
+ * Given CSV data returns an array of arrays of numbers.
+ *
+ * @param {Array<Object>} data Downloaded data.
+ *
+ * @returns {Promise.Array<number[]>} Resolves to data with values parsed as floats.
+ */
+const parseCsv = async (data) => {
+  return new Promise(resolve => {
+    data = data.map((row) => {
+      return Object.keys(row).map(key => parseFloat(row[key]));
+    });
+    resolve(data);
+  });
+};
+
+/**
+ * Downloads and returns the csv.
+ *
+ * @param {string} filename Name of file to be loaded.
+ *
+ * @returns {Promise.Array<number[]>} Resolves to parsed csv data.
+ */
+export const loadCsv = async (filename) => {
+  return new Promise(resolve => {
+    const url = `${BASE_URL}${filename}`;
+
+    console.log(`  * Downloading data from: ${url}`);
+    Papa.parse(url, {
+      download: true,
+      header: true,
+      complete: (results) => {
+        resolve(parseCsv(results['data']));
+      }
+    })
+  });
+};
+
+/** Helper class to handle loading training and test data. */
+export class BostonHousingDataset {
+  constructor() {
+    // Arrays to hold the data.
+    this.trainFeatures = null;
+    this.trainTarget = null;
+    this.testFeatures = null;
+    this.testTarget = null;
+  }
+
+  get numFeatures() {
+    // If numFetures is accessed before the data is loaded, raise an error.
+    if (this.trainFeatures == null) {
+      throw new Error('\'loadData()\' must be called before numFeatures')
+    }
+    return this.trainFeatures[0].length;
+  }
+
+  /** Loads training and test data. */
+  async loadData() {
+    [this.trainFeatures, this.trainTarget, this.testFeatures, this.testTarget] =
+        await Promise.all([
+          loadCsv(TRAIN_FEATURES_FN), loadCsv(TRAIN_TARGET_FN),
+          loadCsv(TEST_FEATURES_FN), loadCsv(TEST_TARGET_FN)
+        ]);
+
+    shuffle(this.trainFeatures, this.trainTarget);
+    shuffle(this.testFeatures, this.testTarget);
+  }
+}
+
+export const featureDescriptions = [
+  'Crime rate', 'Land zone size', 'Industrial proportion', 'Next to river',
+  'Nitric oxide concentration', 'Number of rooms per house', 'Age of housing',
+  'Distance to commute', 'Distance to highway', 'Tax rate', 'School class size',
+  'School drop-out rate'
+];
+
+/**
+ * Shuffles data and target (maintaining alignment) using Fisher-Yates
+ * algorithm.flab
+ */
+function shuffle(data, target) {
+  let counter = data.length;
+  let temp = 0;
+  let index = 0;
+  while (counter > 0) {
+    index = (Math.random() * counter) | 0;
+    counter--;
+    // data:
+    temp = data[counter];
+    data[counter] = data[index];
+    data[index] = temp;
+    // target:
+    temp = target[counter];
+    target[counter] = target[index];
+    target[index] = temp;
+  }
+};

1DGAN/index.html

@@ -0,0 +1,114 @@
+<!--
+Copyright 2018 Google LLC. All Rights Reserved.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+==============================================================================
+-->
+
+<html>
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="../shared/tfjs-examples.css" />
+
+  <style>
+    .negativeWeight {
+      color: #cc0000;
+    }
+
+    .positiveWeight {
+      color: #00aa00;
+    }
+
+    #buttons {
+      margin-top: 20px;
+      padding: 5px;
+    }
+
+    #oneHidden {
+      border-left: 1px solid #ededed;
+      border-right: 1px solid #ededed;
+    }
+
+    #linear,
+    #oneHidden,
+    #twoHidden {
+      padding: 5px;
+    }
+  </style>
+</head>
+
+<body>
+  <div class='tfjs-example-container centered-container'>
+    <section class='title-area'>
+      <h1>Multivariate Regression</h1>
+      <p class='subtitle'>Compare different models for housing price prediction.</p>
+    </section>
+
+    <section>
+      <p class='section-head'>Description</p>
+      <p>
+        This example shows you how to perform regression with more than one input feature using the
+        <a href="https://www.cs.toronto.edu/~delve/data/boston/bostonDetail.html">Boston Housing Dataset</a>,
+        which is a famous dataset derived from information collected by the U.S. Census Service concerning housing
+        in the area of Boston Massachusetts.
+      </p>
+      <p>
+        It allows you to compare the performance of 3 different models for predicting the house prices. When training
+        the linear model, it will also display the largest 5 weights (by absolute value) of the model and
+        the feature associated with each of those weights.
+      </p>
+    </section>
+
+    <section>
+      <p class='section-head'>Status</p>
+      <p id="status">Loading data...</p>
+      <p id="baselineStatus">Baseline not computed...</p>
+    </section>
+
+    <section>
+      <p class='section-head'>Training Progress</p>
+      <div class="with-cols">
+        <div id="linear">
+          <div class="chart"></div>
+          <div class="status"></div>
+          <div id="modelInspectionOutput">
+            <p id="inspectionHeadline"></p>
+            <table id="myTable"></table>
+          </div>
+        </div>
+        <div id="oneHidden">
+          <div class="chart"></div>
+          <div class="status"></div>
+        </div>
+        <div id="twoHidden">
+          <div class="chart"></div>
+          <div class="status"></div>
+        </div>
+      </div>
+
+      <div id="buttons">
+        <div class="with-cols">
+          <button id="simple-mlr">Train Linear Regressor</button>
+          <button id="nn-mlr-1hidden">Train Neural Network Regressor (1 hidden layer)</button>
+          <button id="nn-mlr-2hidden">Train Neural Network Regressor (2 hidden layers)</button>
+        </div>
+      </div>
+
+    </section>
+  </div>
+  <script src="index.js"></script>
+</body>
+
+</html>