DynamicD3: Datan visualisointi D3.js:n avulla

DynamicD3

Sankey-kaaviot

Sankey-diagrammit ovat datan visualisointeja, joita käytetään näyttämään prosessien läpi kulkeva virtaus. Yllä oleva esimerkki on yksinkertainen, mutta niitä voidaan käyttää myös paljon monimutkaisempiin prosesseihin, kuten monia vaiheita sisältäviin teollisuusprosesseihin. D3.js soveltuu erityisen hyvin Sankey-diagrammien luomiseen, ja se mahdollistaa paljon mukauttamista.

Yksi erityisen hyvin toimiva alue on energiavirta: Sankey-tietovisualisointeja on käytetty esimerkiksi havainnollistamaan öljyn tuotantoa sen alkuperämaasta alkaen, miten se kuljetetaan, missä se jalostetaan ja missä se lopulta kulutetaan.

Sankey-kaavioita voidaan käyttää myös havainnollistamaan, miten materiaaleja syntyy ja kierrätetään. Tärkeä periaate, joka joskus vaikeuttaa niiden käyttöä tämäntyyppisissä tietovisualisoinneissa, on kuitenkin se, että D3.js edellyttää, että prosessin kuhunkin osaan tuleva virtaus on yhtä suuri kuin prosessista lähtevä virtaus. Kunkin solmun korkeuden on myös oltava yhtä suuri kuin siihen sisään ja sieltä ulos virtaavien virtojen (toisin sanoen viivojen) paksuuksien summa. Nämä rajoitukset on mahdollista kiertää ja luoda Sankey-diagrammeja, joissa on palautesilmukoita, mutta tämä vaatii mukautettua ohjelmointia tai D3.js:n vakiomuotoisen Sankey-kirjaston haarautumista.

Toinen suosittu Sankey-kaavion käyttötapa on osoittaa yrityksen kassavirta. Tässä tapauksessa solmujen ja viivojen värejä ja sijainteja on siirrettävä siten, että samankaltaiset virrat (esimerkiksi ne, joilla on positiivinen vaikutus tulokseen) ovat samanvärisiä (esim. vihreitä), kun taas ne, joilla on negatiivinen vaikutus, ovat toisenvärisiä, yleensä punaisia. Solmut ja viivat on myös sijoitettava toisiinsa niin, että diagrammi on hyvin järjestetty. Tällaisia Sankey-datanäkymiä voidaan luoda D3.js:llä, mutta nämä sijainnit on koodattava mukautetusti. On tärkeää pitää mielessä edellä mainittu ehto: virtauksen kuhunkin solmuun on vastattava virtausta kyseisestä solmusta ulos. Tämä edellyttää jonkin verran taloudellisten tietojen ymmärtämistä, jotta Sankey-diagrammissa on järkeä.

D3.js:llä luodun Sankey-tiedon visualisoinnin kustannukset riippuvat suuresti siitä, missä määrin se on koodattava mukautetusti. Lisäosat, kuten työkaluvihjeet, mukautetut animaatiot ja niin edelleen, lisäävät kustannuksia hieman, mutta parantavat käyttäjäkokemusta huomattavasti. Hinnat -sivulta saat yleiskuvan. Ota kuitenkin yhteyttä meihin, jotta voimme keskustella ilmaiseksi kehittäjän kanssa ja selvittää, mikä on sinulle parasta.

Tämä osoittaa pakolaisten virran lähtömaasta määränpäänä olevaan osavaltioon Yhdysvalloissa.

Tietyn vuoden aikana muuttaneiden henkilöiden määrä näkyy linkin paksuudella sekä solmun korkeudella ja värillä.