Week 3

Maandag 6 Nov: Waarom D3

Met de start van week 3 zijn we op het middenpunt van onze project en zijn we begonnen met hoe we te werk gaat met D3.

D3.js is een JavaScript-bibliotheek voor het manipuleren van op gegevens gebaseerde Data. D3 maakt het mogelijk om gegevens tot leven te brengen met HTML, SVG en CSS.

D3 Bar Chart + text labels

Hierbij de uitgewerkte versie van het D3 staafdiagram met tekstlabels. Eerder lukte het me niet om de grafiek werkend te krijgen, dus heb ik de uitgewerkte versie uit de les gebruikt om verder te oefenen.

Er zijn twee soorten waarden:

• Continue waarden: Dit is als iets meten met een liniaal. De waarde kan elk getal zijn tussen 0 en 100 zijn.

• Discrete waarden: Dit is hetzelfde als iets sorteren in verschillende bakken of mappen. Een waarde zit in de ene of de andere rij. Je waarden kunnen bijvoorbeeld dagen van de week zijn en geen halve dagen.

Tijdens de les werd ons uitgelegd over 3 verschillende types van scale van D3 en hoe en wanneer ze gebruik kunnen worden.

• Continuous -> Continuous Dit type schaal zet een doorlopende getallenreeks om in een andere doorlopende rij. Deze schaal wordt vaak gebruikt in situaties waarin de gegevens en de visuele weergave vloeiend zijn en geen vaste stappen bevatten.

• Continuous -> Discrete Deze schaal neemt een doorlopende rij getallen en verdeelt ze in verschillende, afzonderlijke categorieën.

• Discrete -> Discrete Bij dit type schaal heb je een beperkte rij gegevens die je toewijst aan een andere rij specifieke outputwaarden.

Woensdag 8 Nov: Scale in D3

Vandaag hebben we geleerd over Axes en Ticks. Met Axes en Ticks kun je de schaal en categorieën van je gegevens in een staafdiagram duidelijk aangeven. Ze helpen bij het lezen en interpreteren van de gegevens door markeringen en waarden langs de assen weer te geven.

Deze grafiek is heb ik van de pagina horizontale staafdiagram in d3.js, die ik nu aan het testen ben. Later zal ik hem aanpassen aan de gegevens die ik wil laten zien.