Lab 4 - Lists - HackMD

# Lab 4 - Lists In this lab, you’ll be using everything you’ve learned about tables (and some of what you’ve learned about lists) to create a data visualization tool. Specifically, you’ll use a dataset of active Providence business licenses published by the Rhode Island government to mark locations on a map.<h2 class="part" data-startline="9" data-endline="9" id="Learning-Objective" data-id="Learning-Objective"><a class="anchor hidden-xs" href="#Learning-Objective" title="Learning-Objective" smoothhashscroll=""></a>Learning Objective</h2>A key goal of this lab is to give you practice breaking large problems into separate tasks, each of which gets handled with its own collection of functions, expressions, and operators. As you work on the problems, practice writing out the lists of tasks and using those to guide your work.<h2 class="part" data-startline="13" data-endline="13" id="Resources" data-id="Resources"><a class="anchor hidden-xs" href="#Resources" title="Resources" smoothhashscroll=""></a>Resources</h2><a href="https://www.pyret.org/docs/latest/lists.html#%28part._lists_.List_shared._methods_filter%29" target="_blank" rel="noopener">Pyret List documentation </a><h2 class="part" data-startline="17" data-endline="17" id="Part-1-Warm-up-with-Lists" data-id="Part-1-Warm-up-with-Lists"><a class="anchor hidden-xs" href="#Part-1-Warm-up-with-Lists" title="Part-1-Warm-up-with-Lists" smoothhashscroll=""></a>Part 1: Warm up with Lists</h2>Before we get into maps, however, let’s practice writing functions with lists. We’re going to do a set of problems that involve processing emails. Your goal is to use a combination of <code data-position="1034" data-size="6">filter</code>, <code data-position="1044" data-size="3">map</code>, <code data-position="1051" data-size="8">distinct</code>, <code data-position="1063" data-size="6">length</code>, and <code data-position="1077" data-size="4">.get</code> on lists to solve these problems.Task: Define two lists of strings, one that has all valid email addresses (like “<a href="mailto:kathi@jpgacademy.org" target="_blank" rel="noopener">kathi@jpgacademy.org</a>”, “<a href="mailto:ice@google.com" target="_blank" rel="noopener">ice@google.com</a>”, etc) and one that also has some invalid ones (missing @, anything after the username, etc). You’ll use these for testing.Task: Write a function that takes a list of email addresses and counts the number that are from <code data-position="1463" data-size="4">.edu</code> addresses (it’s okay to just use <code data-position="1503" data-size="15">string-contains</code> here, rather than checking that <code data-position="1553" data-size="4">.edu</code> is at the end of the address).Task: Write a function that takes a list of emails and returns the ones that lack the “@” sign.Task: Write a function that takes a list of email addresses and returns just a list of the usernames (dropping everything starting from the @. Look up <code data-position="1848" data-size="12">string-split</code>; there’s also <code data-position="1877" data-size="11">LIST.get(n)</code> which gets the nth item from a list, starting from 0).If you have time (meaning you are less than 40 minutes into lab) also try the following task:Task: Return a list of unique school names represented in a list of email addresses. The school names appear between the “@” and “.edu” in .edu addresses.<h2 class="part" data-startline="35" data-endline="35" id="Part-2-Making-a-Simple-Map" data-id="Part-2-Making-a-Simple-Map"><a class="anchor hidden-xs" href="#Part-2-Making-a-Simple-Map" title="Part-2-Making-a-Simple-Map" smoothhashscroll=""></a>Part 2: Making a Simple Map</h2><h3 class="part" data-startline="37" data-endline="37" id="Question-21-Loading-the-data" data-id="Question-21-Loading-the-data"><a class="anchor hidden-xs" href="#Question-21-Loading-the-data" title="Question-21-Loading-the-data" smoothhashscroll=""></a>Question 2.1: Loading the data</h3>Before you start working with the data, take a look at <a href="https://docs.google.com/spreadsheets/d/18eKc_o-eZ8TWno6ePYkcMGKhx-Y2Fe8LEERqV5gClaU/edit#gid=1437433378" target="_blank" rel="noopener">the Providence Business License dataset</a>. The first sheet (inside the file) is the original dataset, and the second sheet is a pruned version with only the columns you’ll need for this lab. Load the pruned sheet into Pyret by pasting the following code into the definitions window:<pre class="part" data-startline="40" data-endline="69" data-position="2714"><code class="include hljs">include shared-gdrive("dcic-2021", "1wyQZj_L0qqV9Ekgr9au6RX2iqt2Ga8Ep") include gdrive-sheets import data-source as ds include shared-gdrive("stencil.arr", "1W61RYJDms4y-1tP_oQ9igydaYr-nmHCr") include image-structs import lists as L ############## # SETUP CODE # ############## ssid = "18eKc_o-eZ8TWno6ePYkcMGKhx-Y2Fe8LEERqV5gClaU" data-sheet = load-spreadsheet(ssid) pvd-businesses = load-table: license-id, name, extended-hours, hotel, parking, restaurant, food-and-liquor, food-dispenser, lat, long source: data-sheet.sheet-by-name("Licenses_Pruned", true) sanitize license-id using ds.string-sanitizer sanitize name using ds.string-sanitizer sanitize extended-hours using ds.bool-sanitizer sanitize hotel using ds.bool-sanitizer sanitize parking using ds.bool-sanitizer sanitize restaurant using ds.bool-sanitizer sanitize food-and-liquor using ds.bool-sanitizer sanitize food-dispenser using ds.bool-sanitizer sanitize lat using ds.num-sanitizer sanitize long using ds.num-sanitizer end </code></pre><h3 class="part" data-startline="71" data-endline="71" id="Question-22-Generate-a-Map" data-id="Question-22-Generate-a-Map"><a class="anchor hidden-xs" href="#Question-22-Generate-a-Map" title="Question-22-Generate-a-Map" smoothhashscroll=""></a>Question 2.2: Generate a Map</h3>We have provided you with a function <code data-position="3856" data-size="33">table-to-map(t :: Table) -> Image</code>, which takes in a table and plots rows as dots on a map of Providence, based on their <code data-position="3978" data-size="3">"x"</code>, <code data-position="3985" data-size="3">"y"</code>, and <code data-position="3996" data-size="7">"color"</code> columns. Treat <code data-position="4023" data-size="12">table-to-map</code> like a built-in function; you can call it just like you called <code data-position="4103" data-size="9">filter-by</code> or any other built-in function in previous labs.To use <code data-position="4172" data-size="12">table-to-map</code> to map the locations of the businesses listed in <code data-position="4236" data-size="14">pvd-businesses</code>, you will need to convert the longitude and latitude values in the table to x- and y-coordinate values. Only locations that fit within the bounds of the Providence map can be included (<code data-position="4438" data-size="12">table-to-map</code> will account for this automatically). We’ve defined the following values for you in the <code data-position="4541" data-size="11">stencil.arr</code> file that the setup code includes:<ul class="part" data-startline="76" data-endline="83"> <li class="" data-startline="76" data-endline="76" data-position="4592" data-size="0"><code data-position="4593" data-size="7">LAT-MIN</code> - the minimum latitude that fits the map</li> <li class="" data-startline="77" data-endline="77" data-position="4645" data-size="0"><code data-position="4646" data-size="7">LAT-MAX</code> - the maximum latitude that fits the map</li> <li class="" data-startline="78" data-endline="78" data-position="4698" data-size="0"><code data-position="4699" data-size="7">LON-MIN</code> - the minimum longitude that fits the map</li> <li class="" data-startline="79" data-endline="79" data-position="4752" data-size="0"><code data-position="4753" data-size="7">LON-MAX</code> - the maximum longitude that fits the map</li> <li class="" data-startline="80" data-endline="80" data-position="4806" data-size="0"><code data-position="4807" data-size="6">HEIGHT</code> - the height of the map</li> <li class="" data-startline="81" data-endline="83" data-position="4841" data-size="0"><code data-position="4842" data-size="5">WIDTH</code> - the width of the map</li> </ul><div class="alert alert-info part" data-startline="84" data-endline="85" data-position="4874" data-size="161"> Try typing <code data-position="4894" data-size="7">LAT-MIN</code> or any of these values in the interactions window, you should see they are predefined values that you can use in your functions. </div>Use these values to write functions that scale latitudes to <code data-position="5102" data-size="1">y</code> values and longitudes to <code data-position="5131" data-size="1">x</code> values relative to the map dimensions. You must proportionally scale the businesses’ (<code data-position="5225" data-size="4">long</code>, <code data-position="5233" data-size="3">lat</code>) coordinates to (<code data-position="5256" data-size="1">x</code>, <code data-position="5261" data-size="1">y</code>) coordinates in order for the rows to be read by the <code data-position="5318" data-size="12">table-to-map</code> function correctly.To make things easier for you, we’ve included scaling formulas!<img src="https://i.imgur.com/or0UFi2.png" alt="" class="" data-position="5419" data-size="36" loading="lazy">TASK: Use these scaling functions to add columns named <code data-position="5518" data-size="1">x</code> and <code data-position="5526" data-size="1">y</code> to the <code data-position="5537" data-size="14">pvd-businesses</code> table with these scaled values.TASK: Add a column labeled <code data-position="5619" data-size="5">color</code> and set each row’s color to “black.” After adding these columns, the computed table can then be used as an input to <code data-position="5743" data-size="12">table-to-map</code>.HINT: Think about whether the output for this column is dependent on each specific row. How can we generate this column using <code data-position="5891" data-size="12">build-column</code>?Complete the tasks and pass the transformed table into <code data-position="5963" data-size="12">table-to-map</code>. The output should look something like this:<img src="https://i.imgur.com/6rfakrA.jpg" alt="" class="" data-position="6023" data-size="36" loading="lazy"><hr><h3 class="part" data-startline="107" data-endline="107" id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point" data-id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point"><a class="anchor hidden-xs" href="#CHECKPOINT-Call-over-a-TA-once-you-reach-this-point" title="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point" smoothhashscroll=""></a>CHECKPOINT: Call over the teacher once you reach this point.</h3><hr><h2 class="part" data-startline="110" data-endline="110" id="Part-3-Analyzing-the-Data" data-id="Part-3-Analyzing-the-Data"><a class="anchor hidden-xs" href="#Part-3-Analyzing-the-Data" title="Part-3-Analyzing-the-Data" smoothhashscroll=""></a>Part 3: Analyzing the Data</h2>Now that you have a map of Providence (albeit not a very pretty one), we need to put it to good use. Your friend Sofia has taken you up on your invitation to visit and has just arrived in Providence. She wants to know what she should do while she’s here!<h3 class="part" data-startline="114" data-endline="114" id="Question-31-Generate-a-tourist-map" data-id="Question-31-Generate-a-tourist-map"><a class="anchor hidden-xs" href="#Question-31-Generate-a-tourist-map" title="Question-31-Generate-a-tourist-map" smoothhashscroll=""></a>Question 3.1: Generate a tourist map</h3>Write a function <code data-position="6478" data-size="142">generate-tourist-map(needs-hotel :: Boolean, has-car :: Boolean, stays-up-late :: Boolean, eats-out :: Boolean, businesses :: Table) -> Image</code> that takes in a series of Booleans and the original <code data-position="6675" data-size="14">pvd-businesses</code> table and returns a map marked with the places that Sofia might want to visit.<ul class="part" data-startline="119" data-endline="123"> <li class="" data-startline="119" data-endline="119" data-position="6773" data-size="0"><code data-position="6774" data-size="11">needs-hotel</code>: If this Boolean is <code data-position="6808" data-size="4">true</code>, Sofia needs a hotel to stay at! Mark all of the inns on the map with a color of your choice.</li> <li class="" data-startline="120" data-endline="120" data-position="6911" data-size="0"><code data-position="6912" data-size="7">has-car</code>: If <code data-position="6926" data-size="4">true</code>, Sofia has decided to drive and will need to find places with parking. Mark all places with parking with a second color.</li> <li class="" data-startline="121" data-endline="121" data-position="7055" data-size="0"><code data-position="7056" data-size="13">stays-up-late</code>: If <code data-position="7076" data-size="4">true</code>, Sofia is ready for a night out! Mark all places with extended hours (Look at the column entitled <code data-position="7181" data-size="14">extended-hours</code>) with a third color.</li> <li class="" data-startline="122" data-endline="123" data-position="7220" data-size="0"><code data-position="7221" data-size="8">eats-out</code>: If <code data-position="7236" data-size="4">true</code>, Sofia has given up on cooking for herself and wants to eat out. Mark all eateries with a fourth color.</li> </ul><div class="alert alert-info part" data-startline="124" data-endline="125" data-position="7347" data-size="153"> Remember that your <code data-position="7375" data-size="20">generate-tourist-map</code> function should take in the original pvd-businesses table, not the modified one made in Part 1. </div>If a place has more than one relevant characteristic, it should be colored according to the characteristic that’s most important to Sofia. Any non-relevant places should be colored black. Starting with the most important characteristic, Sofia cares first about hotels, then eating out, then places that have parking, and lastly, places that stay open late.Depending on the values of the parameters (<code data-position="7910" data-size="11">needs-hotel</code>, <code data-position="7925" data-size="7">has-car</code>, <code data-position="7936" data-size="13">stays-up-late</code>, <code data-position="7953" data-size="8">eats-out</code>), the computed colors for places will be different. Think about how you can accomplish this behavior with a nested function.NOTE: Look at the list of predefined colors in the <a href="https://www.pyret.org/docs/latest/image-structs.html#%28part._image-structs_.Color%29" target="_blank" rel="noopener">Pyret Documentation</a> to see what options you have.<hr><h3 class="part" data-startline="136" data-endline="136" id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point1" data-id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point"><a class="anchor hidden-xs" href="#CHECKPOINT-Call-over-a-TA-once-you-reach-this-point1" title="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point1" smoothhashscroll=""></a>CHECKPOINT: Call over the teacher once you reach this point.</h3><hr><h2 class="part" data-startline="139" data-endline="139" id="Part-4-Games-Games-Games" data-id="Part-4-Games-Games-Games"><a class="anchor hidden-xs" href="#Part-4-Games-Games-Games" title="Part-4-Games-Games-Games" smoothhashscroll=""></a>Part 4: Games Games Games!</h2>It turns out that your game-enthusiast friend Sofia wants nothing more than to buy and play Monopoly. However, before she can buy Monopoly, Sofia would like a doughnut (everyone gets hungry!). Good thing Sofia is a big advocate for local businesses and wants to visit all the local doughnut shops in Providence!How do we distinguish local shops from those in national chains? One way is to find all the doughnut shops and see which ones have names that appear many times in the data—local shops will have fewer entries in the list. A frequency-bar chart would show us this answer visually, but what if we had to compute this information from a list of names of doughnut shops, rather than read it off of a frequency-bar-chart?<h3 class="part" data-startline="144" data-endline="144" id="Question-41" data-id="Question-41"><a class="anchor hidden-xs" href="#Question-41" title="Question-41" smoothhashscroll=""></a>Question 4.1</h3>TASK: Write an expression that gets the list of all donut shops from the original table.<div class="alert alert-info part" data-startline="148" data-endline="149" data-position="9232" data-size="171"> Something to keep in mind: There are two spellings for the tasty dessert of interest: donut and doughnut. Be aware of this when you are looking for businesses. </div>TASK: Based on inspecting the list of donut shops, determine which shops are local or a chain. We’ll consider a doughnut shop to be local if it has no more than 2 locations in the <code data-position="9596" data-size="14">pvd-businesses</code> table.Filter out the chain donut shops to create a list called <code data-position="9678" data-size="10">donuts-lst</code> of names of local doughnut shops.Remember to write out your list of tasks first and use that to guide your work.<h3 class="part" data-startline="159" data-endline="159" id="Question-42" data-id="Question-42"><a class="anchor hidden-xs" href="#Question-42" title="Question-42" smoothhashscroll=""></a>Question 4.2</h3>TASK: Filter the original <code data-position="9861" data-size="14">pvd-businesses</code> table to only include donut shops (both local and chain).TASK: On this filtered table, add a color column where local stores are red and chain stores are black.TASK: Using the <code data-position="10079" data-size="12">table-to-map</code> function and your updated table, create a map that highlights all of the donut shops in their correct colors.<hr><h3 class="part" data-startline="170" data-endline="170" id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point2" data-id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point"><a class="anchor hidden-xs" href="#CHECKPOINT-Call-over-a-TA-once-you-reach-this-point2" title="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point2" smoothhashscroll=""></a>CHECKPOINT: Call over the teacher once you reach this point.</h3><hr><h2 class="part" data-startline="173" data-endline="173" id="Part-5-A-Different-Kind-of-Map" data-id="Part-5-A-Different-Kind-of-Map"><a class="anchor hidden-xs" href="#Part-5-A-Different-Kind-of-Map" title="Part-5-A-Different-Kind-of-Map" smoothhashscroll=""></a>Part 5: A Different Kind of Map</h2>Now that Sofia got her doughnut, she is ready to purchase Monopoly. Unsatisfied with how few stores sell them in Providence, Sofia decides to open her own game store. After conducting a survey of existing options, she’s created a list of the most popular board games. With Monopoly, Sofia can finally have fun!<h3 class="part" data-startline="178" data-endline="178" id="Question-51" data-id="Question-51"><a class="anchor hidden-xs" href="#Question-51" title="Question-51" smoothhashscroll=""></a>Question 5.1</h3>Write a function <code data-position="10660" data-size="57">create-token(token-colors :: List<String>) -> List<Image></code> that takes in a list of strings representing valid colors and produces a list of game tokens of these colors. Each token should have this shape, but with its index-specific color and a yellow star:<img src="https://i.imgur.com/fch3Dxl.png" alt="" class="" data-position="10918" data-size="36" loading="lazy">Each token should also have a randomly generated size, such that its radius is between 15-35 units.HINT: Take a look at the List operations from part 3.1.Discuss why you think lists are being used in this problem as opposed to tables. When would it be preferable to use tables over lists?<h3 class="part" data-startline="191" data-endline="191" id="Question-52" data-id="Question-52"><a class="anchor hidden-xs" href="#Question-52" title="Question-52" smoothhashscroll=""></a>Question 5.2</h3>Sofia has discovered that the ideal token size has a radius within 20-30. She wants to discard all of the token images that are outside of that range and make display signs out of the rest.Write a function <code data-position="11485" data-size="64">generate-token-signs(token-images :: List<Image>) -> List<Image></code> that takes in the output list from <code data-position="11587" data-size="12">create-token</code>. This function should remove all of the tokens that lie outside of the size range and put the remaining token on square backgrounds. This is what an output list item should look like:<img src="https://i.imgur.com/tLx0v0H.png" alt="" class="" data-position="11786" data-size="36" loading="lazy">HINT: look at the <code data-position="11850" data-size="11">image-width</code> function in the documentation when making the function<hr><h3 class="part" data-startline="204" data-endline="204" id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point3" data-id="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point"><a class="anchor hidden-xs" href="#CHECKPOINT-Call-over-a-TA-once-you-reach-this-point3" title="CHECKPOINT-Call-over-a-TA-once-you-reach-this-point3" smoothhashscroll=""></a>CHECKPOINT: Call over the teacher once you reach this point.</h3><hr><h2 class="part" data-startline="207" data-endline="207" id="Success" data-id="Success"><a class="anchor hidden-xs" href="#Success" title="Success" smoothhashscroll=""></a>Success!</h2>Sofia finally bought her new token! Hooray! As a gift, she has provided you with a $5 gift card for her game store! Business at Sofia’s store is booming, all thanks to you.<hr><blockquote class="part" data-startline="214" data-endline="215"> </blockquote>