Condivisione di report Web interattivi da JMP®Heman Robinson, sviluppatore software principale JMP, SAS
Gli ultimi vent'anni hanno visto una sfilata di tecnologie concorrenti per supportare pagine web interattive. Infine, il settore si è standardizzato su una tecnologia e JMP® ha iniziato a offrire report in HTML Versione 5, o HTML interattivo.
L'HTML interattivo supporta molte delle funzionalità esplorative di JMP, tra cui l'identificazione dei punti, il collegamento e il brushing. I report salvati possono essere condivisi sul Web o inviati via e-mail ai colleghi. Questo documento descrive quando e come utilizzare l'HTML interattivo per condividere i risultati di JMP.
Sfondo
HTML, o HyperText Markup Language, è la tecnologia che definisce la struttura di tutte le pagine Web ( http://www.w3.org/html/ ) (Berners-Lee, 1989). HTML è utilizzato insieme a Cascading Style Sheets per lo stile ( http://www.w3.org/Style/CSS/ ) (Meyer, 2004) e JavaScript per la programmazione ( http://www.ecmascript.org/ ) (Crockford, 2008).
Fino alla versione 4, HTML era limitato nel suo supporto per la grafica e l'interattività. Le tecnologie sviluppate per colmare questa lacuna erano per lo più estensioni del browser o "plug-in". Tra queste, applet Java, controlli ActiveX, Flash e Silverlight.
A partire dal 2011 circa, i browser Web hanno iniziato a supportare il nuovo elemento canvas HTML per la grafica e nuovi controlli come i cursori per l'interattività. Le tecnologie concorrenti hanno iniziato a declinare in questo periodo e le pagine Web interattive hanno iniziato a essere supportate tramite HTML5. La figura seguente mostra questa tendenza in termini di frequenze di parole chiave negli annunci sul sito di lavoro Indeed.com ( http://www.indeed.com/ ).
Figura 1. Offerte di lavoro per tecnologie Web interattive
In risposta a questa tendenza, JMP, come altri prodotti software, ha spostato lo sviluppo Web da Flash a HTML interattivo. Un report HTML interattivo JMP è un singolo file HTML che può essere condiviso da:
- pubblicandolo su internet,
- salvandolo in una cartella condivisa, oppure
- inviandolo via email a un collega.
Figura 2. Report HTML interattivo JMP
Quando usarlo
L'HTML interattivo richiede dati incorporati. Qualunque dato venga utilizzato per creare i grafici, quei dati sono incorporati nella pagina web. I dati sono offuscati, ma leggibili da un hacker motivato.
Potrebbe sembrare che questo rischio per la sicurezza possa essere mitigato crittografando i dati. Non è possibile. I dati devono essere leggibili dai browser web. Pertanto, i dati crittografati richiederebbero una chiave di decifratura, anch'essa leggibile dai browser web e da tutti gli altri. Crittografare i dati equivarrebbe ad acquistare un costoso antifurto per la propria casa e poi lasciare la chiave sotto lo zerbino.
Puoi eliminare alcuni rischi rendendo anonimi i tuoi dati, ad esempio creando un sottoinsieme dei tuoi dati senza colonne Nome o ID. È più sicuro creare questo sottoinsieme da soli. Tuttavia, le colonne non utilizzate nel report JMP non sono incorporate nel file HTML interattivo. Quindi, finché non utilizzi colonne identificative per etichette o altri scopi, i dati sono effettivamente resi anonimi per te.
Se si analizzano dati sensibili, è sempre possibile utilizzare il formato HTML statico (HTML versione 4), che non incorpora i dati. Nella finestra di dialogo "File: Salva con nome", HTML4 è etichettato semplicemente "File HTML". HTML5 è etichettato "HTML interattivo con dati" per enfatizzare sia l'interattività che la sicurezza.
Figura 3. Finestre di dialogo "File: Salva con nome" per HTML statico (HTML4) e HTML interattivo (HTML5)
Oltre ai dati incorporati, Interactive HTML richiede anche un browser web moderno. Su Windows, Internet Explorer versione 8 non supporta HTML versione 5, e IE versioni 9 e 10 ne supportano solo alcune parti. Il browser Android predefinito è più vecchio e lento, e Chrome e altri browser sono facili da scaricare.
A partire dal 2015, JMP consiglia HTML interattivo sui seguenti browser e dispositivi:
- IE 11 ed Edge su Windows
- Firefox su Windows e Mac
- Opera su Windows e Mac
- Chrome su Windows, Mac e tablet Android
- Safari su Mac e iPad
- Seta su Kindle Fire
Non testiamo l'HTML interattivo sui telefoni. Tuttavia, sui telefoni iPhone e Android più recenti, spesso funziona bene. Le prestazioni e le funzionalità variano notevolmente a seconda del telefono.
Come usarlo
Salvataggio del report
Per salvare un report in formato HTML5, seleziona “File: Salva con nome:” su Windows o “File: Esporta” su Mac e specifica il formato “HTML interattivo con dati”.
Figura 4. Finestra di dialogo "File: Salva con nome" per HTML interattivo (HTML5)
L'HTML interattivo supporta le funzionalità di JMP più frequentemente utilizzate. Se il report contiene una funzionalità non supportata, verrà visualizzato un avviso nella finestra di dialogo, come mostrato nella Figura 5. In tal caso, parte del report verrà esportata come immagine statica, come in Static HTML4.
Figura 5. Avviso di funzionalità non supportata
Contorni
Quando crei un report HTML interattivo, i grafici e le tabelle che erano chiusi quando la pagina è stata creata rimangono chiusi nella pagina web, finché non li apri. Apri o chiudi le sezioni del report cliccando o toccando i pulsanti di struttura nel report.
La figura seguente mostra come aprire la tabella "Lack of Fit". Le tabelle "Analysis of Variance" e "Parameter Estimates" sono già aperte.
Figura 6: Utilizzo dei pulsanti di struttura
JMP Interactive HTML impiega una strategia di progettazione dell'interfaccia utente "Mobile First" (Wroblewski, 2011). Quando si crea un report HTML interattivo, non sempre si sa su quali dispositivi verrà letto. Per questo motivo, i controlli come i pulsanti sono grandi e facili da usare, sia su dispositivi desktop che mobili.
Menù
Utilizzare i menu per modificare lo stato o l'aspetto dei contenuti del report. I contenuti dei menu dipendono dai contenuti del contorno associato. Ad esempio, il Profiler ha un singolo menu per reimpostare il suo stato.
Figura 7: Utilizzo del menu Profiler
Il Bubble Plot è dotato di un ampio sistema di menu che consente di modificarne l'aspetto e il comportamento.
Figura 8: Utilizzo del menu Grafico a bolle
Modalità
Per quanto riguarda le modalità nelle interfacce utente, il consiglio di progettazione tradizionale è "evitarle se possibile" (Nielsen, 1993). Tuttavia, per supportare un prodotto così riccamente interattivo come JMP, alcune modalità sono necessarie.
Un esempio familiare sono le modalità di selezione. Potresti voler selezionare oggetti singoli o oggetti multipli. La selezione singola e la selezione multipla sono due modalità diverse.
Nei prodotti desktop, i tasti Shift e Ctrl vengono utilizzati per passare da una modalità di selezione all'altra. Tuttavia, sui dispositivi mobili, questi tasti non esistono.
Per questo motivo, le modalità di selezione sono visualizzate come una coppia di pulsanti a levetta in cima alla pagina. Per impostazione predefinita, viene premuto il primo pulsante di questa coppia. Ciò consente di selezionare un oggetto alla volta e deselezionare tutti gli altri.
Figura 9: Selezione di singoli oggetti
Per selezionare più oggetti, clicca o tocca il secondo pulsante di attivazione/disattivazione. Ciò ti consente di selezionare o deselezionare più oggetti.
Nella figura sottostante sono state selezionate tre barre dell'istogramma. Come in JMP, tutti i grafici sono collegati , quindi le righe selezionate in un grafico sono evidenziate in tutti i grafici (Becker e Cleveland, 1987) (Stuetzle, 1987).
Figura 10: Selezione di più oggetti
Esiste una distinzione utile tra il comportamento dei tasti Shift e Ctrl e i pulsanti di attivazione/disattivazione. I tasti abilitano un cambio di modalità temporaneo, che tende a ridurre gli errori degli utenti (Raskin 2000). I pulsanti di attivazione/disattivazione abilitano un cambio di modalità persistente, che è più semplice e più facilmente apprendibile sui dispositivi mobili. Se si visualizza un report HTML interattivo su un desktop, sono supportati entrambi i comportamenti.
La seconda coppia di pulsanti a levetta sposta il focus dal report nel suo complesso ai dati. Per impostazione predefinita, viene premuto il primo pulsante di questa coppia. Sui dispositivi mobili, questo primo pulsante a levetta consente di scorrere e ingrandire il report. Su tutti i dispositivi, consente di identificare gli oggetti nel report. Quasi tutti gli oggetti nei report HTML interattivi possono visualizzare alcune informazioni identificative.
Figura 11: Identificazione degli oggetti
Il grafico sottostante mostra un adattamento bivariato usando Iris.jmp, una tabella di dati campione JMP contenente le misurazioni di Fisher di tre diverse specie di iris. Un punto dati è stato identificato con le sue coordinate X e Y e il numero di riga. La tabella sottostante mostra un valore p con la sua descrizione associata.
Figura 12: Identificazione dei valori dei dati
Figura 13: Descrizione di un valore p
Non sempre vuoi identificare oggetti o manipolare il report. Spesso, il tuo obiettivo è esplorare i dati. Cliccando o toccando il secondo pulsante di attivazione/disattivazione, puoi trascinare un rettangolo per selezionare le righe nei grafici. Questa è chiamata spazzolatura , una tecnica importante per esplorare dati multivariati (Becker e Cleveland, 1987). Trascina il centro del rettangolo per spostarlo o gli angoli per ridimensionarlo.
Figura 14: Spazzolatura dei dati
Per una potenza aggiuntiva, le modalità possono essere combinate. Se si utilizza un pennello con selezione multipla, questo fa sì che il pennello estenda la selezione, "dipingendo" i dati come mostrato nella figura sottostante.
Queste due coppie di modalità supportano le funzionalità interattive più comuni e utili per l'esplorazione dei dati. JMP offre un ricco set di modalità aggiuntive, molte delle quali sono emerse in una tavolozza degli strumenti (Cooper e Reimann, 2003). La metafora della tavolozza degli strumenti è meno utile nelle applicazioni Web a causa dello scarso supporto del cursore, ma alcune di queste modalità potrebbero essere supportate in future release.
Figura 15: Pennellata con selezione multipla
Come automatizzarlo
I report HTML interattivi possono essere automatizzati utilizzando il linguaggio di scripting JMP (JSL) (SAS, 2014). Un nuovo comando "Salva HTML interattivo" abilita questa funzionalità.
// Esporta un adattamento bivariato.
dt = Open( "$SAMPLE_DATA/Big Class.jmp" );
obj = Bivariato( Y( :peso ), X( :altezza ), Retta di adattamento );
obj << Salva HTML interattivo( "C:\Bivariate.html" );
Apri( "C:\Bivariate.html" );
Nello script sopra, il comando "Salva HTML interattivo" è seguito da un comando "Apri". Questo visualizza automaticamente il report nel tuo browser web predefinito.
Come organizzarlo
Se crei molti report HTML interattivi, trarrai vantaggio dal JMP Auto-Publishing Add-In (Valente, Brady e Kennedy, 2014). Questo fornisce un modo automatizzato per organizzare i tuoi report, con una pagina di copertina e schizzi in miniatura collegati ai singoli report. Scarica il JMP Auto-Publishing Add-In dalla JMP User Community all'indirizzo https://community.jmp.com/docs/DOC-6689 .
Il componente aggiuntivo JMP Auto-Publishing ha generato la pagina di copertina riportata di seguito, per i nostri esempi su http://www.jmp.com/jmphtml5/ .
Figura 16. Report organizzati con il componente aggiuntivo JMP Auto-Publishing
Lavoro futuro
Lo sviluppo di questo progetto è guidato dalla domanda dei clienti. Le tabelle e i grafici più frequentemente utilizzati erano supportati in JMP 11. I grafici a bolle e i profiler sono stati aggiunti in JMP 12.
Per le release future, c'è una domanda considerevole per GraphBuilder. Speriamo anche di integrare il JMP Auto-Publishing Add-In nel prodotto principale e siamo molto interessati alle richieste dei clienti.
Riferimenti
Becker R. e Cleveland W. (1987). “Grafici di dispersione a spazzola”, Tecnometria , 127-142.
Berners-Lee T. (1989). “Gestione delle informazioni: una proposta”, Il Cern .
Cooper A. e Reimann R (2003). About Face 2.0: gli elementi essenziali del design dell'interazione . Wiley, 322-323.
Crockford D. (2008). JavaScript: le parti buone. O'Reilly.
Meyer E. (2004). Fogli di stile a cascata: la guida definitiva. O'Reilly.
Nielsen J. (1993). Ingegneria dell'usabilità. Academic Press, 146-148.
Raskin J. (2000). L'interfaccia umana: nuove direzioni per la progettazione di sistemi interattivi . ACM Press, 55-59.
SAS (2014). Guida allo scripting JMP 11, seconda edizione . SAS Institute Inc.
Stuetzle W. (1987). “Finestre dei grafici”, Rivista dell'Associazione Statistica Americana, 82 , 466-475.
Valente D., Brady B. e Kennedy, A. (2014). “Un componente aggiuntivo JMP per la pubblicazione automatica di report HTML interattivi”, Vertice di scoperta JMP 2014 .
Wroblewski L. (2011). Mobile prima di tutto . Un libro a parte.
