Teilen interaktiver Webberichte aus JMP®Heman Robinson, JMP-Hauptsoftwareentwickler, SAS
In den letzten zwanzig Jahren gab es eine Vielzahl konkurrierender Technologien zur Unterstützung interaktiver Webseiten. Schließlich hat sich die Branche auf eine Technologie geeinigt, und JMP® bietet nun Berichte in HTML Version 5 (Interaktives HTML) an.
Interaktives HTML unterstützt viele der explorativen Funktionen von JMP, darunter Punktidentifizierung, Verlinkung und Brushing. Gespeicherte Berichte können über das Internet geteilt oder per E-Mail an Kollegen versendet werden. Dieses Dokument beschreibt, wann und wie Sie interaktives HTML zum Teilen von JMP-Ergebnissen verwenden.
Hintergrund
HTML (HyperText Markup Language) ist die Technologie, die die Struktur aller Webseiten definiert ( http://www.w3.org/html/ ) (Berners-Lee, 1989). HTML wird zusammen mit Cascading Style Sheets ( http://www.w3.org/Style/CSS/ ) (Meyer, 2004) und JavaScript ( http://www.ecmascript.org/ ) (Crockford, 2008) für die Programmierung verwendet.
Bis Version 4 war die Unterstützung von Grafiken und Interaktivität in HTML eingeschränkt. Technologien, die diese Lücke schließen sollten, waren hauptsächlich Browsererweiterungen oder „Plug-ins“. Dazu gehörten Java-Applets, ActiveX-Steuerelemente, Flash und Silverlight.
Ab etwa 2011 unterstützten Webbrowser das neue HTML-Canvas-Element für Grafiken und neue Steuerelemente wie Schieberegler für Interaktivität. Konkurrierende Technologien begannen zu dieser Zeit an Bedeutung zu verlieren, und interaktive Webseiten wurden zunehmend mit HTML5 unterstützt. Die folgende Abbildung zeigt diesen Trend anhand der Keyword-Häufigkeiten in Anzeigen auf der Job-Website Indeed.com ( http://www.indeed.com/ ).

Abbildung 1. Stellenausschreibungen für interaktive Webtechnologien
Als Reaktion auf diesen Trend hat JMP, wie andere Softwareprodukte auch, die Webentwicklung von Flash auf interaktives HTML umgestellt. Ein interaktiver HTML-Bericht von JMP ist eine einzelne HTML-Datei, die von folgenden Personen gemeinsam genutzt werden kann:
- es im Internet veröffentlichen,
- Speichern in einem freigegebenen Ordner oder
- per E-Mail an einen Kollegen.

Abbildung 2. Interaktiver JMP-HTML-Bericht
Wann man es verwendet
Interaktives HTML erfordert eingebettete Daten. Die zur Erstellung der Grafiken verwendeten Daten sind in die Webseite eingebettet. Die Daten sind zwar verschleiert, aber für einen motivierten Hacker lesbar.
Man könnte meinen, dieses Sicherheitsrisiko ließe sich durch Verschlüsselung der Daten mindern. Das ist jedoch nicht möglich. Die Daten müssen für Webbrowser lesbar sein. Daher benötigen verschlüsselte Daten einen Entschlüsselungsschlüssel, der ebenfalls für Webbrowser – und alle anderen – lesbar ist. Die Verschlüsselung der Daten wäre so, als würde man sich eine teure Alarmanlage kaufen und den Schlüssel unter der Fußmatte verstecken.
Sie können einige Risiken eliminieren, indem Sie Ihre Daten anonymisieren , z. B. indem Sie eine Teilmenge Ihrer Daten ohne Namens- oder ID-Spalten erstellen. Am sichersten ist es, diese Teilmenge selbst zu erstellen. Spalten, die im JMP-Bericht nicht verwendet werden, werden jedoch nicht in die interaktive HTML-Datei eingebettet. Solange Sie also keine identifizierenden Spalten für Beschriftungen oder andere Zwecke verwenden, sind die Daten effektiv für Sie anonymisiert.
Wenn Sie sensible Daten analysieren, können Sie immer das statische HTML-Format (HTML Version 4) verwenden, das die Daten nicht einbettet. Im Dialogfeld „Datei: Speichern unter“ wird HTML4 einfach als „HTML-Datei“ bezeichnet. HTML5 trägt die Bezeichnung „Interaktives HTML mit Daten“, um sowohl Interaktivität als auch Sicherheit zu betonen.

Abbildung 3. „Datei: Speichern unter“-Dialoge für statisches HTML (HTML4) und interaktives HTML (HTML5)
Neben eingebetteten Daten erfordert interaktives HTML auch einen modernen Webbrowser. Unter Windows unterstützt Internet Explorer Version 8 HTML Version 5 nicht, und die IE-Versionen 9 und 10 unterstützen nur Teile davon. Der Standardbrowser von Android ist älter und langsamer; Chrome und andere Browser lassen sich leicht herunterladen.
Ab 2015 empfiehlt JMP interaktives HTML für die folgenden Browser und Geräte:
- IE 11 und Edge unter Windows
- Firefox unter Windows und Mac
- Opera unter Windows und Mac
- Chrome auf Windows-, Mac- und Android-Tablets
- Safari auf Mac und iPad
- Silk auf Kindle Fire
Wir testen interaktives HTML nicht auf Smartphones. Auf neueren iPhones und Android-Smartphones funktioniert es jedoch oft gut. Leistung und Funktionen variieren je nach Smartphone stark.
Wie man es benutzt
Speichern des Berichts
Um einen Bericht im HTML5-Format zu speichern, wählen Sie unter Windows „Datei: Speichern unter:“ bzw. auf dem Mac „Datei: Exportieren“ und geben Sie das Format „Interaktives HTML mit Daten“ an.

Abbildung 4. Dialogfeld „Datei: Speichern unter“ für interaktives HTML (HTML5)
Interaktives HTML unterstützt die am häufigsten verwendeten Funktionen von JMP. Enthält Ihr Bericht eine nicht unterstützte Funktion, wird im Dialogfeld eine Warnung angezeigt (siehe Abbildung 5). In diesem Fall wird ein Teil Ihres Berichts als statisches Bild exportiert, genau wie bei statischem HTML4.

Abbildung 5. Warnung vor nicht unterstützter Funktion
Umrisse
Wenn Sie einen interaktiven HTML-Bericht erstellen, bleiben Diagramme und Tabellen, die beim Erstellen der Seite geschlossen waren, auf der Webseite geschlossen, bis Sie sie öffnen. Öffnen oder schließen Sie Berichtsabschnitte, indem Sie auf die Gliederungsschaltflächen im Bericht klicken oder tippen.
Die folgende Abbildung zeigt, wie die Tabelle „Lack of Fit“ geöffnet wird. Die Tabellen „Varianzanalyse“ und „Parameterschätzungen“ sind bereits geöffnet.

Abbildung 6: Verwenden der Gliederungsschaltflächen
JMP Interactive HTML verfolgt eine „Mobile First“-Strategie für das Benutzeroberflächendesign (Wroblewski, 2011). Beim Erstellen eines interaktiven HTML-Berichts ist nicht immer klar, auf welchen Geräten er gelesen wird. Aus diesem Grund sind Steuerelemente wie Schaltflächen groß und benutzerfreundlich, sowohl auf Desktop-PCs als auch auf Mobilgeräten.
Menüs
Verwenden Sie die Menüs, um den Status oder die Darstellung von Berichtsinhalten zu ändern. Der Menüinhalt hängt vom Inhalt der zugehörigen Gliederung ab. Der Profiler verfügt beispielsweise über ein einzelnes Menü zum Zurücksetzen seines Status.

Abbildung 7: Verwenden des Profiler-Menüs
Das Blasendiagramm verfügt über ein umfangreiches Menüsystem zum Ändern seines Aussehens und Verhaltens.

Abbildung 8: Verwenden des Blasendiagramm-Menüs
Modi
In Bezug auf Modi in Benutzeroberflächen lautet die traditionelle Designempfehlung: „Vermeiden Sie sie nach Möglichkeit“ (Nielsen, 1993). Um jedoch ein so interaktives Produkt wie JMP zu unterstützen, sind einige Modi erforderlich.
Ein bekanntes Beispiel sind Auswahlmodi. Sie können einzelne oder mehrere Objekte auswählen. Einzelauswahl und Mehrfachauswahl sind zwei verschiedene Modi.
In Desktop-Produkten werden die Umschalt- und Strg-Tasten zum Wechseln zwischen Auswahlmodi verwendet. Auf Mobilgeräten sind diese Tasten jedoch nicht vorhanden.
Aus diesem Grund werden Auswahlmodi als Umschaltflächen oben auf der Seite angezeigt. Standardmäßig ist die erste dieser Schaltflächen gedrückt. So können Sie jeweils ein Objekt auswählen und die Auswahl aller anderen aufheben.

Abbildung 9: Auswahl einzelner Objekte
Um mehrere Objekte auszuwählen, klicken oder tippen Sie auf den zweiten Umschaltknopf. So können Sie mehrere Objekte auswählen oder die Auswahl aufheben.
In der folgenden Abbildung wurden drei Histogrammbalken ausgewählt. Wie in JMP sind alle Diagramme verknüpft , sodass in einem Diagramm ausgewählte Zeilen in allen Diagrammen hervorgehoben werden (Becker und Cleveland, 1987) (Stützle, 1987).

Abbildung 10: Mehrere Objekte auswählen
Es gibt einen nützlichen Unterschied zwischen der Funktionsweise der Umschalt- und Strg-Tasten und der Umschalttasten. Die Tasten ermöglichen einen temporären Moduswechsel, der Benutzerfehler reduziert (Raskin 2000). Die Umschalttasten ermöglichen einen dauerhaften Moduswechsel, der auf mobilen Geräten einfacher und leichter zu erlernen ist. Wenn Sie einen interaktiven HTML-Bericht auf einem Desktop anzeigen, werden beide Verhaltensweisen unterstützt.
Das zweite Umschaltflächenpaar verlagert den Fokus vom gesamten Bericht auf die Daten. Standardmäßig ist die erste Schaltfläche dieses Paars gedrückt. Auf Mobilgeräten ermöglicht diese erste Umschaltfläche das Scrollen und Zoomen im Bericht. Auf allen Geräten ermöglicht sie die Identifizierung von Objekten im Bericht. Fast alle Objekte in interaktiven HTML-Berichten können identifizierende Informationen anzeigen.

Abbildung 11: Objekte identifizieren
Die folgende Grafik zeigt eine bivariate Anpassung mit Iris.jmp, einer JMP-Beispieldatentabelle mit Fishers Messungen dreier verschiedener Irisarten. Ein Datenpunkt wurde mit seinen X- und Y-Koordinaten sowie der Zeilennummer identifiziert. Die folgende Tabelle zeigt einen p -Wert mit der zugehörigen Beschreibung.

Abbildung 12: Identifizieren von Datenwerten

Abbildung 13: Beschreibung eines p -Wertes
Sie möchten nicht immer Objekte identifizieren oder den Bericht bearbeiten. Oft möchten Sie die Daten untersuchen. Durch Klicken oder Tippen auf die zweite Umschaltfläche können Sie ein Rechteck ziehen, um Zeilen in Diagrammen auszuwählen. Dies wird als „Brushing“ bezeichnet und ist eine wichtige Technik zur Untersuchung multivariater Daten (Becker und Cleveland, 1987). Ziehen Sie die Mitte des Rechtecks, um es zu verschieben, oder die Ecken, um die Größe zu ändern.

Abbildung 14: Daten aufbereiten
Für zusätzliche Leistung können Modi kombiniert werden. Wenn Sie einen Pinsel mit Mehrfachauswahl verwenden, erweitert der Pinsel die Auswahl und „malt“ die Daten wie in der folgenden Abbildung dargestellt.
Diese beiden Modipaare unterstützen die gängigsten und nützlichsten interaktiven Funktionen zur Datenexploration. JMP bietet eine Vielzahl zusätzlicher Modi, viele davon in einer Werkzeugpalette (Cooper und Reimann, 2003). Die Werkzeugpalette ist in Webanwendungen aufgrund der unzureichenden Cursorunterstützung weniger nützlich. Einige dieser Modi werden jedoch möglicherweise in zukünftigen Versionen unterstützt.

Abbildung 15: Pinselstriche mit Mehrfachauswahl
So automatisieren Sie es
Interaktive HTML-Berichte können mithilfe der JMP Scripting Language (JSL) (SAS, 2014) automatisiert werden. Der neue Befehl „Interaktives HTML speichern“ ermöglicht diese Funktion.
// Exportiert eine bivariate Anpassung.
dt = Öffnen("$SAMPLE_DATA/Big Class.jmp");
obj = Bivariate( Y( :Gewicht ), X( :Höhe ), Anpassungslinie );
obj << Interaktives HTML speichern( "C:\Bivariate.html" );
Öffnen( "C:\Bivariate.html" );
Im obigen Skript folgt auf den Befehl „Interaktives HTML speichern“ der Befehl „Öffnen“. Dadurch wird der Bericht automatisch in Ihrem Standard-Webbrowser angezeigt.
So organisieren Sie es
Wenn Sie viele interaktive HTML-Berichte erstellen, profitieren Sie vom JMP Auto-Publishing-Add-In (Valente, Brady und Kennedy, 2014). Es ermöglicht Ihnen die automatisierte Organisation Ihrer Berichte mit einem Deckblatt und Miniaturansichten, die mit einzelnen Berichten verknüpft sind. Laden Sie das JMP Auto-Publishing-Add-In von der JMP-Benutzercommunity unter https://community.jmp.com/docs/DOC-6689 herunter.
Das JMP Auto-Publishing-Add-In hat für unsere Beispiele unter http://www.jmp.com/jmphtml5/ das folgende Deckblatt generiert.

Abbildung 16. Mit dem JMP Auto-Publishing-Add-In organisierte Berichte
Zukünftige Arbeit
Die Entwicklung dieses Projekts wird durch die Kundennachfrage vorangetrieben. Die am häufigsten verwendeten Tabellen und Diagramme wurden in JMP 11 unterstützt. Blasendiagramme und Profiler wurden in JMP 12 hinzugefügt.
Für zukünftige Versionen besteht eine große Nachfrage nach GraphBuilder. Wir hoffen außerdem, das JMP Auto-Publishing-Add-In in das Hauptprodukt integrieren zu können und freuen uns sehr über Kundenanfragen.
Verweise
Becker R. und Cleveland W. (1987). „Brushing Scatterplots“, Technometrie , 127-142.
Berners-Lee T. (1989). „Informationsmanagement: Ein Vorschlag“, CERN .
Cooper A. und Reimann R (2003). About Face 2.0: Die Grundlagen des Interaktionsdesigns . Wiley, 322-323.
Crockford D. (2008). JavaScript: Die guten Seiten. O'Reilly.
Meyer E. (2004). Cascading Style Sheets: Der ultimative Leitfaden. O'Reilly.
Nielsen J. (1993). Usability Engineering. Academic Press, 146-148.
Raskin J. (2000). Die menschliche Schnittstelle: Neue Wege für die Gestaltung interaktiver Systeme . ACM Press, 55-59.
SAS (2014). JMP 11 Scripting Guide, Zweite Ausgabe . SAS Institute Inc.
Stützle W. (1987). „Plot Windows“, Zeitschrift der American Statistical Association, 82 , 466-475.
Valente D., Brady B. und Kennedy, A. (2014). „Ein JMP-Add-In für die automatische Veröffentlichung interaktiver HTML-Berichte“, JMP Discovery Summit 2014 .
Wroblewski L. (2011). Mobile First . Ein Buch für sich.