Skip to content

Commit a6b9605

Browse files
nkreegernkreeger
authored
Baseball Model Cleanup (#216)
* save * save * save * Pitch type model. * Add utils. * save * Cleanup * Rename * save * save * save * Actually train * More cleanup * Make training data all work! * Drop all TS * Drop all TS * save * save * Dev-server config * Save * Fix title * save argparser * Cleanup * save * Save * save * save
1 parent 1992ff6 commit a6b9605

27 files changed

+1081
-2706
lines changed

‎baseball-node/src/client/app.ts renamed to ‎baseball-node/client.js

Lines changed: 26 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/**
22
* @license
3-
* Copyright 2018 Google LLC. All Rights Reserved.
3+
* Copyright 2019 Google LLC. All Rights Reserved.
44
* Licensed under the Apache License, Version 2.0 (the "License");
55
* you may not use this file except in compliance with the License.
66
* You may obtain a copy of the License at
@@ -15,45 +15,37 @@
1515
* =============================================================================
1616
*/
1717

18-
import * as socketioClient from 'socket.io-client';
19-
import Vue from 'vue';
20-
import {AccuracyPerClass} from '../types';
18+
import io from 'socket.io-client';
19+
const evalTestButton = document.getElementById('eval-test-button');
2120

22-
const SOCKET = 'http://localhost:8001/';
21+
const socket =
22+
io('http://localhost:8001',
23+
{reconnectionDelay: 300, reconnectionDelayMax: 300});
2324

24-
// tslint:disable-next-line:no-default-export
25-
export default Vue.extend({
26-
mounted: () => {
27-
const liveButton = document.getElementById('live-button');
28-
const socket = socketioClient(
29-
SOCKET, {reconnectionDelay: 300, reconnectionDelayMax: 300});
30-
socket.connect();
31-
32-
socket.on('connect', () => {
33-
liveButton.style.display = 'block';
34-
liveButton.textContent = 'Test Live';
35-
});
25+
const BAR_WIDTH_PX = 300;
3626

37-
socket.on('accuracyPerClass', (accPerClass: AccuracyPerClass) => {
38-
plotAccuracyPerClass(accPerClass);
39-
});
27+
evalTestButton.onclick = () => {
28+
evalTestButton.textContent = 'Loading...';
29+
socket.emit('test_data', 'true');
30+
};
4031

41-
socket.on('disconnect', () => {
42-
liveButton.style.display = 'block';
43-
document.getElementById('waiting-msg').style.display = 'block';
44-
document.getElementById('table').style.display = 'none';
45-
});
32+
socket.on('connect', () => {
33+
evalTestButton.style.display = 'block';
34+
evalTestButton.textContent = 'Eval Test';
35+
});
4636

47-
liveButton.onclick = () => {
48-
liveButton.textContent = 'Loading...';
49-
socket.emit('live_data', '' + true);
50-
};
51-
},
37+
socket.on('accuracyPerClass', (accPerClass) => {
38+
plotAccuracyPerClass(accPerClass);
5239
});
5340

54-
const BAR_WIDTH_PX = 300;
41+
socket.on('disconnect', () => {
42+
evalTestButton.style.display = 'block';
43+
document.getElementById('waiting-msg').style.display = 'block';
44+
document.getElementById('table').style.display = 'none';
45+
});
5546

56-
function plotAccuracyPerClass(accPerClass: AccuracyPerClass) {
47+
function plotAccuracyPerClass(accPerClass) {
48+
console.log(accPerClass);
5749
document.getElementById('table').style.display = 'block';
5850
document.getElementById('waiting-msg').style.display = 'none';
5951

@@ -83,14 +75,13 @@ function plotAccuracyPerClass(accPerClass: AccuracyPerClass) {
8375

8476
plotScoreBar(scores.training, scoreContainer);
8577
if (scores.validation) {
86-
document.getElementById('live-button').style.display = 'none';
78+
document.getElementById('eval-test-button').style.display = 'none';
8779
plotScoreBar(scores.validation, scoreContainer, 'validation');
8880
}
8981
});
9082
}
9183

92-
function plotScoreBar(
93-
score: number, container: HTMLDivElement, className = '') {
84+
function plotScoreBar(score, container, className = '') {
9485
const scoreDiv = document.createElement('div');
9586
scoreDiv.className = 'score ' + className;
9687
scoreDiv.style.width = (score * BAR_WIDTH_PX) + 'px';

‎baseball-node/index.html

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<title>Pitch Training Accuracy</title>
5+
</head>
6+
<body>
7+
<h3 id="waiting-msg">Waiting for server...</h3>
8+
<div id="table">
9+
<h2 style="text-align:center;">Pitch accuracy (%)</h2>
10+
<div id="legend">
11+
<div class="legend-item">
12+
<div class="score"></div>
13+
<div>Train set</div>
14+
</div>
15+
<div class="legend-item">
16+
<div class="score validation"></div>
17+
<div>Live set</div>
18+
</div>
19+
</div>
20+
<div id="table-rows"></div>
21+
<button id="eval-test-button">Eval Test</button>
22+
</div>
23+
<script src="dist/bundle.js"></script>
24+
<style>
25+
#table {
26+
width: 660px;
27+
display: none;
28+
}
29+
#table-rows {
30+
border-right: 2px solid #bbb;
31+
}
32+
#table .row {
33+
display: flex;
34+
align-items: center;
35+
margin: 25px 0;
36+
}
37+
#legend {
38+
position: absolute;
39+
}
40+
.legend-item {
41+
display: flex;
42+
align-items: center;
43+
margin-bottom: 20px;
44+
}
45+
46+
.legend-item .score {
47+
width: 30px;
48+
margin-right: 10px;
49+
}
50+
51+
.label {
52+
text-align: center;
53+
font-family: "Google Sans", sans-serif;
54+
font-size: 24px;
55+
color: #5f6368;
56+
line-height: 24px;
57+
font-weight: 500;
58+
}
59+
#table .label {
60+
margin-right: 20px;
61+
width: 360px;
62+
text-align: right;
63+
}
64+
#table .score {
65+
background-color: #0277bd;
66+
height: 30px;
67+
text-align: right;
68+
line-height: 30px;
69+
color: white;
70+
padding-right: 10px;
71+
box-sizing: border-box;
72+
}
73+
#table .score.validation {
74+
background-color: #ef6c00;
75+
}
76+
77+
html,
78+
body {
79+
font-family: Roboto, sans-serif;
80+
color: #5f6368;
81+
}
82+
83+
body {
84+
background-color: rgb(248, 249, 250);
85+
}
86+
87+
#accuracyCanvas > div {
88+
display: none;
89+
}
90+
91+
#eval-test-button {
92+
padding: 10px;
93+
font-size: 24px;
94+
}
95+
</style>
96+
</body>
97+
</html>

