31:T688,Today's challenge is to make a map in 5 minutes. Yesterday, I came across [this article](https://perfectunion.us/map-where-are-starbucks-workers-unionizing/) on Starbucks locations that have had union efforts of some type. I care about this because Starbucks closed the location in Portland, Maine after works there voted to unionize. I'm not crazy about unions since they tend to get as corrupt as corporations _(don't @ me; it's true)_, but what Starbucks did officially puts them in the "evil" box (more so than they had already been). Since that site had a map and I'm a curious person, I poked through the Developer Tools "Network" tab and saw it had a [lovely JSON file](https://perfectunion.us/wp-json/wpgmza/v1/features/base64eJyrVkrLzClJLVKyUqqOUcpNLIjPTIlRsopRMoxR0gEJFGeUFni6FAPFomOBAsmlxSX5uW6ZqTkpELFapVoABU0Wug), so I had saved that off and went about the rest of my day. Today, Just before I fired up a new Observable notebook to make this catch-up challenge (I'm rly behind) I decided to just [riff from of the OpenStreetMap entry from the other day's challenge](https://observablehq.com/@hrbrmstr/2022-30-day-map-challenge-day-06-network-central-maine-power?collection=@hrbrmstr/2022-30-day-map-challenge) and use the saved off strike JSON for today's data. Being able to `import` saved a bit of typing time. The first map (below) is what was left after **4m 57s**. Some of the time was spent figuring out the JSON format and (daftly) downloading the Starbucks Workers' Union icons. I figured it'd be kind of ugly and it is, but it's a 5-minute map! Scroll down for an 11-minute version (that time includes the code that helped make the data table).32:[{"id":"471b864af3658137f07bdff9317e17daf7966acbd53209a3a9c113b7fec136fb282d179194bdf51dbbfe6fd378e893109a9367594e19fabcde70a0e10c0c97a4","href":"https://static.observableusercontent.com/files/471b864af3658137f07bdff9317e17daf7966acbd53209a3a9c113b7fec136fb282d179194bdf51dbbfe6fd378e893109a9367594e19fabcde70a0e10c0c97a4","name":"sbwu-logo-small.png","type":"image/png","lastModified":1668761289920.826,"size":7276},{"id":"95ac31be322fea3f53466167a8323b1ed64958d87995b444992cd46d1dca88d89896864d1961912e6312d566e865b6d23ec183866a3c055f2e009244142953a6","href":"https://static.observableusercontent.com/files/95ac31be322fea3f53466167a8323b1ed64958d87995b444992cd46d1dca88d89896864d1961912e6312d566e865b6d23ec183866a3c055f2e009244142953a6","name":"starbucks-union.json","type":"application/json","lastModified":1668761290130.167,"size":908354}] 2f:{"title":"2022 30-day Map Challenge • Day 13 • 5-Minute Map • Starbucks Workers United","cells":[{"id":0,"value":"md`# 2022 30-day Map Challenge • Day 13 • 5-Minute Map • ![](${sbwuLogoSmall}) Starbucks Workers United`","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"$31","pinned":false,"hidden":false,"mode":"md"},{"id":21,"value":"sb_unions_5m = {\n const container = DOM.element(\"div\", {\n style: `width:${width}px;height:${width / 1.5}px`\n });\n yield container;\n\n const map = L.map(container).setView([40, -95], 4);\n const osmLayer = L.tileLayer(\n \"https://stamen-tiles-{s}.a.ssl.fastly.net/\" +\n `terrain` +\n \"/{z}/{x}/{y}{r}.{ext}\",\n {\n attribution:\n 'Map tiles by Stamen Design, CC BY 3.0 — Map data © OpenStreetMap contributors',\n subdomains: \"abcd\",\n minZoom: 0,\n maxZoom: 20,\n ext: \"png\"\n }\n ).addTo(map);\n\n for (var i = 0; i < starbucksUnion.markers.length; i++) {\n const marker = new L.marker([\n starbucksUnion.markers[i].lat,\n starbucksUnion.markers[i].lng\n ])\n .bindPopup(starbucksUnion.markers[i].address)\n .addTo(map);\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":118,"value":"This is (mostly) what I had in mind to make: icon markers on a Leaflet map with all available location and union info. It's a tad nicer than the 5-minute version, and since I need to get other entries in, this is where it'll stay.","pinned":false,"hidden":false,"mode":"md"},{"id":44,"value":"sb_unions = {\n const container = DOM.element(\"div\", {\n style: `width:${width}px;height:${width / 1.5}px`\n });\n yield container;\n\n const map = L.map(container).setView([40, -95], 4);\n const osmLayer = L.tileLayer(\n \"http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\",\n {\n attribution:\n '© OpenStreetMap Contributors',\n maxZoom: 18\n }\n ).addTo(map);\n\n for (var i = 0; i < starbucksUnion.markers.length; i++) {\n const cfd = starbucksUnion.markers[i].custom_field_data\n .map((d) => `${d.name}: ${d.value}`)\n .join(\"\\n
\");\n\n const marker = new L.marker(\n [starbucksUnion.markers[i].lat, starbucksUnion.markers[i].lng],\n { icon: sbwuIcon }\n )\n .bindPopup(cfd)\n .addTo(map);\n }\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":75,"value":"sbu4table","pinned":true,"hidden":false,"mode":"ojs"},{"id":77,"value":"sbu4table = starbucksUnion.markers.map((d) => ({\n title: d.title,\n address: d.address,\n status: d.custom_field_data[1].value,\n vote_results: d.custom_field_data[2].value\n // vote_count: d.custom_field_data[3].value\n}))","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"starbucksUnion = FileAttachment(\"starbucks-union.json\").json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":52,"value":"sbwuIcon = new Icon({ iconUrl: sbwuLogoSmall })","pinned":false,"hidden":false,"mode":"ojs"},{"id":34,"value":"Icon = L.Icon.extend({\n options: {\n iconSize: [32, 32],\n shadowSize: [50, 64],\n iconAnchor: [16, 16],\n shadowAnchor: [4, 62],\n popupAnchor: [-3, -76]\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"sbwuLogoSmall = FileAttachment(\"sbwu-logo-small.png\").url()","pinned":false,"hidden":false,"mode":"ojs"},{"id":12,"value":"starbucksGreen = \"#396540\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":134,"value":"style","pinned":true,"hidden":false,"mode":"ojs"},{"id":19,"value":"import {\n L,\n style\n} from \"@hrbrmstr/2022-30-day-map-challenge-day-06-network-central-maine-power\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W32","stdlib":"1","titling":"auto"}