diff --git a/index.html b/index.html
index c968556..3222118 100644
--- a/index.html
+++ b/index.html
@@ -12,6 +12,7 @@
 	<link rel="stylesheet" href="inc/bootstrap-4.4.1/bootstrap.min.css">
 	<link rel="stylesheet" href="inc/bootswatch-flatly/bootstrap.min.css">	
 	
+	<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.3/dist/Chart.min.js"></script>
 	<script src="lib.js"></script>
 	<script src="classes.js"></script>
 	<script src="simulator.js"></script>
@@ -40,7 +41,8 @@
 	</style>
 
 	<script>	
-		var templateHTML = null;			
+		var templateHTML = null;
+		var currentCharts = [];
 
 		loadWebResource("results template.html", function(results) {
 			templateHTML = results;
@@ -71,8 +73,39 @@
 			coronaSimSettings.populationInt = getSliderValue("populationCapSlider");
 
 			/* Note: this is where all of the magic happens, this method makes a simulator, steps through the sim, and returns html output */
-			el("simulationOutput").innerHTML = generateSimulationOutput(templateHTML, coronaSimSettings);
+			const tableData = generateSimulationOutput(coronaSimSettings);
+			
+			el("simulationOutput").innerHTML = generateTableHTML(tableData, templateHTML, coronaSimSettings)
 			window.scrollBy(0, 200);
+			console.log(tableData);
+window.tableData=tableData
+			var ctx = document.getElementById('myChart').getContext('2d');
+			currentCharts.forEach(function(cc){
+				cc.destroy();
+			})
+			var infectionsChart = new Chart(ctx, {
+				type: 'line',
+				data: {
+				labels: tableData.map(a=>a.dayStats.dayNumberInt),
+				datasets: [{
+					label: 'Infections',
+					backgroundColor: 'red',
+					borderColor: 'red',
+					data:  tableData.map(a=>a.dayStats.infectionsInt),
+					fill: false,
+				}]
+			},
+				options: {
+					scales: {
+						yAxes: [{
+							ticks: {
+								beginAtZero: true
+							}
+						}]
+					}
+				}
+			});
+			currentCharts=[myChart];
 		}
 
 		document.addEventListener('DOMContentLoaded', function() {			
@@ -221,7 +254,9 @@ <h3>The Simulator</h3>
 					<button type='submit' class="btn btn-primary">Run Simulation</button>
 				</div>
 			</form>
-			<div class='simulationOutput pt-3' id='simulationOutput' />
+			<canvas id="myChart" width="400" height="400"></canvas>
+
+			<div class='simulationOutput pt-3' id='simulationOutput' ></div>
 		</div>		
 	</div>
 </body>
diff --git a/lib.js b/lib.js
index 0359d38..507de2f 100644
--- a/lib.js
+++ b/lib.js
@@ -201,7 +201,7 @@ function populateTemplate(template, dayStats, totalStats, currentHospitalizedInt
 	return templateCopy;
 }
 
-function generateSimulationOutput(template, coronaSimSettings) {
+function generateSimulationOutput(coronaSimSettings) {
 	var simulator = new CoronaSimulator(coronaSimSettings);
 	
 	var tableDataArray = [];
@@ -225,6 +225,10 @@ function generateSimulationOutput(template, coronaSimSettings) {
 			break;
 		}
 	}
+	return tableDataArray;
+}
+
+function generateTableHTML(tableDataArray, template, coronaSimSettings) {
 	var html = "<div class='testResults'>\n";
 	for (var tableEntry of tableDataArray) {
 		html += populateTemplate(template, tableEntry.dayStats, tableEntry.totalStats,