michael/webai
1
0
Fork 0
generated from michael/webpack-base
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add tips and a readme

Browse Source
This commit is contained in:
Michael Peters 2024-08-04 14:08:44 -07:00
parent dc7f314298
commit fa489cdbab
3 changed files with 70 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/snake/index.scss
View File

@ -5,12 +5,14 @@
display: flex;
flex-flow: row nowrap;
.ui {
#ui {
display: flex;
flex-flow: row nowrap;
align-items: flex-start;
justify-content: flex-start;
margin-bottom: 10px;
canvas#board {
margin-right: 20px;
}
@ -25,4 +27,16 @@
}
}
}
#tips {
display: flex;
:not(:last-child) {
margin-right: 20px;
}
a {
color: inherit;
}
}
}

27
src/components/snake/index.tsx
View File

@ -78,13 +78,26 @@ const SnakePage: FC = () => {
return (
<div id="snake">
<div className="ui">
<canvas id="board" ref={boardRef} width={BOARD_SIZE} height={BOARD_SIZE} />
<div className="table-container">
<table id="snaps">
<thead>{tableHead('Itr', 'Avg', 'Min', '20%', '40%', '60%', '80%', '90%', '95%', 'Max')}</thead>
<tbody>{labSnapsTRs}</tbody>
</table>
<div>
<div id="ui">
<canvas id="board" ref={boardRef} width={BOARD_SIZE} height={BOARD_SIZE} />
<div className="table-container">
<table id="snaps">
<thead>
{tableHead('Itr', 'Avg', 'Min', '20%', '40%', '60%', '80%', '90%', '95%', 'Max')}
</thead>
<tbody>{labSnapsTRs}</tbody>
</table>
</div>
</div>
<div id="tips">
<div>5,000 snakes per generation</div>
<div>Press Spacebar for Slow Motion</div>
<div>
<a href="https://git.beefslab.com/michael/webai/src/branch/master/src/components/snake">
View Repo
</a>
</div>
</div>
</div>
</div>

35
src/components/snake/readme.md Normal file
View File

@ -0,0 +1,35 @@
# Snake Lab
Allows you to create neural networks that play snake.
Clone this repo, install with `npm install`, and run `make serve` to adjust the simulation.
## Configurable Options:
| option | description | default |
|--------|-------------|---------|
| SNAKES | Number of snakes per iteration | 5,000 |
| STARVE_STEPS | Number of steps without food before a snake dies of starvation | 120 |
| CULL_RATIO | Ratio of snakes that are selected against every iteration | 0.8 (80%) |
| MUTATE_RATE | Rate at which individual Perceptron weights are mutated | 0.03 (3%) |
| MUTATE_MAG | Maximum magnitude for a Perceptron weight to change if it mutates | 5.0 |
| hiddenLayerNodes | Number of nodes in each snake's hidden layer | 6 |
## Game State Features (See also: `snake-brain.ts`)
| feature | description |
|---------|-------------|
| Head Position (x, y) | The position of the snake's head |
| Apple Relative to Head (x, y) | The position of the apple relative to the snake's head |
| Distance to Tail (+/- x, +/- y) | The distance to the closest square occupied by the snake's tail in 4 directions |
## Directory Structure
| file | description |
|------|-------------|
| brain.ts | General Perceptron Neural Network |
| game-engine.ts | Canvas Rendering Tools |
| snake-brain.ts | Converts game states into feature vectors and decides movement direction |
| hashset.tsx | Hash Set implementation used for detecting cycles |
| index.tsx | UI Layer |
| canvas.ts | Game Loop & Canvas Rendering Loop |