12 KiB

Raw Permalink Blame History Unescape Escape

Merkityksellisten visualisointien luominen


Merkitykselliset visualisoinnit - Sketchnote by @nitya

"Jos kidutat dataa tarpeeksi kauan, se tunnustaa mitä tahansa" -- Ronald Coase

Yksi datatieteilijän perustaidoista on kyky luoda merkityksellinen datavisualisointi, joka auttaa vastaamaan kysymyksiin. Ennen datan visualisointia on varmistettava, että data on puhdistettu ja valmisteltu, kuten teit aiemmissa oppitunneissa. Tämän jälkeen voit alkaa päättää, miten data esitetään parhaiten.

Tässä oppitunnissa käsitellään:

Kuinka valita oikea kaaviotyyppi
Kuinka välttää harhaanjohtavia kaavioita
Kuinka käyttää värejä oikein
Kuinka muotoilla kaaviot luettavuuden parantamiseksi
Kuinka rakentaa animoituja tai 3D-kaavioita
Kuinka luoda luovia visualisointeja

Esiluentakysely

Valitse oikea kaaviotyyppi

Aiemmissa oppitunneissa kokeilit erilaisten datavisualisointien rakentamista Matplotlibin ja Seabornin avulla. Yleisesti ottaen voit valita oikeanlaisen kaavion kysymyksesi perusteella seuraavan taulukon avulla:

Tarve:	Käytä:
Näytä datan trendit ajan myötä	Viivakaavio
Vertaile kategorioita	Pylväskaavio, piirakkakaavio
Vertaile kokonaismääriä	Piirakkakaavio, pinottu pylväskaavio
Näytä suhteita	Hajontakaavio, viivakaavio, facet, kaksoisviiva
Näytä jakaumia	Hajontakaavio, histogrammi, laatikkokaavio
Näytä osuuksia	Piirakkakaavio, donitsikaavio, vohvelikaavio

✅ Riippuen datasi rakenteesta, saatat joutua muuntamaan sen tekstistä numeeriseksi, jotta kaavio tukee sitä.

Vältä harhaanjohtavuutta

Vaikka datatieteilijä valitsisi oikean kaavion oikealle datalle, on monia tapoja esittää dataa harhaanjohtavasti, usein datan kustannuksella. Harhaanjohtavia kaavioita ja infografiikoita on paljon!

🎥 Klikkaa yllä olevaa kuvaa nähdäksesi konferenssipuheen harhaanjohtavista kaavioista

Tässä kaaviossa X-akseli on käännetty, jotta totuus näyttäisi päinvastaiselta päivämäärien perusteella:

Tämä kaavio on vielä harhaanjohtavampi, sillä katsojan huomio kiinnittyy oikealle, jolloin syntyy vaikutelma, että COVID-tapaukset ovat vähentyneet eri maakunnissa. Tarkemmin katsottuna päivämäärät on kuitenkin järjestetty uudelleen, jotta saadaan aikaan harhaanjohtava laskeva trendi.

Tämä tunnettu esimerkki käyttää värejä JA käännettyä Y-akselia harhauttaakseen: sen sijaan, että asekuolemat olisivat lisääntyneet aselainsäädännön muutosten jälkeen, katsoja saadaan uskomaan päinvastaista:

Tämä outo kaavio näyttää, kuinka mittasuhteita voidaan manipuloida huvittavin seurauksin:

Vertailu, joka ei ole vertailukelpoista, on toinen kyseenalainen temppu. On olemassa mahtava verkkosivusto, joka esittelee "näennäisiä korrelaatioita", kuten Mainen avioeroprosentin ja margariinin kulutuksen välisiä "faktoja". Redditissä on myös ryhmä, joka kerää huonoja datan käyttötapoja.

On tärkeää ymmärtää, kuinka helposti silmä voi tulla harhaanjohdetuksi huonoilla kaavioilla. Vaikka datatieteilijän tarkoitus olisi hyvä, huonon kaaviotyypin, kuten liian monia kategorioita sisältävän piirakkakaavion, valinta voi olla harhaanjohtavaa.

