DynamicD3: Adatvizualizáció a D3.js használatával

DynamicD3

Sávdiagramok

Ez a Stacked Bar Chart egy D3.js és MUI segítségével létrehozott adatvizualizáció. Egy amerikai kórházban végzett műtétek számát mutatja az érintett szerv szerint kategorizálva. Az "All Three" (Mindhárom) rádiógomb kiválasztásakor a felhasználók a legenda segítségével összehasonlíthatják az egyes években végzett műtétek teljes számát. Az egyes értékeket azonban nehezebb összehasonlítani egyik évről a másikra, mivel a megfelelő sávok nem állnak egy vonalban. Ezért hozzáadtuk azt a lehetőséget, hogy a három szerv közül bármelyiket önmagában is ki lehessen választani. Így sokkal könnyebb egyetlen adathalmazra összpontosítani és összehasonlítani az értékeket.

A D3.js segítségével többféle, több adatot tartalmazó oszlopdiagramok hozhatók létre: például az értékek egymásra helyezése helyett egymás mellett is lehetnek. Ez megkönnyíti az azonos adatkészleten belüli értékek összehasonlítását, de megnehezíti az összértékek összehasonlítását.

A változó szélességű oszlopdiagramok, amelyeket néha változó szélességű oszlopdiagramoknak is neveznek, olyan oszlopdiagramok, amelyek nem egyenletes szélességű oszlopokkal rendelkeznek. Például úgy mutathatjuk be a különböző országok GDP-jét, hogy a sávok magassága az egy főre jutó GDP-t, a sáv szélessége pedig a népességet jelöli. A terület ezután a teljes GDP-t jelentené.

A diagram tartalmaz egy adatrácsot is a könnyű adatbevitel érdekében. A D3.js adatvizualizációk adatai helyi JSON vagy CSV fájlban lehetnek. Ha azonban gyakran változik, vagy nem képzett személyzetnek kell frissítenie, az adattábla kényelmesebb. Ez nagyjából úgy működik, mint egy Excel-táblázat, sorokkal és oszlopokkal az adatok számára. Az adatok jellemzően egy külső adatbázishoz kapcsolódnak, amelyet mi állíthatunk be Önnek: ennek további előnye, hogy az adatok könnyen és biztonságosan menthetők. További részletekért lásd Add Ons és Árak a költségekről szóló információkért.

Egy oszlopdiagram költségei nagyban függnek attól, hogy az adatvizualizációt közvetlenül a D3.js-ben lehet-e létrehozni, vagy egyéni kódolásra van szükség. Az olyan kiegészítők, mint az eszköztippek, az egyéni animációk és így tovább, egy kicsit növelik a költségeket, de nagyban javítják a felhasználói élményt. A Árak oldal általános képet nyújt. Kérjük azonban, lépjen kapcsolatba velünk egy ingyenes megbeszélésért egy fejlesztővel, hogy kitaláljuk, mi a legjobb az Ön számára.


Az oldal frissítése az adatok frissítéséhez.