Lautsprecher | Transkript |
| jopo | Hallo, willkommen zu meinem Vortrag. |
| Die Motivation für diesen Vortrag basierte auf einer Diskussion in der JMP-Benutzercommunity. Dr. Anderson Mayfield ist Meeresbiologe bei NOAA und der University of Miami. |
| Er erforscht die Gesundheit von Riffkorallen. Er hielt einen Vortrag in unserer speziellen Earth Day-Folge von JMP On Air. Und er hält auch einen Vortrag auf dieser Konferenz. |
| In diesem Beitrag der JMP User Community hat er dieses Bild hier gepostet. Und wie Sie sehen können, enthält es all diese Grafiken, die Korallen oder Korallenriffe darstellen |
| und sie stellen mehrere Datenstücke in einer kleinen Grafik dar, was ein bisschen wie ein Videospiel ist, wenn man Spielerstatistiken hat |
| und sie schweben um den Spieler herum, während sie durch die Szene laufen. Jetzt haben Sie wahrscheinlich eine Idee, warum ich meinen Vortrag „Was bekommt man, wenn man ein Videospiel, einen Meeresbiologen und JMP kombiniert?“ genannt habe. Machen wir also weiter. |
| Ich werde über diese spielbasierten oder spielinspirierten Lösungen sprechen, die in JMP möglich sind, einschließlich der Verwendung benutzerdefinierter Grafikskripte, |
| benutzerdefinierte Karten. Und dann werde ich über eine webbasierte 3D-Streudiagrammanwendung sprechen, die ich erstellt habe, und wie ich JMP-Datensätze in diese Anwendung integriert habe. |
| Hier ist ein Beispiel des Grafikskripts. |
| Und hier ist ein Beispiel für die Verwendung benutzerdefinierter Karten. Und hier ist meine 3D-Streudiagrammanwendung. |
| Also, legen wir los. Damit Sie sehen, wie benutzerdefinierte Grafikskripte verwendet werden, habe ich hier ein kleines Beispiel. |
| Und wenn ich JMP öffne und ausführe |
| diese kleine Grafik, und tatsächlich werde ich darüber sprechen. |
| Ich verwende diesen fiktiven Datensatz, den ich von Grund auf neu erstellt habe. Und es geht im Wesentlichen um einen Fischschwarm, der vom Great Barrier Reef bis nach Sydney schwimmt. |
| Um zu Grafikskripten zu gelangen, können Sie auf „Anpassen“ gehen. |
| Und dann können Sie mit diesem kleinen Plus-Button ein neues Skript hinzufügen. Es beginnt leer, aber wir haben einige Beispiele in JMP. |
| Mir gefällt das Polygonskript. Es ist sehr einfach. Es zeichnet lediglich ein Dreieck. Wenn ich es also auf mein Diagramm anwende, können Sie dort ein Dreieck sehen. |
| Und wir brauchten nur drei Linien, das Einstellen der Transparenz, das Festlegen einer Füllfarbe und dann das Zeichnen des Polygons. |
| Aber was wir wissen wollen, ist, wie man das tatsächlich in ein Skript einbettet. Der einfachste Weg, das herauszufinden, ist, auf die Schaltfläche „Antworten“ zu klicken. |
| und Sie speichern das Skript im Skriptfenster. Und hier ist das Skript. Es beginnt damit, dass meine kleine bivariate Plattform mit Breiten- und Längengrad gestartet wird. Und weiter unten gibt es eine Meldung mit einem Skript zum Hinzufügen von Grafiken. |
| Und dann die drei Zeilen des Beispiels. |
| Dies ist also ein wirklich einfaches Beispiel für die Verwendung eines Grafikskripts. |
| Dies ist nun ein Grafikskript, das ich einbetten werde. Es zeichnet diese Balken, die über jedem Punkt schweben. |
| Und was ich zuerst in dieser Anwendung mache, ist, dass ich auch die Transparenz einstelle und dann einen Hintergrund für meine kleine Grafik zeichne. |
| einen für den Hunger, einen für die Kraft und einen für die Geschwindigkeit. |
| Jetzt zeige ich Ihnen das gesamte Skript, da es auf anderen Dingen basiert. Es basiert auf diesen Konstanten, die ich hauptsächlich für Farben und den Hintergrund und ein paar Dinge wie den Hintergrund eingerichtet habe. |
| Dies ist meine Funktion zum Zeichnen von Balken. Sie nimmt eine Position, eine Länge und eine Farbe an. Das kann also für jeden Balken verwendet werden. Wenn ich also dieses Skript ausführe. |
| Da ist sie, die Grafik mit dem kleinen |
| eine Art von spielinspirierten Gesundheitsmonitoren, die über jedem Fisch schweben, während er mit der Strömung in Ost-Australien nach Sydney schwimmt. |
| Dies wird Ihnen im Wesentlichen Schritt für Schritt eine Vorstellung davon vermitteln, wie diese Funktion funktioniert. Wir haben mit nur einem Marker auf dem Bildschirm begonnen und für jeden Marker den Pixelursprung festgelegt. |
| Und dann beginnen wir den Hintergrund zu zeichnen, das dauert aber ein paar Schritte. Beim ersten Einstellen der Linienstärke sieht man eigentlich noch nichts. |
| Dann legen wir die Farbe fest, die schwarz sein wird. Und dann führen wir eine Bewegung zu einer Linie aus, die den Hintergrund und eine sehr dicke Linie zeichnet. |
| Und für jeden Balken legen wir die Farbe des Balkens fest, bewegen uns an die Position und zeichnen dann eine Linie. Dann zeichnen wir den Hintergrund, legen seine Farbe fest und er setzt den Balken fort. Und das machen wir natürlich auch für die anderen beiden Linien. |
| Jetzt können Sie viele verschiedene Grafikfunktionen verwenden. Und hier ist der Abschnitt mit den Grafikfunktionen der JSL-Syntaxreferenz. Sie können alles erstellen, was Sie möchten. Also legen Sie los. |
| Als Nächstes werde ich über die Verwendung benutzerdefinierter Karten sprechen. |
| Verzeihung. |
| Und um benutzerdefinierte Karten zu verwenden, stellen Sie grundsätzlich zwei Tabellen bereit. Die erste Tabelle ist eine Definition aller Formen, die Sie verwenden möchten. Und die zweite benennt die Formen in der Tabelle. |
| Und für diese Namensspalte müssen Sie im Wesentlichen eine Spalteneigenschaft für die Kartenrolle hinzufügen, und zwar vom Typ „Shape-Namensdefinition“. Das zeige ich Ihnen gleich. |
| Um ein ganz einfaches Beispiel zu machen, brauchen wir natürlich eine große Klasse. Und ich werde eine ganz einfache haben. |
| Karte dafür, die nur zwei Rechtecke hat. Lassen Sie mich diese Dateien öffnen. |
| Es ist also eine sehr kleine Karte, wie ich schon sagte. Und nur um Ihnen diese Koordinaten zu zeigen, habe ich ein wenig |
| Skript hier, das im Wesentlichen die Punkte zeigt. |
| Wenn ich diese oberen vier hervorhebe, ist das das obere Rechteck und die nächsten vier sind das untere Rechteck. |
| Die oberen sind das Gewicht, die unteren die Größe. Und wenn Sie sich die Spalteneigenschaft ansehen, |
| es ist die Kartenrolle und die Definition des Formnamens. |
| Sobald wir diese Karte fertig haben, können wir Big Class öffnen. |
| Wir können es nicht direkt wiederverwenden. Was wir zuerst tun müssen, ist, die Spalten für Höhe und Gewicht zu nehmen und sie zu stapeln. Also gehen wir zu Tabellen. Lassen Sie mich sie stapeln. |
| Und jetzt habe ich eine Tabelle, in der diese Spalten gestapelt sind. |
| Sie sehen, dass Höhe und Stärke des Etiketts abwechselnd angegeben sind. Um dies mit der Zuordnungsdatei zu verknüpfen, müssen wir eine weitere Spalteneigenschaft hinzufügen. |
| Das hier ist ganz unten, wieder Map-Rolle. Aber wir sagen nicht Shaped Name Definition, sondern Shaped Name Use und wir müssen die |
| Map-Datei, der Name der Map-Datei. |
| Und legen Sie auch den Spaltennamen fest. |
| Und dann sind wir fertig. Jetzt, wo wir das haben, kann ich es tatsächlich in einem Diagramm verwenden. |
| Das Diagramm, das wir verfolgen, verwendet im Wesentlichen die Beschriftungsspalte für die Kartenform, die die oberen und unteren Formen einrichtet, und dann können wir die Datenspalte hineinziehen, die alle Daten enthält |
| in die Farbrolle. Und da haben wir es, das ist eine Zusammenfassung aller Schüler in Big Class, aber wir wollen wirklich |
| eine pro Schüler. Wenn ich das auf die Wrap-Rolle ziehe, ist es etwas eng, aber ich werde es verteilen, indem ich Ebenen pro Zeile mache und das auf 10 setze. |
| Da haben wir es. Und das ist so ziemlich das, was ich wollte. Und das kann eine nützliche Grafik sein |
| von allein. |
| Machen wir jetzt etwas Komplizierteres. |
| Wenn Sie etwas Komplizierteres tun, möchten Sie vielleicht das Add-In „Benutzerdefinierte Kartenerstellung“ verwenden. |
| Und das ist ein großartiges Add-In. Sie können damit ein Bild hineinziehen und dann darüberfahren. |
| Und wenn Sie mit dem Nachzeichnen aller Formen fertig sind, klicken Sie auf Mit Zufallsdaten beenden, und es wird |
| die beiden benötigten Shape-Dateien sowie einen zufälligen Datensatz, mit dem Sie Ihre benutzerdefinierte Karte testen können. Und hier ist eine, bei der ich nur vier Variablen und eine in der Mitte verwendet habe. Es handelt sich also im Grunde genommen um eine quadratische Version dessen, was Sie auf meiner Originalfolie gesehen haben. |
| Das war nun nicht gerade das, was wir anstrebten. Wir wollten etwas Rundes, und ich glaube, es war Dr. Mayfield, der es einen komplexen Kuchen nannte. |
| Ich weiß nicht, ob das ein offizieller Begriff ist, aber ich habe beschlossen, diese Dinge mit einem Skript zu erstellen. |
| Ich wollte also Shape-Dateien erstellen und sicherstellen, dass ich das bekomme, was der Arzt verordnet hat. Und das waren vier Shapes mit etwas in der Mitte. |
| Und dann dachte ich: „Also, ich bin Programmierer. Ich möchte gern ein bisschen mehr machen und die Dinge etwas flexibler gestalten.“ |
| Daher dachte ich, dass manche Leute vielleicht dasselbe tun möchten, aber nur zwei Variablen plus eine Durchschnitts- oder Zentralvariable oder mehr haben. |
| Und ich dachte, es wäre vielleicht ganz nett, auch andere Formen wie Rauten oder Quadrate machen zu können. Ich bin also kein Genie. Ich hatte Glück. Und Xan Gregg hat tatsächlich auf einen Beitrag geantwortet, in dem es darum ging, wie ich dieses Polardiagramm in JMP erstellen kann. |
| Und hier kommt es. |
| Da gehen wir hin und |
| Sie suchten nach einer Form wie dieser, die meinen Anforderungen sehr ähnlich sah. |
| Was Xan gemacht hat, war wirklich großartig. Es ist ein flexibles Skript, das genau das macht und diese Keile um einen Kreis herum erzeugt, aber das einzige, was fehlte, war der Mittelpunkt und auch die Benennung der Dateien auf eine bestimmte Art und Weise, die ich machen wollte. |
| Aber es war nicht allzu schwierig. Und genau das macht mein Skript. Und wenn Sie Complex Pie ausführen, gibt es das Rezept für diesen Kuchen. Sie öffnen den Complex Pie Maker. Dann fügen Sie einige Zutaten hinzu. Zuerst müssen Sie die Anzahl der Formen angeben. |
| Und dann, ob Sie es zentrieren, entweder oben oder etwas seitlich. |
| Dann gibt es eine Variable für die Glätte. |
| Und dann möchten Sie auch den Innenradius angeben, ob Sie mehr oder weniger Füllung wünschen, und den Außenradius. |
| Der nächste Schritt besteht natürlich darin, das Skript auszuführen. Es generiert |
| diese |
| Shape-Dateien für Sie und führen Sie auch einen Beispieltest durch, genau wie der benutzerdefinierte Kreis-Maker oder das benutzerdefinierte Karten-Add-In. Hier ist also ein Beispiel für einen komplexen Kreis für fünf und Formen sind fünf |
| und die Glätte auf sieben einzustellen. Sie könnten fünf oder sechs verwenden und das wäre wahrscheinlich immer noch in Ordnung, wenn sie |
| wirklich klein gezeichnet. Die Größe spielt keine große Rolle. Es kommt eher auf den relativen Innenradius und Außenradius an. Und das ist ungefähr das, was Dr. Mayfield vorhatte, also blieb ich bei vier für den Innenradius und neun für den Außenradius. |
| Sehen wir uns also an, wie wir diese Dinge tatsächlich verwenden können. Genau wie bei der Big Class-Demo müssen wir ... wir müssen die Säulen stapeln. Aber ein Unterschied besteht darin, dass ich die Stärke- und Gesundheitsvariablen nicht wirklich in meiner Shape-Datei habe. Sie sind eigentlich |
| In der Shape-Datei heißen sie Keil 1, 2, 3 und |
| Center. |
| Ich muss also ein |
| Datei, die |
| Verknüpfen Sie die beiden miteinander. |
| Als erstes habe ich dieses Beispiel einer kleinen Schule, |
| Dies habe ich erreicht, indem ich die Spalten für Gesundheit, Stärke und Geschwindigkeit übereinander gestapelt habe. |
| Und hier ist die Shape-Datei, die ... die Shape-Datei mit dem Namen, die ich verwenden werde. |
| Beachten Sie, dass es eine Spalteneigenschaft hat |
| der Kartenrolle, |
| richtig, Rollendefinition der Karte. |
| Und das ist erforderlich, wenn Sie Ihre eigenen benutzerdefinierten Formen erstellen. |
| Die verknüpfte Datei, die zu formenden Kartenspalten, habe ich im Wesentlichen erstellt, indem ich die Beschriftungen in meiner |
| gestapelte Datei. |
| Und dann habe ich in einer anderen Spalte, „Formname“, die Formen und die Formnamen aufgelistet. |
| Nun ist es wichtig, dass der Formname hier |
| habe eine Eigenschaft, die eine Kartenrolle ist, aber diese ist die Verwendung eines Formnamens. |
| Und diese Datenbeschriftungsspalte verfügt über eine Link-ID, sodass sie virtuell wieder mit meiner gestapelten Tabelle verknüpft werden kann. |
| Nachdem ich nun alle Tabellen eingerichtet habe, |
| Als nächstes müssen Sie eigentlich ein Diagramm erstellen. |
| Jetzt ist es ähnlich wie vorher. Der einzige Unterschied besteht darin, dass ich jetzt nicht einfach die Beschriftung nach unten zur Kartenform ziehe, sondern diese virtuelle Verbindungsspalte verwende, sie nach unten zur Kartenform ziehe und die gewünschte Form habe. Als Nächstes muss ich die Daten zur Farbspalte hinzufügen. |
| Und dann fügen Sie Namen zum Wrap hinzu. Und da sind alle meine Fische mit |
| eine Grafik für jeden. Um zu versuchen, den richtigen Farbverlauf zu erhalten, gehe ich hier auf „Farbverlauf“ und das ist dieser hier. |
| Ich möchte sicherstellen, dass das Grün gut ist, also werde ich die Farben umkehren. |
| Und da haben wir es. Das ist die |
| nützliche Karte an sich, denn man kann sich jeden Fisch ansehen und sehen, wie es ihm geht. Aber ich möchte damit natürlich noch ein bisschen mehr machen. |
| Ich möchte diese Bilder in einen Tooltip einfügen können. |
| Um das zu tun, machen wir eine Datentabelle daraus. |
| Bringen Sie die Datei zurück, die ich hatte, und diese Grafik. |
| Hier wird unter dem roten Dreieck ein Eintrag zur Datentabelle angezeigt. Dies erzeugt eine neue Datentabelle. |
| mit all diesen Bildern, und das ist wirklich nützlich, besonders wenn wir es zurückverlinken. Und ich würde das umdrehen und als Link-ID festlegen, damit ich von meiner einfachen kleinen Schuldatei darauf verweisen kann, sodass ich jeden Marker habe und das Diagramm für jedes Zeichen finden kann. |
| Okay, ich habe das also in einer anderen Datei gespeichert und werde diese öffnen. Ich habe es „Gesundheitsbilder“ genannt. |
| Das brauchen wir also nicht mehr. |
| Und wir brauchen die gestapelte Datei nicht mehr. |
| Was wir aber brauchen, ist das Beispiel der kleinen Schule, mit dem ich begonnen habe. |
| Das erste, was Sie tun müssen, damit diese in der |
| Graph ist, diese Bildspalte, diese virtuelle Spalte zu setzen, |
| wie beschriftet. |
| Sie können dies auch in einem einfachen Diagramm tun. |
| Wir haben also schon ein Beispiel... also, ich werde das noch einmal öffnen. Warum nicht? Mein Rennskript, nur um Ihnen zu zeigen, dass ich von vorne anfange. Aber da ich diese Spalte beschriftet habe, erhalten Sie jetzt, wenn ich mit der Maus über eine dieser Grafiken fahre, ein... die drei |
| Informationen für diese Grafik und Sie können das tun und eine beliebige Anzahl dieser Zeichen anheften. |
| Das ist also eine Möglichkeit, wie Sie diese Grafiken verwenden können. |
| Eine andere Möglichkeit besteht darin, es als Marker zu verwenden. |
| Und die Grafiken, die Sie erhalten, schweben über den Punkten und werden anstelle der Rautenformen verwendet, die ich vorher hatte. |
| Ich werde diese Gesundheitsbilder zurückbringen, kleine Schule, und ich werde sogar diese Grafik zurückbringen. |
| Wir haben jetzt also diese Diamanten. Um sie in diese Formen hier zu bringen, |
| Wir mussten noch einen weiteren hinzufügen |
| Abzeichen zu dieser virtuellen Join-Spalte. Es wird immer beliebter, also verwenden Sie es als Markierung. Und so wird ein neues Abzeichen angezeigt. Und hinter mir, |
| Sie werden sehen, dass diese Bilder in die Szene eingefügt wurden. Ein letztes Detail ist, dass mir dieses Weiß um das Bild herum nicht wirklich gefällt. Und das ist tatsächlich in das Grafikbild eingebaut. |
| Und eine Möglichkeit, das zu erreichen, ist, dass es ein Skript gibt, das den weißen Bereich findet und den Alphakanal so einstellt, dass er transparent wird. Jetzt haben wir also Diagramme mit einem schönen |
| runde Form, nicht der quadratische Hintergrund. Sie können auch die Markierungsgröße erhöhen. |
| Und wir können bis 11 gehen. |
| Wie sieht das aus? Das sieht ziemlich genau so aus, wie ich es hatte; 10 wäre wahrscheinlich besser gewesen. Aber ich gehe gerne zu 11. Okay, das ist also |
| Verwendung von Markern. Wir möchten ein etwas komplizierteres Diagramm erstellen. Und genau das wollte Dr. Anderson Mayfield erreichen: eine Heatmap hinter den Markern. Und das ist ziemlich kompliziert, aber JMP kann damit umgehen. Das ist eigentlich eine Kontur. |
| Ich habe hier also eine andere Version der kleinen Schule. Aber dieses Mal habe ich Meerestemperaturen |
| ganz unten |
| und sie werden ausgeblendet, sodass sie nicht als tatsächliche Punkte angezeigt werden. |
| Also habe ich bereits Bilder hierfür erstellt. |
| Eigentlich dieselben Bilder, die ich zuvor erstellt habe. |
| Und ich beginne mit |
| das Ende hier, damit wir tatsächlich sehen können, was ich vorhabe. Also im Grunde möchte ich diese Grafiken haben |
| Schweben Sie über der Kontur und hier sind ein paar Legenden, die zeigen, was die Dinge sind. |
| Das sollte nicht allzu schwer sein. Ich beginne teilweise mit einer bereits eingefügten Karte und den Breiten- und Längengraden auf den X- und Y-Koordinaten. |
| Das erste, was ich tun möchte, ist, eine Kontur hinzuzufügen. |
| Und wir müssen ein bisschen Farbe hinzufügen, also ziehe ich die temporäre Rolle über die Farbrolle und passe die Anzahl der Ebenen dieser Kontur an. |
| Ändern Sie das Alpha ein wenig und fügen Sie etwas Glätte hinzu. |
| Als nächstes möchte ich es ein wenig transparent machen. |
| Geben wir dem eine 0,6. |
| Das ist ungefähr dasselbe wie vorher. Und um jetzt die Markierungen hinzuzufügen, gibt es zwei Möglichkeiten. Sie können die Umschalttaste gedrückt halten und auf die Punkte klicken oder sie einfach hineinziehen. Um sie hineinzuziehen, |
| Anschließend können Sie die Markergröße erneut einstellen, |
| tun Sie dies durch |
| Ich gehe hierhin und mache „anderes“ und lass uns dieses Mal 10 verwenden. Ich denke, 11 war einfach ein bisschen zu groß. Also gut, das sieht gut aus. Das ist fast geschafft. Wir wollen an dieser Legende arbeiten. Wie bekommen wir diese Farben dort hinein? Nun, wir haben bereits die Gesundheitsrolle. |
| Und das können Sie hier in die Ecke ziehen. Fügen Sie einfach eine zweite Farbrolle hinzu. Das bringt Ihr Diagramm zunächst ein wenig durcheinander. |
| Darum können wir uns kümmern. Das Problem ist, dass die Kontur die Gesundheitsrolle nicht wirklich nutzen muss. Wenn wir das also deaktivieren, sind wir wieder bei dem, was wir wollen. |
| Als Nächstes möchten Sie der eigentlichen Legende hier die Farbe hinzufügen. Und wir können das einfach wieder anpassen, wie wir es zuvor getan haben. |
| Diesmal werden wir etwas mehr machen. Ich möchte vier Etiketten haben. |
| Ich möchte, dass es um fünf Uhr beginnt und bis |
| 20. |
| Oh, ich wollte die Farben auch umkehren. |
| Da haben wir es, sieht ziemlich genau so aus, also fast fertig. Ich möchte es nur noch ein bisschen verschönern. Es gibt ein paar Dinge in der Legende, die ich gerne verbessern würde. |
| Gehen Sie also zu den Legendeneinstellungen und entfernen Sie die Dinge, die nicht viel zu bringen scheinen, und verschieben Sie die Gesundheitslegende nach oben. |
| Da haben wir es. Ich denke also, dass ich das, was ich wollte, so gut wie möglich erreiche. |
| Damit kann ich das loswerden. Ich glaube nicht, dass das noch alle brauchen. |
| Aber ich möchte noch etwas hinzufügen. |
| Wie wäre es, diese Legende hinzuzufügen, denn es gab keine Möglichkeit herauszufinden, welcher Bereich dieser Grafik was bewirkte, also Hunger, Geschwindigkeit, Kraft und Gesundheit. Zum Glück haben wir das |
| Zuordnungsdatei. Sie reicht vom Spaltennamen bis zur Form. |
| Und ich werde das jetzt kurz erläutern. |
| Sie können hier sehen, dass ich alle Zeilen beschriftet habe und auch die Datenbeschriftungsspalte. Das bedeutet, dass, wenn Sie ein Diagramm erstellen, |
| es wird alles beschriftet. Das ist also wirklich einfach. Sie nehmen einfach den Formnamen und ziehen ihn in die Kartenrolle, und schon sind wir mit dieser Grafik fertig. |
| Wenn ich das also in meine Szene einfügen möchte, wähle ich es am besten einfach aus, klicke auf das Pluszeichen und kopiere es dann. |
| Dann öffnen Sie ein Bildbearbeitungsprogramm und speichern es auf der Festplatte. Und das habe ich natürlich schon getan. Also werde ich |
| zeigen, sobald Sie das haben, und ich muss meine Grafik wieder zurückbringen, |
| wow, das kann ich einfach reinziehen. |
| Und da ist es. Oh, da ist es nicht. Es gibt aber eine Möglichkeit, es zu finden. Gehen Sie zu „Anpassen“. Es wurde in den Hintergrund verschoben, denn normalerweise ziehen Sie ein Hintergrundbild hinein, wenn Sie ein Bild hineinziehen. |
| Alles was wir jetzt tun müssen... lasst uns das aus dem Weg räumen, damit ihr sehen könnt, was passiert... ist, es nach vorne zu bringen. Hier kommt es |
| und los geht’s. Es ist vorne. Und ich würde hier eigentlich gerne ein bisschen Transparenz hinzufügen, weil es für meinen Geschmack ein bisschen zu hell ist. |
| Setzen wir also 0,8. |
| Und jetzt müssen wir es nur noch in die Ecke ziehen und dann sind wir im Grunde fertig. |
| Okay, es gab also eine Menge und es waren viele Dateien beteiligt. Fassen wir also alle verwendeten Dateien zusammen. Ich habe meinen komplexen Pie-Maker verwendet, um die beiden benötigten Kartendateien, Shape-Dateien, zu generieren. Ich habe die kleine Schule genommen und sie gestapelt. |
| Ich habe diese Spalte erstellt, um eine Mapping-Datei zu formen, die auf die Namensdatei mit der Map-Rolle verweisen musste. Ich habe eine Link-Referenz verwendet, um einen virtuellen Join zurück zu Small School Stacked durchzuführen. |
| Dann habe ich eine Grafik erstellt, die ich in eine Datentabelle umwandeln und in meinen health images.jmp speichern wollte. |
| Das musste natürlich virtuell wieder an die ursprüngliche kleine Schule angefügt werden, damit ich damit die Grafik erstellen konnte. |
| Und dann habe ich dasselbe mit den Meerestemperaturen kleiner Schulen gemacht, mein Link verweist auf Gesundheitsbilder. |
| Ich habe nur... ich habe meine Spalte in eine Shape-Datei übertragen und die Legende für die Grafik gezeichnet, die ich mit den Meerestemperaturen erstellen wollte, und ich habe... ich verwende das im Grunde einfach, indem ich es hineingezogen habe. |
| Das war's also mit den 2D-Demonstrationen, die ich machen wollte. Machen wir hier eine kleine Verschnaufpause und gehen jetzt in die Welt von 3D und sogar ins Web. |
| Anwendung. |
| Okay. |
| Dies ist also meine Web-Anwendung für 3D-Streudiagramme. |
| Und ich werde Ihnen zeigen, wie ich Daten von JMP dort hineinbekommen habe. |
| Meine Anwendung basierte auf dem Scatterplot 3D von JMP. Dies soll Sie nur daran erinnern, wie das aussieht. |
| Und jetzt habe ich eine kleine Demo davon. |
| Im Grunde hatte es also... Ich werde Ihnen einige der Funktionen zeigen, angefangen mit der Möglichkeit, verschiedene Datensätze auszuwählen. Hier ist der Diamanten-Datensatz. |
| Und natürlich diese Zeichenpunkte. Das ist die ganze Idee. Und sie werden in Form dieser kleinen Kugel gezeichnet. Ich erkläre gleich, wie das geht. |
| Sie können es aber auch wie in JMP drehen, zoomen und vor- und zurückschieben. |
| Und dann hat es auch Hover-Labels. Sie können sehen, dass ich in der unteren rechten Ecke Achsen und ein Raster zeichne und ein wenig Anpassung hinzufüge. Nicht zu viel. |
| Sie können den Hintergrund ändern und die Farbe der Wände festlegen. Mal sehen, ob wir ihm ein wenig Blau verleihen können. |
| Ja, vielleicht gefällt Ihnen das nicht. Aber das ist nur eine Demo. Und dann können Sie die Größe der Markierungen ändern. |
| Das steht im Internet. |
| Okay, als ich diese Anwendung gestartet habe, wollte ich als Erstes wissen, ob sie im Web funktioniert. Würde sie auf meinem iPhone oder meinem iPad gut funktionieren? |
| Weil diese Maschinen nicht so leistungsstark sind wie mein Desktop. Also habe ich eingebaute 3D- oder drei zufällige Datensätze mit steigender Anzahl von Punkten erstellt. Ich habe einen verwendet... |
| Ich dachte, dass es bei Geräten mit geringerer Leistung einen Versuch wert wäre, 25.000 zu erreichen, aber bei Geräten mit hoher Leistung ist tatsächlich eine viel höhere Leistung möglich. |
| Dann dachte ich, ich sollte versuchen, einige echte Daten einzubringen, und ich fand den berühmten Iris-Datensatz, und er lag im CSV-Format (Comma Separated Variable) vor. |
| Und ich habe es importiert. Aber ich musste etwas Code schreiben, um es in meine internen Strukturen zu konvertieren. |
| Und ich dachte, JMP hat eine Menge Datensätze. Ich würde lieber nur diese einbinden. Also habe ich Autos, Diamanten und Zytometrie eingebunden. Der einzige Unterschied war die Zytometrie, sie hatte nicht wirklich eine gute |
| Kategorie für die Verwendung von Farbe und sie mussten meine Anwendung tatsächlich ändern, um ein Diagramm zu akzeptieren, das keine Farbe hatte. |
| Die Anwendung ist also ziemlich einfach. Es gibt nur eine... es ist eine einseitige Webanwendung. Es gibt also eine HTML-Datei. Ich habe ein paar JavaScript-Dateien und verwende einige Bibliotheken von Drittanbietern sowie eine Schriftart und eine Textur. Die Textur ist der Ball, der für die Formen verwendet wird. |
| Die Technik, die ich aus der Spieleindustrie verwende, sind Partikel oder Partikelsysteme. Sie werden sehr häufig für Simulationsspiele und 3D-Visualisierungen verwendet. Man kann damit coole Effekte wie Feuer, Rauch, Feuerwerk und Wolken erzeugen. |
| Und ich hatte in der Vergangenheit einige Zeit an einer kommerziellen Game-Engine gearbeitet und meine Aufgabe bestand eigentlich darin, das Partikelsystem zu übernehmen und es zu verbessern. |
| Ich hatte also schon einige Erfahrung damit. Ähm, das war in der C++-Welt, nicht in JavaScript. Aber da ich ziemlich lange an interaktivem HTML5 und JMP gearbeitet habe, dachte ich, es wäre an der Zeit zu sehen, ob ich es übernehmen kann. |
| zwei meiner Leidenschaften und vereinen sie und entwickeln eine webbasierte Version der Verwendung von Partikelsystemen. Ich hatte Glück. Ich fand diese Bibliothek, Three.js. |
| Es ermöglicht hardwarebeschleunigtes 3D-Zeichnen, verfügt über eine hervorragende Dokumentation und viele Codebeispiele, darunter auch Partikelsysteme, sodass sich meine Anwendung ganz leicht erstellen ließ. |
| Und der schwierigste Teil war für mich tatsächlich herauszufinden, wie ich die Daten aus JMP hineinbekomme. |
| Aber ich werde ... ich werde ein Skript dafür teilen. Das Einzige, was ich getan habe, ist sicherzustellen, dass ich die Verwendung dieser Objekte einfach gemacht habe |
| in meiner Anwendung. Ich habe einfach ein Array von JavaScript-Objekten erstellt und für die numerischen Spalten ein Minimum und ein Maximum hinzugefügt, sodass ich das nicht in JavaScript berechnen muss. Und natürlich ist JMP wirklich gut darin, solche Dinge zu berechnen. |
| Ähm, für die Kategorie, für die Farbspalte musste ich so etwas wie ein Kategorienwörterbuch verwenden. Und im Grunde genommen sind das nur die Namen der Kategorien in einer Liste und dann einfach mit einem nullbasierten Index auf diese Werte verweisen. So funktioniert diese Struktur. |
| Ich dachte, es wäre schön, eine Benutzeroberfläche zu erstellen. Und eigentlich war das ganz einfach. Ich zeige es Ihnen gleich. Aber im Grunde muss ich es nur auf numerische Spalten für x, y und z beschränken. |
| Und beschränken Sie es dann auf eine kategorische Spalte für die Farbrolle. |
| Schauen wir uns also diesen Code an. |
| Gut, ich gebe zunächst ein Beispiel für einen sehr einfachen Datensatz. |
| Und dann war der Dialog wirklich einfach zu erstellen. Ich verwende den Spaltendialog und gebe an, was ich für die numerischen Spalten und was ich für die Farbspalte möchte, und stelle sicher, dass der Modellierungstyp kategorisch ist, also ordinal und nominal. |
| Als nächstes nehme ich die Spaltendaten und erstelle die JavaScript-Objekte, die ich brauche. Hier sind die Min- und Max-Strings. Und das ist nur das Erstellen eines Strings dieser Objekte. |
| Und wenn es dann eine Farbspalte gibt, mache ich dasselbe. Das ist etwas komplizierter, weil ich diese Zeichenfolgen herausholen und in das JavaScript-Objekt einfügen muss. |
| Und dann muss es abschließend nur noch in einer Textdatei gespeichert werden. |
| Versuchen wir es also. |
| Natürlich werde ich Big Class verwenden, also ist es eine schöne kleine Datei. |
| Und |
| also führe ich das Skript aus. |
| Und ich wurde gefragt: „Was möchte ich für mein XYZ?“ Ich habe bereits Größe und Gewicht ausgewählt und das Alter ist eine numerische Spalte, also werde ich das auch verwenden und das Geschlecht ist eine gute Farbe. |
| Und dann sind wir fertig. Und tatsächlich sagt mir die Ausgabe hier, wo die Datei ist. |
| Das ist zufällig auf der nächsten Folie. Also lasst uns dorthin gehen. |
| Ich wette, Sie haben sich schon immer gefragt, wie Big Class in JavaScript aussehen würde. Und das ist es. Und so sehen Sie die drei |
| numerische Spalten mit Ihrem Minimum und Maximum, und dann enthält die Farbspalte dieses Wörterbuch mit F und M für die Kategorien, und die Null bedeutet weiblich und die Eins bedeutet männlich. Nun, das ist mein spannender Abschluss dieses Vortrags, ich hoffe, es hat Ihnen gefallen. |
| Vielen Dank also fürs Zuschauen. Wenn Sie Fragen haben, stellen Sie sie bitte. |