Värit

Yllä olevassa "Floridan aserikollisuus" -kaaviossa näit, kuinka värit voivat tuoda lisämerkityksen kaavioihin, erityisesti sellaisiin, joita ei ole suunniteltu käyttämällä esimerkiksi ggplot2- tai RColorBrewer-kirjastoja, jotka sisältävät valmiiksi testattuja värikirjastoja ja -paletteja. Jos teet kaavion käsin, tutustu hieman väriteoriaan.

✅ Ole tietoinen, että saavutettavuus on tärkeä osa visualisointia. Jotkut käyttäjistäsi saattavat olla värisokeita – näkyykö kaaviosi hyvin myös näkövammaisille käyttäjille?

Ole varovainen valitessasi värejä kaavioosi, sillä värit voivat välittää merkityksiä, joita et ehkä tarkoittanut. Esimerkiksi yllä olevan "pinkit naiset" -kaavion värit antavat kaaviolle selvästi "feminiinisen" merkityksen, mikä lisää sen outoutta.

Vaikka värien merkitys voi vaihdella eri puolilla maailmaa ja muuttua sävyn mukaan, yleisesti ottaen värit merkitsevät seuraavaa:

Väri	Merkitys
punainen	voima
sininen	luottamus, uskollisuus
keltainen	ilo, varovaisuus
vihreä	ekologia, onni, kateus
violetti	ilo
oranssi	eloisuus

Jos sinua pyydetään rakentamaan kaavio mukautetuilla väreillä, varmista, että kaaviosi ovat sekä saavutettavia että valitsemasi värit vastaavat haluamaasi merkitystä.

Kaavioiden muotoilu luettavuuden parantamiseksi

Kaaviot eivät ole merkityksellisiä, jos ne eivät ole luettavia! Käytä hetki kaavion leveyden ja korkeuden muotoiluun, jotta se skaalautuu hyvin datasi kanssa. Jos yksi muuttuja (kuten kaikki 50 osavaltiota) täytyy näyttää, esitä ne pystysuunnassa Y-akselilla, jos mahdollista, jotta vältät vaakasuunnassa vieritettävän kaavion.

Merkitse akselit, lisää selite tarvittaessa ja tarjoa työkaluja datan parempaan ymmärtämiseen.

Jos datasi on tekstuaalista ja X-akselilla on paljon tekstiä, voit kallistaa tekstiä luettavuuden parantamiseksi. plot3D tarjoaa 3D-plottausta, jos datasi tukee sitä. Sen avulla voidaan tuottaa hienostuneita datavisualisointeja.

Animaatio ja 3D-kaavioiden näyttäminen

Jotkut parhaista datavisualisoinneista nykyään ovat animoituja. Shirley Wu on tehnyt upeita visualisointeja D3:lla, kuten 'film flowers', jossa jokainen kukka on elokuvan visualisointi. Toinen esimerkki Guardianille on 'bussed out', interaktiivinen kokemus, joka yhdistää visualisointeja Greensockin ja D3:n avulla sekä artikkelin, joka kertoo, kuinka NYC käsittelee kodittomien ongelmaa lähettämällä ihmisiä pois kaupungista.

"Bussed Out: How America Moves its Homeless" Guardianista. Visualisoinnit: Nadieh Bremer & Shirley Wu

Vaikka tämä oppitunti ei riitä opettamaan näitä tehokkaita visualisointikirjastoja syvällisesti, kokeile D3:ta Vue.js-sovelluksessa käyttämällä kirjastoa, joka näyttää visualisoinnin kirjasta "Dangerous Liaisons" animoituna sosiaalisena verkostona.

