JSFiddle - React, Tailwind, and code Playground

by Thomas

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<script src="https://cdn.rawgit.com/wagenaartje/stocks.js/d6929d7e/dist/stocks.js"></script>
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://wagenaartje.github.io/neataptic/cdn/1.3.4/neataptic.js"></script>
<img src="https://lh6.googleusercontent.com/-CQwEuBRwF08/AAAAAAAAAAI/AAAAAAAAYOY/bGh3lkijgRM/photo.jpg" width=100px/>
<div class="chart" width="400px">
  <canvas id="chart" height="600px"/>
</div>

JavaScript

/* Set up modules */
var { architect, methods } = neataptic;
var stocks = new Stocks('SYTCQBUIU44BX2G4');

/* Constants */
const NORMALIZER = 400;
const TEST_SIZE = 0.1;
const DATA_OPTIONS = {
  symbol: 'TSLA',
  interval: 'daily',
  start: new Date('2015-01-01'),
  end: Date.now()
};

const TRAIN_OPTIONS = {
  	iterations: 5000,
    rate: 1e-3,
    //ratePolicy: methods.rate.STEP(0.9, 3000),
    //dropout: 0.5,
    cost: methods.cost.MSE,
    clear: true,
    log: 1000
};

const network = new architect.LSTM(1, 5, 1);

async function run () {
  /* Fetch & create dataset */
  console.log('Fetching data...');
  var result = await stocks.timeSeries(DATA_OPTIONS);
  result.reverse(); // past -> now

  var trainingSet = [];
  for (var i = 1; i < result.length; i++) {
  	trainingSet.push({
    	input: [result[i - 1].close / NORMALIZER],
      output: [result[i].close / NORMALIZER],
      date: result[i].date
    });
  }

  var testSet = trainingSet.splice(-Math.round(trainingSet.length * TEST_SIZE));

  console.log('training length:', trainingSet.length, ', testSet length:', testSet.length);

  /* Train the network */
  console.log('Training...');
  var result = await network.train(trainingSet, TRAIN_OPTIONS);

  console.log('Training done!', result);

  /* Predict next stocks days value */
  var labels = [];
  var predictions = [];
  var actuals = [];
  var traineds = [];
  var inputs = [];

	for (var i = 0; i < trainingSet.length; i++) {
    network.activate(trainingSet[i].input); // known data
  }


  for (var i = 0; i < testSet.length; i++) {
  	let sample = testSet[i];
    let activation = network.activate(sample.input);

    let prediction = activation[0] * NORMALIZER
    let actual = sample.output[0] * NORMALIZER;
    let input = sample.input[0] * NORMALIZER;

    labels.push(formatDate(sample.date));
    predictions.push(Math.round(prediction * 10) / 10);
    actuals.push(actual);
    inputs.push(input);
  }

  console.log('Drawing chart...');
  new...