‎baseball-node/package.json

Lines changed: 9 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,23 @@
11
{
22
"name": "tfjs-examples-baseball-node",
3-
"version": "0.1.0",
3+
"version": "0.2.0",
44
"description": "Deep learning models for classifying baseball metrics",
55
"scripts": {
6-
"build": "tsc",
7-
"build-client": "webpack",
8-
"link-local": "yalc link",
96
"download-data": "./scripts/download-data.sh",
10-
"start-client": "webpack-dev-server --content-base src/client",
11-
"start-server": "ts-node src/server/server.ts",
12-
"train-pitch-model": "ts-node src/train/pitch-model.ts",
13-
"train-strike-model": "ts-node src/train/strike-model.ts"
7+
"start-client": "webpack-dev-server",
8+
"start-server": "node server.js"
149
},
1510
"license": "Apache-2.0",
1611
"devDependencies": {
17-
"@types/socket.io": "~1.4.33",
18-
"@types/socket.io-client": "~1.4.32",
1912
"clang-format": "~1.2.3",
20-
"css-loader": "~0.28.11",
21-
"file-loader": "~1.1.11",
2213
"mkdirp": "~0.5.1",
23-
"ts-loader": "~4.2.0",
24-
"ts-node": "~6.0.2",
25-
"tslint": "~5.9.1",
26-
"typescript": "~2.8.3",
27-
"vue-loader": "~14.2.2",
28-
"vue-template-compiler": "~2.5.16",
29-
"webpack": "~4.16.5",
30-
"webpack-cli": "~3.1.0",
31-
"webpack-dev-server": "~3.1.5",
32-
"yalc": "~1.0.0-pre.22"
14+
"webpack": "~4.28.4",
15+
"webpack-cli": "^3.2.1",
16+
"webpack-dev-server": "~3.1.14"
3317
},
3418
"dependencies": {
35-
"@tensorflow/tfjs-node": "^0.2.1",
36-
"baseball-pitchfx-types": "~0.0.4",
37-
"node-simple-timer": "~0.0.1",
38-
"socket.io": "~2.1.0",
39-
"vue": "~2.5.16"
19+
"@tensorflow/tfjs-node": "^0.2.3",
20+
"argparse": "^1.0.10",
21+
"socket.io": "~2.2.0"
4022
}
4123
}

0 commit comments

Comments
 (0)