"Les Liaisons Dangereuses" on kirjeromaanimuotoinen teos, joka koostuu kirjeistä. Choderlos de Laclos kirjoitti sen vuonna 1782, ja se kertoo kahden moraalittoman ranskalaisen aristokraatin, Vicomte de Valmontin ja Marquise de Merteuilin, juonittelusta. Molemmat kohtaavat lopulta tuhon, mutta eivät ennen kuin aiheuttavat suurta sosiaalista vahinkoa. Kirjeiden avulla voit visualisoida tarinan keskeiset hahmot visuaalisesti.

Toteutat verkkosovelluksen, joka näyttää animoidun näkymän tästä sosiaalisesta verkostosta. Se käyttää kirjastoa, joka on rakennettu verkoston visualisointiin Vue.js:n ja D3:n avulla. Kun sovellus on käynnissä, voit siirrellä solmuja näytöllä ja järjestellä dataa uudelleen.

Projekti: Rakenna kaavio, joka näyttää verkoston D3.js:llä

Tämän oppitunnin kansiossa on solution-kansio, josta löydät valmiin projektin viitteeksi.

Seuraa README.md-tiedoston ohjeita aloituskansion juuresta. Varmista, että sinulla on NPM ja Node.js asennettuna koneellesi ennen projektin riippuvuuksien asentamista.
Avaa starter/src-kansio. Löydät sieltä assets-kansion, jossa on .json-tiedosto, joka sisältää kaikki kirjeet kirjasta, numeroituina, ja niissä on 'to' ja 'from' -merkinnät.
Täydennä koodi components/Nodes.vue-tiedostossa, jotta visualisointi toimii. Etsi metodi nimeltä createLinks() ja lisää seuraava sisäkkäinen silmukka.

Käy läpi .json-objekti, tallenna kirjeiden 'to' ja 'from' -data ja rakenna links-objekti, jotta visualisointikirjasto voi käyttää sitä:

//loop through letters
      let f = 0;
      let t = 0;
      for (var i = 0; i < letters.length; i++) {
          for (var j = 0; j < characters.length; j++) {
              
            if (characters[j] == letters[i].from) {
              f = j;
            }
            if (characters[j] == letters[i].to) {
              t = j;
            }
        }
        this.links.push({ sid: f, tid: t });
      }

Käynnistä sovelluksesi terminaalista (npm run serve) ja nauti visualisoinnista!

🚀 Haaste

Etsi internetistä harhaanjohtavia visualisointeja. Kuinka tekijä harhauttaa käyttäjää, ja onko se tarkoituksellista? Yritä korjata visualisoinnit ja näytä, miltä niiden pitäisi näyttää.

Jälkiluentakysely

Kertaus ja itseopiskelu

Tässä muutamia artikkeleita harhaanjohtavista datavisualisoinneista:

https://gizmodo.com/how-to-lie-with-data-visualization-1563576606

http://ixd.prattsi.org/2017/12/visual-lies-usability-in-deceptive-data-visualizations/

Tutustu näihin mielenkiintoisiin visualisointeihin historiallisista aineistoista ja esineistä:

https://handbook.pubpub.org/

Lue tämä artikkeli siitä, kuinka animaatio voi parantaa visualisointeja:

https://medium.com/@EvanSinar/use-animation-to-supercharge-data-visualization-cd905a882ad4

Tehtävä

Rakenna oma mukautettu visualisointisi

Vastuuvapauslauseke:
Tämä asiakirja on käännetty käyttämällä tekoälypohjaista käännöspalvelua Co-op Translator. Vaikka pyrimme tarkkuuteen, huomioithan, että automaattiset käännökset voivat sisältää virheitä tai epätarkkuuksia. Alkuperäinen asiakirja sen alkuperäisellä kielellä tulisi pitää ensisijaisena lähteenä. Kriittisen tiedon osalta suositellaan ammattimaista ihmiskäännöstä. Emme ole vastuussa väärinkäsityksistä tai virhetulkinnoista, jotka johtuvat tämän käännöksen käytöstä.

12 KiB Raw Permalink Blame History Unescape Escape