data viz last two pages

content/dataviz/arctic-sea-ice-levels/index.md

@@ -0,0 +1,33 @@
+---
+title: Arctic sea ice levels
+date: 2021-02-23
+---
+<h2> How have Arctic sea ice levels changed over time?</h2>
+
+<p><span style="font-weight: 400;">What is sea ice? Why is it important? This </span><a href="https://earthobservatory.nasa.gov/features/SeaIce" target="_blank" rel="noopener"><span style="font-weight: 400;">NASA article</span></a><span style="font-weight: 400;"> had great answers to both questions: </span><span style="font-weight: 400;"><br>
+</span><i><span style="font-weight: 400;"><br>
+</span></i><i><span style="font-weight: 400;">“Sea ice is a frozen seawater that floats on the ocean surface. It forms in both the Arctic and the Antarctic in each hemisphere’s winter. This floating ice has a profound influence on the polar environment, influencing ocean circulation, weather, and regional climate.”</span></i></p>
+<p><span style="font-weight: 400;">We wondered how we could use data science to see how Arctic sea ice levels have changed over time.&nbsp;</span></p>
+<p><span style="font-weight: 400;">To answer our question we:</span></p>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Gathered sea ice data from </span><a href="https://climate.nasa.gov/vital-signs/global-temperature/" target="_blank" rel="noopener"><span style="font-weight: 400;">NASA</span></a><span style="font-weight: 400;">*.&nbsp;</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Created a scatter plot with a line of best fit. The line of best fit shows trends in the data. The scatterplot we made is called a data visualization.</span></li>
+</ul>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-viz-of-the-week/ice-coverage-best-fit/sea-ice.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<p><i><span style="font-weight: 400;">*Note: we chose NASA data and explanations because the information is from a credible scientific source.</span></i></p>
+<h2><b>Reflect on what you see</b></h2>
+<p><span style="font-weight: 400;">Look and interact with the scatterplot above. When you mouse-over the scatterplot you’ll notice more information appears.</span></p>
+<h4><b>Think about the following questions:</b></h4>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">What do you notice about the scatterplot ?</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">What do you wonder about the data?</span></li>
+</ul>
+<h4><b>Use the fill-in-the-blank prompts to summarize your thoughts:</b></h4>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“I used to think_______”</span></i></li>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“Now I think_______”</span></i></li>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“I wish I knew more about_______”</span></i></li>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“These data visualizations remind me of _______”</span></i></li>
+</ul>
+<h2><b>Learn how we visualized the data</b></h2>
+<p><a href="http://bit.ly/sea-ice-data-viz" target="_blank" rel="noopener"><span style="font-weight: 400;">Go to our walk-through</span></a><span style="font-weight: 400;"> (in Jupyter notebook format) to see how we used the data science process (formulating a question, gathering the data, analyzing the data with code, and creating the visualizations) to create the scatterplot.</span></p>

content/dataviz/covid-19-and-log-scales/index.md

