Opschonen en opslaan van de RDWData

Nadat ik de data had verzameld kon ik aan de slag met de benodigde data verzamelen om mijn concept te kunnen visualiseren.

Opschonen

Ik begon met het ophalen van alleen de data die ik kon gebruiken. Hiervoor maakte ik een functie genaamd filterUnknown. Hier gaf ik een array terug die alleen maar ingevulde waardes hadden.

const filterUnknown = function(parkingGarages){
   return parkingGarages.filter(garage => garage.location && garage.capacity)
}

Later besloot ik om alleen op location te controleren. Capacity null is namelijk ook te gebruiken bij berekeningen.

const filterUnknown = function(parkingGarages){
   return parkingGarages.filter(garage => garage.location)
}

Uiteindelijk koos ik er toch voor om alle data wel mee te nemen in mijn visualisatie. Ik heb er uiteindelijk voor gekozen om het gemiddelde uit te rekenen van de capaciteit en die op te slaan op de parkeergarages die geen capaciteit waarde hebben. Dit deed ik door eerst in een aparte function het gemiddelde uit te rekenen:

const getAverageCapacity = function(parkingGarages){
  const sumOfCapacity = getSumOfCapacity(parkingGarages)
  return sumOfCapacity / parkingGarages.length
}

En vervolgens die functie aan te roepen in de filter functie:

const filterUnknown = function(parkingGarages){
   const averageCapacity = Math.round(getAverageCapacity(parkingGarages))
   console.log(averageCapacity)
   return parkingGarages.map(garage => {
     if(!garage.location || garage.location === ""){
       garage.location = 'ONBEKEND'
     }

     if(!garage.capacity){
       garage.capacity = averageCapacity
     }
     return garage
   })
}

Zoals te zien is in de code hierboven sla ik de onbekende locatie ook op als een string 'ONBEKEND'.

Vervolgens maak ik een array met alle provincies waar ik overheen wil gaan lopen. Op het eind is hier 'onbekend' ook bijgekomen

const provinces = ['groningen', 'friesland', 'overijssel', 'drenthe', 'gelderland', 'limburg', 'noord-brabant', 'zuid-holland', 'noord-holland', 'zeeland', 'utrecht', 'flevoland', 'onbekend']

Die array gebruik ik om alle data op te slaan in een aparte array's per provincie. Dit doe ik door verschillende functies te chainen:

const parkingOverviewRequest = d3.json(parkingSpecsURL)
  .then(parkingOverview => {
    const parkingOverviewFiltered = filterUnknown(parkingOverview)
    const capacityPerLocationCollection = provinces.map(province => {
      const capacityPerLocation = getCapacityPerLocation(parkingOverviewFiltered, province)
      console.log('location', capacityPerLocation)
      const sumOfGarages = getSumOfGarages(capacityPerLocation)
      const sumOfDisabledGarages = getSumOfDisabledGarages(capacityPerLocation)
      const sumOfCapacity = getSumOfCapacity(capacityPerLocation)
      const sumOfDisabledCapacity = getSumOfDisabledCapacity(capacityPerLocation)
      const percentageDisabledCapacity = getPercentage(sumOfCapacity, sumOfDisabledCapacity)
      return {
        province: province,
        totalAmountGarages: sumOfGarages,
        totalAMountDisabledGarages: sumOfDisabledGarages,
        totalCapacity: sumOfCapacity,
        totalDisabledCapacity: sumOfDisabledCapacity,
        totalNotDisabledCapacity: (sumOfCapacity - sumOfDisabledCapacity),
        percentageAvailible: percentageDisabledCapacity,
        percentageNotAvailible: (100 - percentageDisabledCapacity)
      }
    })
    data = capacityPerLocationCollection
    createDiagram()
  })

Ik maak eerst allerlei variablen waarin ik functies chain om de resultaten te berekenen. Die functies gebruiken voornamelijk allerlei higher order functions zoals map, filter en reduce. Mocht u precies willen zien hoe ik dat heb gedaan kunt u dat bekijken in mijn repository Vervolgens maak ik een object aan waar ik verschillende berekende gegevens in opsla.

Wanneer het object volledig is gedefinieerd, sla ik het object op in de algemene data variable en voer ik de functie uit om de diagram te gaan visualiseren