From 2bb34512081cb8d1e425041bcc43f7b7d9ce449d Mon Sep 17 00:00:00 2001
From: Matthew Huntington <matt.huntington@gmail.com>
Date: Thu, 28 Sep 2023 22:23:58 -0400
Subject: [PATCH] separate button to display standard deviation

---
 public/app.js     | 13 ++++++++++---
 public/index.html |  4 +++-
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/public/app.js b/public/app.js
index 8f3f890..1d51799 100644
--- a/public/app.js
+++ b/public/app.js
@@ -13,7 +13,8 @@ let leftAxis;
 let zoomScale = 1
 let averageOutcomesArray
 let sortedInstances;
-let displayAverage = true;
+let displayAverage = false;
+let displayStandardDeviation = false;
 
 const randomColor = ()=>{
 	const red = Math.floor(Math.random()*128) + 64;
@@ -333,7 +334,8 @@ const displayMeanStandardDeviation = () => {
 				.x(d => xScale(parseTime(d.initialGraduationDate)))
 				.y(d => (yAxis === 'outcomes') ? yScale(d.averageOutcomes) : yScale(d.averageDropped))
 			)
-
+	}
+	if(displayStandardDeviation){
 		d3.select('#points')
 			.append('path')
 			.datum(averageOutcomesArray)
@@ -361,11 +363,16 @@ const displayMeanStandardDeviation = () => {
 }
 
 const setUpDisplayAverageHandler = ()=>{
-	d3.select('#average input')
+	d3.select('#average input:nth-child(2)')
 		.on('click', (event)=>{
 			displayAverage = event.target.checked
 			displayMeanStandardDeviation()
 		})
+	d3.select('#average input:nth-child(3)')
+		.on('click', (event)=>{
+			displayStandardDeviation = event.target.checked
+			displayMeanStandardDeviation()
+		})
 }
 
 window.onload = async ()=>{
diff --git a/public/index.html b/public/index.html
index 143080c..43da49c 100644
--- a/public/index.html
+++ b/public/index.html
@@ -25,8 +25,10 @@
 			</section>
 			<section id="average">
 				<h3>Display Average?</h3>
-				<input type='checkbox' checked/>
+				<input type='checkbox' />
 				Display Average?
+				<input type='checkbox' />
+				Display Standard Deviation?
 			</section>
 			<section id="metros">
 				<h3>Choose Metros To Display</h3>