@@ -0,0 +1,43 @@
+---
+title: COVID-19 and log scales
+date: 2020-11-26
+---
+<h2> Have you ever wondered how you can use data to learn about the growth of COVID-19 cases?</h2>
+<p>We answered that question by looking at how long it takes for reported COVID-19 cases to double in Canada. We did this by plotting them using a logarithmic or “log” scale on a line graph.</p>
+<p>We created two log scale graphs:</p>
+<ul>
+<li>Daily reported cases of COVID-19 in Canada</li>
+<li>COVID-19 fatalities in Canada</li>
+</ul>
+<h3>What’s a log scale?</h3>
+<p>Log scales allow us to identify when&nbsp;<a href="https://www.dictionary.com/browse/exponential-growth" target="_blank" rel="noreferrer noopener">exponential growth</a>&nbsp;is happening, even if we don’t see that right away in our data. To see if there’s exponential growth, we tell the log scale what to do using math. In our case, we wanted to see how many days it took for COVID-19 cases in Canada to double.</p>
+<h3>What do the blue bars and red lines mean?</h3>
+<p>There are two plots in these visualizations: a bar plot and line plot.</p>
+<ul>
+<li>Blue bars&nbsp;(left-hand “y-axis”): this is a bar plot that shows the number of daily reported cases. To create this plot, we used data from the&nbsp;<a href="https://systems.jhu.edu/" target="_blank" rel="noreferrer noopener">Johns Hopkins University Center for Systems Science and Engineering (JHU CSSE).</a></li>
+<li>Red line:&nbsp;this is our log-scale line plot that we created by doing some math. It matches up with the red numbers on the right-hand side of the graph.&nbsp;It shows us how many days it takes for COVID-19 cases to double.&nbsp;We made this happen by telling our log scale to take the data from the JHU CSSE and count it using a base-2 log scale. This means we count in factors of 2, and the y-axis values represent the exponent values. For example, a y-axis value of 5 means 2^5 = 32 confirmed cases.</li>
+</ul>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-viz-of-the-week/covid-19-visualizations/reported_Canada_.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<p class="has-text-align-center"><em>Data source:&nbsp;<a href="https://systems.jhu.edu/" target="_blank" rel="noreferrer noopener">Johns Hopkins University Center for Systems Science and Engineering</a></em></p>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-viz-of-the-week/covid-19-visualizations/fatal_Canada_.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<p class="has-text-align-center"><em>Data source:&nbsp;<a href="https://systems.jhu.edu/" target="_blank" rel="noreferrer noopener">Johns Hopkins University Center for Systems Science and Engineering</a></em></p>
+<h2>Reflect on what you see</h2>
+<p>Look and interact with the data visualizations above. When you mouse-over the visualizations, you’ll notice more information appears.</p>
+<p>Think about the following questions:</p>
+<ul>
+<li>What do you notice about the blue bar plot?</li>
+<li>What do you notice about the red line plot?</li>
+<li>What do you wonder about the data?</li>
+<li>Can you use the plot to identify on what dates the number of cases doubled?</li>
+</ul>
+<p>Use the fill-in-the-blank prompts to summarize your thoughts:</p>
+<ul>
+<li><em>“I used to think_______”</em></li>
+<li><em>“Now I think_______”</em></li>
+<li><em>“I wish I knew more about_______”</em></li>
+<li><em>“These data visualizations remind me of_______”</em></li>
+</ul>
+<h2>Learn how we visualized the data</h2>
+<p><a href="https://tinyurl.com/yxfqdkjb" target="_blank" rel="noreferrer noopener">Go to our walk-through</a>&nbsp;(in Jupyter notebook format) to see how we used the data science process (formulating a question, gathering the data, analyzing the data with code, and creating the visualizations) to create these visualizations. In the notebook, you can also explore similar visualizations for several countries affected by COVID-19.</p>
+<h2>Teacher resource</h2>
+<p>To learn more about how to use Callysto learning resources (Jupyter notebooks) in your classroom, visit our&nbsp;<a href="https://bit.ly/callystostarterkit">getting started</a>&nbsp;page.</p>

content/dataviz/data-and-carbon-dioxide/index.md

