-
Notifications
You must be signed in to change notification settings - Fork 0
/
genecar.html
121 lines (100 loc) · 4.67 KB
/
genecar.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>
Sophia Li: Genetic Car
</title>
<!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<link rel='stylesheet' href='css/stylesheet.css' type="text/css"/>
<script src="js/jquery-1.7.2.min.js"></script>
</head>
<body>
<div class="content">
<div class="container">
<div class="navbar">
<table class="navtable">
<tr>
<td><a href="index.html">Home</a></td>
<td><a href="resume.html">Resume</a></td>
<td><a href="about.html">About</a></td>
<td><a href="contact.html">Contact</a></td>
<td><a href="http://blog.justsophie.com">Blog</a></td>
</tr>
</table>
</div>
</br>
<h1 style="margin-bottom:0;"><a href="portfolio.html">Portfolio</a>.Genetic_Car</h1>
<table class="navtable2">
<tr>
<td><a href="jimmy.html"><</a></td>
<td><div id="list"><font color="#5cd9fd">LIST</font></div></td>
<td>></td>
</tr>
</table>
<div class="proj_list">
<a href="website.html">website; </a>
<a href="edwin.html">edwin; </a>
<a href="pseudos.html">pseudOS; </a>
<a href="pendulum.html">pendulum; </a>
<a href="poe.html">desktop_companion; </a>
<a href="walle.html">wall-e; </a>
<a href="underwater.html">underwater_vision; </a>
<a href="jimmy.html">jimmy; </a>
<a href="genecar.html">genetic_car; </a>
</div>
</br>
> ./intro</br>
<iframe src="https://www.youtube.com/embed/KtYzllO-Elk?rel=0&controls=1&showinfo=0" width="560" height="315" frameborder="0" allowfullscreen="allowfullscreen"></iframe></br>
<a href="https://github.com/rileychapman/geneticCar">download source code</a></br>
<a href="http://rileychapman.github.io/geneticCar/">visit project website</a></br>
</br>
> ./stats</br>
Status: Completed May/2014</br>
Languages: Python</br>
Software: Pygame</br>
Hardware: n/a</br>
</br>
> ./documentation</br>
<div class="text_holder">
For our Software Design final project, we wrote a simulation program that would allow you to draw a track, then generate cars that would eventually learn how to drive around said track.
Here's how we modeled each car:</br>
<img src="img/gencar/genecar_model.png" height="250"/></br>
</br>
We generate 15 cars that start with random constants that relate their wheels relative to the car's distance from the wall. As the the cars progress through the generations, the best constants are selected for via our parameters (i.e how fast the car makes it around the track) and the best two survive and act like "parents". Like in natural evolution, the two parent matrices are randomly combined and mutated to form the next generation of the next 15 matrices. This method of combination and mutation ensures that each generation builds from the previous, hopefully in the direction of improvement.</br></br>
This was my first shot at programming in a team environment, and I had learned a bunch about Github and merge conflicts thanks to this. My main contribution to this project was detecting the correct distance of the wall from each car, and the UI elements on the right side of the screen. The UI of the program also went through some drastic changes:</br>
<img src="img/gencar/gencar_gui.gif" height="300"/></br>
</br>
In the end, we got a working program that could successfully generate a car that would somehow figure its way around a track completely autonomously. Looking back on it now, there are so many places where we could've improved the code. Scene loading is really lousy, and we should have created a different way to generate the walls of the track since it errors quite easily as it is now. However, for one of the first ever projects I've done at Olin, I'm still pretty darn proud of it. :)
</br></br>
</div>
<div class="text">> </div>
<div class="cursor">|</div>
</br>
</br>
</div>
<!-- <div class="footer">© Sophia Li 2016</div> -->
</div>
<script type="text/javascript">
$(".proj_list").hide();
$(document).ready(function(){
setInterval('cursorAnimate()', 800);
setInterval('$(".proj_list").hide()', 10000);
$("#list").hover(function(){
$(".proj_list").show();
},
function(){
$(this).removeClass("hover");
});
});
function cursorAnimate(){
$('.cursor').animate({
opacity: 0
}, 'medium', 'swing').animate({
opacity: 1
}, 'medium', 'swing');
}
</script>
</body>
</html>