From 276254f71d8a08da3b3727b5246c245b3c5b1a80 Mon Sep 17 00:00:00 2001
From: Tanner Collin <git@tannercollin.com>
Date: Wed, 22 Apr 2020 21:44:05 +0000
Subject: [PATCH] Add info about chart data

---
 webclient/src/Charts.js | 66 ++++++++++++++++++++++-------------------
 1 file changed, 36 insertions(+), 30 deletions(-)

diff --git a/webclient/src/Charts.js b/webclient/src/Charts.js
index 133a092..eff4c24 100644
--- a/webclient/src/Charts.js
+++ b/webclient/src/Charts.js
@@ -29,38 +29,44 @@ export function Charts(props) {
 
 			<p>Daily since March 2nd, 2020.</p>
 
-			{memberCount &&
-				<ResponsiveContainer width='100%' height={300}>
-					<LineChart data={memberCount}>
-						<XAxis dataKey='date' minTickGap={10} />
-						<YAxis />
-						<CartesianGrid strokeDasharray='3 3'/>
-						<Tooltip />
-						<Legend />
+			<p>
+				{memberCount &&
+					<ResponsiveContainer width='100%' height={300}>
+						<LineChart data={memberCount}>
+							<XAxis dataKey='date' minTickGap={10} />
+							<YAxis />
+							<CartesianGrid strokeDasharray='3 3'/>
+							<Tooltip />
+							<Legend />
 
-						<ReferenceLine x='2020-03-25' stroke='red' label='Space Locked' strokeDasharray='3 3' />
+							<ReferenceLine x='2020-03-25' stroke='red' label='Space Locked' strokeDasharray='3 3' />
 
-						<Line
-							type='monotone'
-							dataKey='member_count'
-							name='Member Count'
-							stroke='#8884d8'
-							strokeWidth={2}
-							dot={false}
-							animationDuration={1000}
-						/>
-						<Line
-							type='monotone'
-							dataKey='green_count'
-							name='Green Count'
-							stroke='#82ca9d'
-							strokeWidth={2}
-							dot={false}
-							animationDuration={1500}
-						/>
-					</LineChart>
-				</ResponsiveContainer>
-			}
+							<Line
+								type='monotone'
+								dataKey='member_count'
+								name='Member Count'
+								stroke='#8884d8'
+								strokeWidth={2}
+								dot={false}
+								animationDuration={1000}
+							/>
+							<Line
+								type='monotone'
+								dataKey='green_count'
+								name='Green Count'
+								stroke='#82ca9d'
+								strokeWidth={2}
+								dot={false}
+								animationDuration={1500}
+							/>
+						</LineChart>
+					</ResponsiveContainer>
+				}
+			</p>
+
+			<p>The Member Count is the amount of Prepaid, Current, Due, and Overdue members on Spaceport.</p>
+
+			<p>The Green Count is the amount of Prepaid and Current members.</p>
 
 		</Container>
 	);