@@ -0,0 +1,31 @@
+---
+title: Data and carbon dioxide
+date: 2021-02-10
+---
+<h2>How does Canada's CO</b><b><sub>2</sub></b><b> emissions compare to other G7 countries?</h2>
+
+<p><span style="font-weight: 400;">Carbon dioxide (CO<sub>2</sub></span><span style="font-weight: 400;">) is a greenhouse gas. This means it's a "</span><a href="https://climatekids.nasa.gov/greenhouse-cards/" target="_blank" rel="noopener"><span style="font-weight: 400;">gas in the Earth's atmosphere that traps heat</span></a><span style="font-weight: 400;">.” Think about greenhouse gases as tents. If you're camping, the tent covers you and keeps in warm air.&nbsp;</span></p>
+<p><span style="font-weight: 400;">So where does CO<sub>2</sub></span><span style="font-weight: 400;">&nbsp;come from? Commonly, it comes from burning fossil fuels (fuels made from decomposed organisms) such as coal or oil. For example, when you drive a car with a combustion engine, it burns gasoline. When the gasoline is burned, it releases CO<sub>2.</sub></span><span style="font-weight: 400;">&nbsp;</span></p>
+<p><span style="font-weight: 400;">We used data science to learn how Canada's CO<sub>2 </sub></span><span style="font-weight: 400;">emissions compared to other G7 countries. The </span><a href="https://www.international.gc.ca/world-monde/international_relations-relations_internationales/g7/index.aspx?lang=eng#a4"><span style="font-weight: 400;">G7</span></a><span style="font-weight: 400;"> is a group of seven nations that meet to discuss international and local issues.</span></p>
+<p><b>To answer our question, we:</b></p>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Gathered data from</span><a href="https://data.worldbank.org/" target="_blank" rel="noopener"> <span style="font-weight: 400;">World Bank Open Data</span></a><span style="font-weight: 400;"> about CO<sub>2 </sub></span><span style="font-weight: 400;">emissions in G7 nations. “Per capita” means emissions for each person in each&nbsp; nation.&nbsp;</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Created a line graph to compare each nation's CO<sub>2 </sub></span><span style="font-weight: 400;">emissions. We call this line graph a data visualization.</span></li>
+</ul>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-viz-of-the-week/world-carbon-emissions/co2-per-capita.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<h2><b>Reflect on what you see</b></h2>
+<p><span style="font-weight: 400;">Look and interact with the data visualization above. When you mouse-over the line graph, you’ll notice more information appears.</span></p>
+<h4><b>Think about the following questions:</b></h4>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">What do you notice about the line graph?</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">What do you wonder about the data?</span></li>
+</ul>
+<h4><b>Use the fill-in-the-blank prompts to summarize your thoughts:</b></h4>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“I used to think_______”</span></i></li>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“Now I think_______”</span></i></li>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“I wish I knew more about_______”</span></i></li>
+<li style="font-weight: 400;" aria-level="1"><i><span style="font-weight: 400;">“This data visualization reminds me of_______”</span></i></li>
+</ul>
+<h2><b>Learn how we visualized the data</b></h2>
+<p><a href="http://bit.ly/datavizC02" target="_blank" rel="noopener"><span style="font-weight: 400;">Go to our walk-through</span></a><span style="font-weight: 400;"> (in Jupyter notebook format) to see how we used the data science process (formulating a question, gathering the data, analyzing the data with code, and creating the visualizations) to create the line graph.</span></p>

content/dataviz/data-science-and-climate-change/index.md

