A JSM 2019, Sto partecipando a una sessione su Visualizzazione dinamica dei dati interattivi . Quando fui invitato per la prima volta dal presidente della sessione, Blanton Godfrey, a contribuire a un discorso, il mio primo pensiero fu: "Certo, JMP ha molte visualizzazioni di dati dinamici e interattivi". Ma un secondo pensiero seguì rapidamente, "Cosa fa davvero significare? Oggi tutto è interattivo. "
Ciò mi ha portato a cercare di classificare diversi metodi di interattività. L'obiettivo elevato è quello di aiutare a definire una classificazione dell'interattività di visualizzazione dei dati che sarebbe utile nel confronto dei prodotti o nella discussione delle singole implementazioni. In questo sforzo iniziale, ho classificato nove tecniche, insieme a video di esempio delle interazioni all'interno JMP .
- Costruzione del grafico
- Collegamento alla selezione
- Filtraggio righe
- Dettagli al passaggio del mouse
- Messa a punto del modello
- Mappatura estetica
- Cambio colonna
- Volume di taglio
- Ridimensionamento dell'asse
Sto usando lo stesso set di dati in tutti i miei video di esempio. Contiene oltre 60 colonne di dati demografici, economici ed elettorali per oltre 3.000 contee statunitensi. Ora ai metodi!
Costruzione del grafico
Creazione di grafici interattivi significa costruzione o ristrutturazione di un grafico con aggiornamenti immediati della vista. In JMP, le interazioni sono direttamente in superficie. Altre implementazioni possono ancora essere interattive con zone di rilascio sul lato del grafico.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-w1Yng3aTE6cNO7Pg5DSI6NI35O7flBl5w928h446r11', 'w1Yng3aTE6cNO7Pg5DSI6NI35O7flBl5', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"928px","height":"446px"});
(visualizza in I miei video)
Il video evidenzia un paio di sfide. Quando è stata aggiunta la seconda variabile Y, "Rep Pct", c'erano più zone di rilascio Y rispetto a prima, quindi potevamo specificare dove inserirla rispetto alla variabile Y esistente. E le zone di rilascio Colore e Dimensione sono artificiali in quanto non hanno la stessa posizione naturale delle variabili degli assi X e Y.
Questo grafico finale è molto simile a quello descritto in a Articolo del New York Times intitolato "Le contee più conservatrici sono quelle che ottengono la maggior assistenza da parte del governo" discussione su Twitter sulla linea di regressione e altre funzionalità. Ciò mi ha portato a raccogliere ed esplorare personalmente i dati ( Ufficio di analisi economica e Risultati delle elezioni di Tony McGovern ). Quando ho capito quanti metodi di interattività stavo esercitando nel corso della mia esplorazione, ho pensato che questo avrebbe reso un set di dati dimostrativo adatto.
Collegamento alla selezione
Quando ci sono più viste utilizzando la stessa tabella di dati, il collegamento di selezione indica che gli elementi evidenziati in una vista hanno i loro elementi corrispondenti evidenziati nelle altre viste. In JMP, il collegamento alla selezione è sempre attivo, il che significa che deve essere veloce anche con milioni di righe. A tale scopo, la selezione viene inserita come parte centrale di ogni tabella di dati.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-91Y3g3aTE6UQB4ZFOYAANeKz_24gCiwgw912h446r804', '91Y3g3aTE6UQB4ZFOYAANeKz_24gCiwg', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"912px","height":"446px"});
(visualizza in I miei video)
La sfida più grande è quando gli elementi del grafico non hanno una corrispondenza uno a uno tra loro, come i punti a livello di contea e le forme a livello di stato nell'esempio. Mostrare una selezione parziale in modo chiaro per qualsiasi tipo di grafico è una sfida aperta. Per la mappa, JMP evidenzia un'intera forma di stato quando una delle sue contee è selezionata altrove. Per gli elementi del grafico dimensionati per conteggio, come le barre dell'istogramma, JMP utilizzerà l'evidenziazione parziale per riflettere la selezione parziale.
Filtraggio righe
Il filtro di riga è uno dei tipi più comuni di interazione con la visualizzazione dei dati. L'idea è che la visualizzazione utilizza solo un sottoinsieme delle righe della tabella di dati, in base ai vincoli dei filtri che appaiono accanto alla vista.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-5iZHg3aTE6SQv6VAfU_xNjFfMCuO01jbw856h406r586', '5iZHg3aTE6SQv6VAfU_xNjFfMCuO01jb', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"856px","height":"406px"});
(visualizza in I miei video)C'è un'opzione chiamata "Scale di blocco" che ho usato nel video per mantenere fissi gli assi durante il filtraggio. Altrimenti, verrebbero adattati per ciascun sottoinsieme filtrato.
Dettagli al passaggio del mouse
Un tipo passivo di interazione è passare con il mouse sopra un elemento grafico e far apparire una finestra mobile con più dettagli. A volte questi sono chiamati "suggerimenti" poiché erano originariamente utilizzati per le icone della barra degli strumenti. In una visualizzazione di dati, i dettagli al passaggio del mouse sono un modo per mostrare sia valori più precisi per le variabili tracciate che variabili aggiuntive correlate.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-NoZHg3aTE6ufjR5lBO2jl20LGnTPiryRw944h332r543', 'NoZHg3aTE6ufjR5lBO2jl20LGnTPiryR', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"944px","height":"332px"});
(visualizza in I miei video)
Nell'esempio, si noti che il nome della contea è stato incluso nei dettagli al passaggio del mouse per il grafico a dispersione anche se quella variabile non è presente nel grafico. Questo perché la variabile nella tabella dei dati è contrassegnata da un attributo che la fa apparire in tutti i dettagli al passaggio del mouse per impostazione predefinita.
Messa a punto del modello
L'ottimizzazione del modello indica che la rappresentazione visiva cambia quando viene modificato un parametro del modello. Nell'esempio, il modello è una spline più liscia e il parametro del modello è il parametro rigidezza, lambda.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-lwZHg3aTE6Cxjm8c2z_c_96H3HNrYoBKw876h386r150', 'lwZHg3aTE6Cxjm8c2z_c_96H3HNrYoBK', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"876px","height":"386px"});
(visualizza in I miei video)
Sebbene molti modelli siano troppo lenti per tale sintonia interattiva, i computer sono abbastanza veloci da fare più di quanto spesso pensiamo. Questo modello dall'aspetto semplice ha molto da fare. Esistono quattro levigatrici separate e ognuna ha un intervallo di confidenza bootstrap 250x, quindi ci sono 1.000 modelli di spline che si adattano ogni volta che cambia il parametro di rigidità.
Mappatura estetica
La mappatura degli attributi estetici agli elementi grafici è un'interazione semplice ma importante. Con l'estetica, come i colori e gli stili di linea, spesso è necessario vederlo per sapere come funziona bene.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-c0ZXg3aTE6a3ZbW4jgVWp0XEhClvYMmcw888h422r187', 'c0ZXg3aTE6a3ZbW4jgVWp0XEhClvYMmc', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"888px","height":"422px"});
(visualizza in I miei video)
Gli attributi semplici possono essere modificati con un clic destro e attributi più complessi come la mappatura dei colori con gradiente richiedono una finestra di dialogo delle impostazioni e quindi un livello di interattività in meno.
Cambio colonna
Nel cambio di colonna, si sostituiscono una o più colonne di dati con un'altra colonna di un set. Qui, la variabile Y viene sostituita una a una con le colonne nel riquadro di sinistra.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-swZ3g3aTE6nqw8PbCMQysv4S0v_x9j8Iw856h386r61', 'swZ3g3aTE6nqw8PbCMQysv4S0v_x9j8I', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"856px","height":"386px"});
(visualizza in I miei video)
Il cambio di colonna può essere un buon modo per passare rapidamente attraverso un nuovo set di dati.
Volume di taglio
La suddivisione in volumi è un modo per esplorare uno spazio dati multidimensionale rappresentando graficamente un insieme di sezioni bidimensionali. Il Profiler in JMP utilizza lo slicing per esplorare modelli multidimensionali. In questo esempio, stiamo modellando Rep Pct, sulla Y, rispetto a tre fattori, reddito personale, trasferimento personale e tasso di scrutinio, che si traducono in una superficie quadridimensionale. Ogni fotogramma mostra una sezione attraverso una X mentre le altre X sono tenute fisse.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-4yZ3g3aTE6juUfpYEYjPJuyqCiE3P95ew876h378r954', '4yZ3g3aTE6juUfpYEYjPJuyqCiE3P95e', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"876px","height":"378px"});
(visualizza in I miei video)
Il trasferimento personale sembra avere scarso effetto (è per lo più una linea piatta in questa sezione, almeno), ma mentre interagiamo con esso e cambiamo il suo valore fisso utilizzato dagli altri frame, vediamo un'interazione con il reddito personale. Il reddito personale ha una pendenza positiva allentata per un trasferimento personale elevato e una pendenza negativa forte per valori di trasferimento personale bassi.
Ridimensionamento dell'asse
Una scala definisce il modo in cui i valori dei dati vengono mappati alle coordinate dello schermo e viene visualizzato come un asse. L'interazione del ridimensionamento degli assi è la capacità di modificare tale mappatura manipolando direttamente l'asse. Le interazioni includono panning, stretching e zoom.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-JhZ3g3aTE6fEz1j6iZo-YcS1fqY37RRLw756h406r321', 'JhZ3g3aTE6fEz1j6iZo-YcS1fqY37RRL', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"756px","height":"406px"});
(visualizza in I miei video)
Il ridimensionamento degli assi non è sempre solo una questione di ridisegno degli elementi in posizioni diverse. Si noti che il diagramma a punti sulla destra deve regolare il suo layout schivando il marker per le nuove scale e gli assi stessi a volte devono ricalcolare le cose come gli intervalli del segno di spunta. Nel caso o nelle visualizzazioni geografiche, è anche utile cambiare le proiezioni a seconda della scala.
LITHIUM.OoyalaPlayer.addVideo('https:\/\/player.ooyala.com\/static\/v4\/production\/', 'lia-vid-BxZ3g3aTE6g374JDRrFcRvP3b9lNPY_9w920h426r791', 'BxZ3g3aTE6g374JDRrFcRvP3b9lNPY_9', {"pcode":"ltbGkyOjMl3V3pZ3Trn6T2z1_rjF","playerBrandingId":"ODI0MmQ3NjNhYWVjODliZTgzY2ZkMDdi","width":"920px","height":"426px"});
(visualizza in I miei video)Per JMP, la scala regionale utilizza un Albers proiezione dell'area uguale e la scala mondiale usa a Kavrayskiy VII compromettere la proiezione.
Altre interazioni?
Dati questi nove metodi di interazione per la visualizzazione dei dati, possiamo considerare meglio ulteriori domande:
- Quali altri metodi di interazione generale sono utili nella visualizzazione dei dati? Sto dicendo metodi "generali" poiché immagino che non vi siano limiti al numero di interazioni speciali orientate verso un particolare tipo di grafico. Ad esempio, JMP ha un modo per modificare interattivamente le dimensioni del cestino degli istogrammi che non ho incluso qui come metodo generale.
- Alcuni di questi metodi dovrebbero essere suddivisi in più metodi? Forse la suddivisione in volumi è diversa per l'esplorazione dei dati rispetto all'esplorazione del modello. Sto considerando il ridimensionamento interattivo dei grafici come una sorta di ridimensionamento degli assi, ma forse vale la pena avere una propria categoria.
- Alcuni di questi metodi dovrebbero essere combinati come varietà dello stesso metodo? Forse il filtro di riga e il cambio di colonna sono due varietà di un'interazione di sottoinsieme più ampia.
- Esistono nomi migliori per questi metodi, preesistenti o nuovi? Alcuni di questi nomi derivano dalla terminologia di JMP e alcuni sono la mia invenzione per questa discussione.
- Dovrebbero essere riconosciuti livelli diversi di ciascun metodo? Ad esempio, dovremmo distinguere tra la creazione di grafici con o senza un'anteprima dal vivo.
Spero di ricevere feedback su queste e altre domande, qui, su JSM o su Twitter.
