DynamicD3: Datavisualisatie met D3.js

DynamicD3

Staafdiagrammen

Deze Stacked Bar Chart is een datavisualisatie gemaakt met D3.js en MUI. De staafdiagram toont het aantal operaties in een ziekenhuis in de VS, ingedeeld naar het betreffende orgaan. Als het keuzerondje 'Alle drie' is geselecteerd, kunnen gebruikers het totale aantal operaties in elk jaar vergelijken met behulp van de legenda. Het is echter moeilijker om individuele waarden van het ene jaar met het andere te vergelijken, omdat de corresponderende balken niet op één lijn liggen. Daarom hebben we de optie toegevoegd om een van de drie organen afzonderlijk te selecteren. Dit maakt het veel gemakkelijker om je te concentreren op een enkele gegevensverzameling en de waarden te vergelijken.

Het is mogelijk om verschillende staafdiagrammen met meerdere gegevens te maken met D3.js: in plaats van de waarden op elkaar te stapelen, kunnen ze bijvoorbeeld naast elkaar staan. Dit maakt het gemakkelijker om waarden binnen dezelfde gegevensset te vergelijken, maar maakt het moeilijker om de totale waarden te vergelijken.

Staafdiagrammen met een variabele breedte, ook wel variwide staafdiagrammen genoemd, zijn staafdiagrammen met staven met een niet-uniforme breedte. We kunnen bijvoorbeeld het BBP van verschillende landen weergeven door de hoogte van de staven te gebruiken om het BBP per hoofd van de bevolking weer te geven en de breedte van de staaf om de bevolking weer te geven. De oppervlakte stelt dan het totale BBP voor.

De grafiek bevat ook een gegevensraster voor eenvoudige gegevensinvoer. Gegevens voor D3.js datavisualisaties kunnen in een lokaal JSON- of CSV-bestand staan. Als de gegevens echter vaak veranderen, of moeten worden bijgewerkt door ongetraind personeel, is een gegevensraster handiger. Dit werkt ongeveer zoals een Excel-spreadsheet, met rijen en kolommen voor de gegevens. De gegevens zijn meestal gekoppeld aan een externe database die we voor je kunnen opzetten: een bijkomend voordeel hiervan is dat je gemakkelijk een veilige back-up van je gegevens kunt maken. Zie Toevoegingen voor meer informatie en Prijzen voor informatie over de kosten.

De kosten van een staafdiagram hangen sterk af van de mate waarin de datavisualisatie direct in D3.js kan worden gemaakt of op maat moet worden gecodeerd. Toevoegingen zoals tool-tips, aangepaste animaties enzovoort zullen de kosten iets verhogen, maar de gebruikerservaring sterk verbeteren. De Prijzen pagina geeft je een algemeen idee. Neem echter contact met ons op voor een gratis gesprek met een ontwikkelaar om uit te zoeken wat voor u het beste is.


Pagina verversen om gegevens bij te werken.