@@ -0,0 +1,38 @@
+---
+title: Data science and climate change
+date: 2021-02-04
+---
+<h2> How can we use data to look for evidence of climate change?</h2>
+<p><span style="font-weight: 400;">When we think about climate change, temperature is a factor. Here’s a fun fact about temperature scales. When you hear people say, “degrees Fahrenheit”, did you know “Fahrenheit” was a person? Daniel Fahrenheit lived over 300 years ago and invented the</span><a href="https://www.britannica.com/biography/Daniel-Gabriel-Fahrenheit" target="_blank" rel="noopener"><span style="font-weight: 400;">&nbsp;mercury thermometer</span></a><span style="font-weight: 400;">. Even before Fahrenheit, going back to the time of </span><a href="https://www.britannica.com/science/weather-forecasting/History-of-weather-forecasting" target="_blank" rel="noopener"><span style="font-weight: 400;">Ancient Greece</span></a><span style="font-weight: 400;">, people were measuring temperature changes.</span></p>
+<p><span style="font-weight: 400;">We wondered what temperature change looked like in cities across Canada. Let’s look at Edmonton, Alberta. You’ll also see a map that shows temperature increases in the five cities we analyzed (Edmonton, Toronto, Vancouver, Fredericton, and Yellowknife) over the last 100 years.&nbsp;</span></p>
+<p><b>To answer our question, we:</b></p>
+<ul>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Gathered weather data from</span><a href="https://www.weatherstats.ca/" target="_blank" rel="noopener"> <span style="font-weight: 400;">weatherstats.ca</span></a><span style="font-weight: 400;">. The website uses data from </span><span style="font-weight: 400;">Environment and Climate Change Canada.</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Created scatter plots from the data (which you’ll see below, for the temperature in Edmonton), to see the temperature changes. These scatter plots are called data visualizations.</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Experimented with different time frames, to look at temperature changes. We chose five-year and 75-year time frames.</span></li>
+<li style="font-weight: 400;" aria-level="1"><span style="font-weight: 400;">Created a map data visualization to show the temperature increases over the last 100 years in the five cities we analyzed.&nbsp;</span></li>
+</ul>
+<p><span style="font-weight: 400;">You’ll see a </span><span style="font-weight: 400;"><span style="color: #ff0000;">red line</span> </span><span style="font-weight: 400;">in the graphs. That’s the trend line – it shows us how much the data is changing over time.&nbsp;</span></p>
+<h3><span style="font-weight: 400; color: #800080;">Edmonton, Alberta: Daily temperature changes across five years</span></h3>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-files/data-viz-of-the-week/climate-change-temperature/visualizations/EdmontonDailyTemps_5yr.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<h3><span style="font-weight: 400; color: #800080;">Edmonton, Alberta: Yearly temperature changes across 75 years</span></h3>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-files/data-viz-of-the-week/climate-change-temperature/visualizations/EdmontonAnnualTemps.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<h3><span style="font-weight: 400; color: #800080;">Temperature changes in the five cities over 100 years</span></h3>
+<p><iframe loading="lazy" id="igraph" class="post-img-shadow" style="border: none;" src="https://callysto.github.io/data-files/data-viz-of-the-week/climate-change-temperature/visualizations/city_view.html" width="100%" height="600" scrolling="no" seamless="seamless"></iframe></p>
+<h2><b>Reflect on what you see</b></h2>
+<p><span style="font-weight: 400;">Look and interact with the data visualizations above. When you mouse-over the visualizations, more information appears.</span></p>
+<h4><b>Think about the following questions:</b></h4>
+<ul>
+<li style="font-weight: 400;"><span style="font-weight: 400;">What do you notice about the data visualizations?</span></li>
+<li style="font-weight: 400;"><span style="font-weight: 400;">What do you wonder about the data?</span></li>
+<li>What do you think may be causing the temperature changes in each city?</li>
+</ul>
+<h4><b>Use the fill-in-the-blank prompts to summarize your thoughts:</b></h4>
+<ul>
+<li style="font-weight: 400;"><i><span style="font-weight: 400;">“I used to think_______”</span></i></li>
+<li style="font-weight: 400;"><i><span style="font-weight: 400;">“Now I think_______”</span></i></li>
+<li style="font-weight: 400;"><i><span style="font-weight: 400;">“I wish I knew more about_______”</span></i></li>
+<li style="font-weight: 400;"><i><span style="font-weight: 400;">“These data visualizations remind me of_______”</span></i></li>
+</ul>
+<h2><b>Learn how we visualized the data</b></h2>
+<p><a href="http://bit.ly/datavizclimatechange" target="_blank" rel="noopener"><span style="font-weight: 400;">Go to our walk-through</span></a><span style="font-weight: 400;">&nbsp;</span><span style="font-weight: 400;">(in Jupyter notebook format) to see how we used the data science process (formulating a question, gathering the data, analyzing the data with code, and creating the visualizations) to create the data visualizations.</span></p>