mbergevoet / frontend-data

Learning Frontend Data Tech Track CMD 2020/2021

Research Case & Concept

Question: How close to the city centre can you park in different cities?

Sub-questions

• Does it affect the parking rate the closer you can park it is?
• How high or low are the parking rates?
• What is 'close' to the city centre exactly?
• What citties/towns will I be looking at?
• Where in a city/town will I be looking?
• How do I get the coordinates?

Assumptions
I think in smaller cities it is possible to park closer to the city centre than in larger citties. I suspect parking rates in bigger cities and townships will be higher. This might be because they want to minimize the amount of cars in the city. And I assume the closer to the city centre you park your care the higher the rates will be. This is probably done to give pedestrians, cyclists and tourists in more space in crowded or shopping area's. That way they want to keep cars out to make it more safe.

Datasets & Variables
The datasets I will be using to answer this question are Open Data Parkeren: GEOMETRIE GEBIED and Open Data Parkeren: TARIEFDEEL. I want to make two seperate visualisations with these datasets. One to show carparks close to city centres and one bar chart to see what car parks are the most/least expensive. Thanks to Stan I knew there are coordinates inside the GEOMETRIE GEBIED dataset which I will use to plot the dots on a map of the Netherlands.
From GEOMETRIE GEBIED I will use String areageometryastext to get the coordinates and transform them into separate properties. It now contains points or polygons with coordinates and all I have to do is getting one value out of it.
From TARIEFDEEL I will use int amountfarepart int stepsizefarepart to calculate the parking fares using a calculation Sam and Victor pointed out ("If AmountFarePart is 5,0 and stepSizeFarePart is 720 you pay 5EU for 720 minutes which means 5EU per 12 hours = 0,41eu per hour").

Empty entries
For entries that don't contain any data I'm using a bit of code demonstrated by Laurens. Click here to see it.

Sketches

Version 1.0

Version 2.0

Interesting functional patterns

• funtional pattern one
• funtional pattern two

Update pattern

• update pattern

Link to visualisation

Map of carparks in the Netherlands

Installation

Clone this repository

git clone https://github.com/mbergevoet/frontend-data

Sources

• Converting latitude and longitude to decimal values. (2009, July 16). Retrieved October 2020, from https://stackoverflow.com/questions/1140189/converting-latitude-and-longitude-to-decimal-values
• How to check if a string contains a number in JavaScript? (2014, February 28). Retrieved October 2020, from https://stackoverflow.com/questions/22100243/how-to-check-if-a-string-contains-a-number-in-javascript/36077900
• RGB to hex and hex to RGB. (2011, April 11). Retrieved October 2020, from https://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb
• Robb, J. (2020, February 27). Principles of Functional Programming. Retrieved 10 November 2020, from https://dev.to/jamesrweb/principles-of-functional-programming-4b7c
• String.prototype.padStart(). (2020, April 6). Retrieved October 2020, from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
• String.prototype.split(). (2020, September 1). Retrieved November 2020, from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split

License

This repository uses MIT license. © Merlijn Bergevoet 2020

frontend-data's Issues

Peer-Feedback Frontend Data

Repository

Er ontbreekt nog een hoop in de ReadME. Wat ik persoonlijk fijn vind is een korte omschrijving van iets, en als het te lang wordt (oftewel het hele beeld opvult), gooi een verwijzing naar je wiki. Hiermee voorkom je dat je ReadME een groot boekwerk wordt, waar het eigenlijk niet voor geschikt is.

• .gitignore ontbreekt, is alles wat nu in de repository staat, ook geschikt om publiekelijk op het internet te zetten? Ook kan je repository onnodig groot worden. Als je een API hebt binnen gesleept en deze bijvoorbeeld in een json zet, is het niet noodzakelijk om deze op Github te zetten.
• Geen link naar live demo, gebruik GitHub Pages of Netlify hiervoor.
• Omschrijving is kort, wat leer je bij Frontend-data Tech Track CMD?
• Concept is duidelijk aan de hand van een hoofdvraag en subvragen. Misschien een goed idee om het in de ReadME kort en krachtig te omschrijven, en verder te linken naar een pagina in je wiki.
• Je laat goed images zien van hoe het er uit ziet, enkel gaat het hier om schetsen. Zorg er voor dat je je eindproduct laat zien in je ReadME en je schetsen in de wiki, als proces.
• Welk voorbeeld heb je gebruikt of waar is je code op gebaseerd? Omschrijf welke bronnen je hiervoor gebruikt hebt.
• Welke dataset heb je gebruikt? Ik zie een omschrijving, maar vergeet er niet naar te linken [text](www.link.com). Dan kan de bezoeker meteen kijken om welke dataset het gaat en is die ook eventueel makkelijk te bereiken als je zelf de link kwijt bent.
• Wat heb je gedaan met waardes die undefined zijn

Wiki

Je bent goed op weg met je wiki, maar er missen wel wat dingen. Laat vooral codevoorbeelden zien, aangezien er meer naar het proces wordt gekeken is dit een belangrijk punt.

• Wat betekend V1, V2 en V3, heb je verschillende versies gemaakt ? Misschien is het dan logischer om het als proces kort te omschrijven. Dat je laat zien dat je eerst dit had , en het hebt omgezet hiernaar omdat [noem redenen].
• Er ontbreekt een voorbeeld waarbij je laat zien hoe de opgeschoonde en getransformeerde data er uit ziet
• De gehele dataflow moet nog omschreven worden, behandel hier de .enter(), .merge() (update) en exit() pattern.
• Er is kort omschreven wat je proces is van D3. Omschrijf dit ook met code voorbeelden. Hoe heb je het eerst gemaakt en hoe is het nu?

Demo

Vergeet geen demo! Anders is het niet te zien wat je gemaakt hebt.

• De live demo ontbreekt, hierdoor kan ik niet zien hoe de visualisaties er uit zien. Let er vooral op dat je de labels, assen, en titels niet vergeet te omschrijven.
• Interactie is ook niet zichtbaar.