Lautsprecher | Transkript |
| jopowe | Hallo, willkommen zu meinem Vortrag. |
| Die Motivation für diesen Vortrag basierte auf einer Diskussion in der JMP User Community. Dr. Anderson Mayfield ist Meeresbiologe an der NOAA und der University of Miami. |
| Er untersucht die Gesundheit von Riffkorallen. Er präsentierte in unserer Sonderfolge zum Tag der Erde von JMP On Air. Und er hält auch einen Vortrag auf dieser Konferenz. |
| In diesem Beitrag der JMP-Benutzergemeinschaft hat er dieses Bild hier gepostet. Und wenn Sie es sehen könnten, gibt es all diese Grafiken, die Korallen oder Korallenriffe darstellen |
| und sie stellen mehrere Datenelemente dar, alle in einer kleinen Grafik, was ein bisschen wie ein Videospiel ist, wenn man Spielerstatistiken hat |
| und sie schweben um den Spieler herum, während er durch die Szene rennt. Jetzt verstehen Sie wahrscheinlich, warum ich meinen Vortrag „Was bekommen Sie, wenn Sie ein Videospiel, einen Meeresbiologen und JMP kombinieren“ genannt habe? Also lasst uns weitermachen. |
| Worüber ich sprechen werde, sind diese spielbasierten oder spielinspirierten Lösungen, 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 für das grafische Skript. |
| Und hier ist ein Beispiel für die Verwendung benutzerdefinierter Karten. Und hier ist meine 3D-Streudiagrammanwendung. |
| Also lasst uns anfangen. Um zu sehen, wie benutzerdefinierte Grafikskripte verwendet werden, habe ich hier ein kleines Beispiel. |
| Und wenn ich JMP öffne und starte |
| diese kleine Grafik, und tatsächlich werde ich darüber sprechen. |
| Ich verwende diesen fiktiven Datensatz, den ich von Grund auf erstellt habe. Und es geht im Grunde um ein Fischrennen, das vom Great Barrier Reef bis nach Sydney reicht. |
| Um also zu den Grafikskripten zu gelangen, können Sie diese anpassen. |
| Und dann können Sie mit dieser kleinen Plus-Schaltfläche ein neues Skript hinzufügen. Es beginnt leer, aber wir haben ein paar Beispiele in JMP. |
| Daher gefällt mir das Polygon-Skript. Es ist sehr einfach. Es zeichnet lediglich ein Dreieck. Wenn ich das also auf mein Diagramm anwende, sehen Sie dort ein Dreieck. |
| Und wir brauchten dafür nur drei Linien, die Transparenz festzulegen, eine Füllfarbe festzulegen und dann das Polygon zu zeichnen. |
| Aber wir fragen uns: Wie bettet man das eigentlich in ein Skript ein? Der einfachste Weg, dies herauszufinden, besteht darin, auf die Schaltfläche „Antworten“ zu klicken |
| und Sie speichern das Skript im Skriptfenster. Und hier ist das Drehbuch. Es beginnt damit, dass meine kleine bivariate Plattform mit Breiten- und Längengraden gestartet wird. Und unten gibt es einen Versand mit einem Skript zum Hinzufügen von Grafiken. |
| Und dann die drei Zeilen des Beispiels. |
| Es gibt also ein wirklich einfaches Beispiel für die Verwendung eines Grafikskripts. |
| Das ist nun ein grafisches Skript, das ich einbetten werde. Es zeichnet diese Balken schwebend über jedem Punkt. |
| Und was ich in dieser Anwendung zuerst mache, stelle ich auch die Transparenz ein und zeichne dann einen Hintergrund für meine kleine Grafik. |
| einer für den Hunger, einer für die Kraft und einer 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 die Farbgestaltung und den Hintergrund sowie einige Dinge wie den Hintergrund eingerichtet habe. |
| Das ist meine Funktionszugleiste. Es braucht eine Position, eine Länge und eine Farbe. Das kann also für jeden Balken verwendet werden. Wenn ich also dieses Skript ausführe. |
| Da ist es, Sie haben die Grafik mit dem Kleinen |
| Eine Art von Wildtieren inspirierter Gesundheitsmonitor, der über jedem Fisch schwebt, während er hinunterschwimmt und die ostaustralische Strömung hinunter nach Sydney rast. |
| Dies wird Ihnen im Grunde Schritt für Schritt eine Vorstellung davon geben, wie diese Funktion funktioniert. Wir begannen mit nur einer Markierung auf dem Bildschirm und legten für jede Markierung den Pixelursprung fest. |
| Und dann fangen wir an, den Hintergrund zu zeichnen, aber das erfordert ein paar Schritte. Wenn wir die Linienstärke zum ersten Mal einstellen, sieht man eigentlich nichts. |
| Dann legen wir die Farbe fest, die schwarz sein wird. Und dann bewegen wir uns zu und ziehen eine Linie dorthin, um den Hintergrund und eine sehr dicke Linie zu zeichnen. |
| Und für jeden Balken legen wir die Farbe des Balkens fest, bewegen uns zur Position und ziehen dann eine Linie dorthin. Dann zeichnen wir den Hintergrund, legen seine Farbe fest und setzen den Balken fort. Und das machen wir natürlich auch für die anderen beiden Linien. |
| Jetzt können Sie viele verschiedene Grafikfunktionen nutzen. Und hier ist der Abschnitt mit den grafischen Funktionen der JSL-Syntaxreferenz, und Sie können alles erstellen, was Sie wollen. Also 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 der zweite benennt die Formen in der Tabelle. |
| Und für diese Namensspalte müssen Sie im Grunde eine Kartenrollenspalteneigenschaft hinzufügen, und diese muss vom Typ „Shape-Namensdefinition“ sein. Das zeige ich dir gleich. |
| Um ein wirklich einfaches Beispiel zu geben: Was wir brauchen, ist natürlich Big Class. Und ich werde ein wirklich einfaches haben. |
| Karte dafür, die nur zwei Rechtecke hat. Lassen Sie mich diese Dateien öffnen. |
| Es handelt sich also, wie gesagt, um eine sehr kleine Karte. Und nur um Ihnen diese Koordinaten zu zeigen, habe ich ein wenig |
| Skript hier, das im Grunde 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 Angaben geben das Gewicht an, die unteren Angaben die Höhe. Und wenn Sie sich die Spalteneigenschaft ansehen, |
| Es ist die Kartenrolle, die Definition des Formnamens. |
| Sobald wir diese Karte fertig haben, können wir Big Class eröffnen. |
| Wir können es nicht direkt wiederverwenden. Zuerst müssen wir die Spalten für Größe und Gewicht nehmen und sie stapeln. Also gehen wir zu den Tischen. Lass mich sie stapeln. |
| Und jetzt habe ich eine Tabelle, in der diese Spalten gestapelt sind. |
| Sie sehen, dass die Beschriftung abwechselnd Höhe und Gewicht aufweist. Um dies mit der Kartendatei zu verknüpfen, müssen wir eine weitere Spalteneigenschaft hinzufügen. |
| Das hier ist ganz unten, wieder Kartenrolle. Aber wir werden nicht von der Definition geformter Namen sprechen, sondern von der Verwendung geformter Namen, und wir müssen die auswählen |
| Kartendatei, die Namenskartendatei. |
| Und stellen Sie auch die Spalte auf einen Namen ein. |
| Und dann sind wir fertig. Da wir das nun haben, kann ich es tatsächlich in einem Diagramm verwenden. |
| Das Diagramm, das wir anstreben, verwendet im Wesentlichen die Beschriftungsspalte für die Kartenform, die die oberen und unteren Formen festlegt, und dann können wir die Datenspalte mit allen Daten hineinziehen |
| in die Farbrolle. Und da haben wir es, dies ist eine Zusammenfassung aller Schüler der großen Klasse, die wir aber unbedingt haben wollen |
| eine pro Schüler. Wenn ich das in die Wrap-Rolle ziehe, ist es etwas eng, aber ich werde es verteilen, indem ich eine Ebene pro Zeile mache und diese auf 10 stelle. |
| Na, bitte. Und genau das wollte ich auch erreichen. Und das kann eine nützliche Grafik sein |
| von allein. |
| Lassen Sie uns jetzt etwas Komplizierteres tun. |
| Nun ja, wenn Sie etwas Komplizierteres tun, möchten Sie vielleicht das benutzerdefinierte Kartenerstellungs-Add-In verwenden. |
| Und das ist eine tolle Ergänzung. Sie können damit ein Bild hineinziehen und es dann nachzeichnen. |
| Und wenn Sie mit dem Nachzeichnen aller Formen fertig sind, klicken Sie auf „Mit Zufallsdaten fertigstellen“ und es wird generiert |
| die beiden benötigten Formdateien sowie einen Zufallsdatensatz, mit dem Sie Ihre benutzerdefinierte Karte testen können. Und hier ist eine, bei der ich gerade vier Variablen und eine in der Mitte erstellt habe. Es ist also im Grunde eine quadratische Version dessen, was Sie auf der Originalfolie gesehen haben, die ich hatte. |
| Nun, das war nicht genau das, wonach wir streben. Wir wollten etwas Rundes, und ich glaube, es war Dr. Mayfield, der es als komplexen Kuchen bezeichnete. |
| Ich weiß nicht, ob das ein offizieller Begriff ist, aber ich habe beschlossen, diese Dinge mit Skripten zu erstellen. |
| Ich wollte also Formdateien erstellen und sicherstellen, dass ich das bekam, was der Arzt verordnet hatte. Und das waren vier Formen mit etwas in der Mitte. |
| Und dann dachte ich: Na ja, ich bin Programmierer. Ich mag es, etwas mehr zu machen und etwas flexibler zu sein. |
| Deshalb dachte ich, vielleicht würden einige Leute das Gleiche tun wollen, aber nur zwei Variablen plus eine Durchschnitts- oder Mittelvariable oder mehr haben. |
| Und ich dachte, es wäre vielleicht schön, auch verschiedene Formen wie eine Raute oder ein Quadrat 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 diesen Polarplot in JMP erstellen kann. |
| Und hier kommt es. |
| Da gehen wir und |
| Sie waren auf der Suche nach einer Form wie dieser, die dem, was ich brauchte, sehr ähnlich sah. |
| Was Xan gemacht hat, war wirklich großartig. Es ist ein flexibles Skript, das dies tut und diese Keile um einen Kreis herum generiert, aber das Einzige, was fehlte, war die Mitte 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. Zunächst müssen Sie die Anzahl der Formen angeben. |
| Und dann, ob Sie es zentrieren wollen, entweder oben oder etwas seitlich. |
| Dann gibt es eine Variable für die Glätte. |
| Und dann möchten Sie auch den Innenradius (unabhängig davon, ob Sie mehr oder weniger Füllung wünschen) und den Außenradius angeben. |
| Der nächste Schritt besteht natürlich darin, das Skript auszuführen und es wird generiert |
| diese |
| Erstellen Sie Shape-Dateien für Sie und führen Sie auch einen Beispieltest durch, genau wie der benutzerdefinierte Kuchen-Maker oder das benutzerdefinierte Karten-Add-In. Hier ist ein Beispiel für einen komplexen Kuchen für fünf und die Form ist fünf |
| und die Glätte auf sieben einstellen. Sie könnten fünf oder sechs verwenden, und das wäre wahrscheinlich immer noch in Ordnung, wenn sie es wären |
| sehr klein gezeichnet. Die Größe spielt eigentlich keine 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. |
| Schauen wir uns also an, wie wir diese Dinge tatsächlich nutzen können. Genau wie bei der Big Class-Demo müssen wir ... wir müssen die Spalten stapeln. Was jedoch anders ist, ist, dass ich die Kraft- und Gesundheitsvariablen nicht wirklich in meiner Formdatei habe. Das sind sie tatsächlich |
| In der Formdatei heißen sie Keil 1, 2, 3 und |
| Center. |
| Also muss ich eine bauen |
| Datei, die wird |
| verbinde beides miteinander. |
| Also zuerst habe ich dieses gestapelte kleine Schulbeispiel, |
| Was ich geschafft habe, indem ich die Spalten „Gesundheit“, „Stärken“ und „Geschwindigkeit“ gestapelt habe. |
| Und hier ist die Formdatei, die ... die Namensformdatei, die ich verwenden werde. |
| Beachten Sie, dass es eine Spalteneigenschaft hat |
| der Kartenrolle, |
| rechts, Rollendefinition zuordnen. |
| Und das ist erforderlich, wenn Sie Ihre eigenen benutzerdefinierten Formen erstellen. |
| Die verknüpfte Datei, die die zu formenden Kartenspalten enthält, habe ich also im Wesentlichen erstellt, indem ich die darin enthaltenen Beschriftungen aufgelistet habe |
| gestapelte Datei. |
| Und dann habe ich in einer anderen Spalte, Formname, die Formen und Formnamen aufgelistet. |
| Nun ist es wichtig, dass hier der Name der Form angegeben wird |
| haben eine Eigenschaft, die eine Kartenrolle ist, aber diese ist die Verwendung von Formnamen. |
| Und diese Datenbeschriftungsspalte wird eine Link-ID haben, sodass sie virtuell wieder mit meiner gestapelten Tabelle verknüpft werden kann. |
| Nachdem ich nun alle Tische eingerichtet habe, |
| Als nächstes müssen wir tatsächlich ein Diagramm erstellen. |
| Jetzt wird es ähnlich sein wie zuvor. Der einzige Unterschied besteht darin, dass ich nicht nur die Beschriftung nach unten auf die Kartenform ziehe, sondern jetzt diese virtuell verbundene Spalte verwende, diese nach unten in die Kartenform ziehe und schon habe ich die gewünschte Form. Als nächstes muss ich die Daten zur Farbspalte hinzufügen. |
| Und fügen Sie dann einen Namen zum Umschließen hinzu. Und da sind alle meine Fische dabei |
| jeweils eine Grafik. Um zu versuchen, den richtigen Farbverlauf zu erhalten, gehe ich hier zu 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. Dies ist das |
| Eine nützliche Karte für sich, da Sie sich jeden Fisch ansehen und sehen können, 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. |
| Dazu erstellen wir eine Datentabelle. |
| Bringen Sie die Datei, die ich hatte, und die Grafik zurück. |
| Was es hier also bewirken wird, ist, dass sich unter den Männern mit dem roten Dreieck eine Datentabelle befindet. Und was dies bewirken wird, wird eine neue Datentabelle erzeugen |
| mit all diesen Bildern, und das ist wirklich nützlich, besonders wenn wir es zurückverknüpfen. Und ich würde das umdrehen und es als Link-ID festlegen, damit ich in meiner einfachen kleinen Schuldatei darauf verweisen kann, sodass ich jede Markierung haben und die Grafik für jedes Zeichen finden kann. |
| Okay, ich habe das tatsächlich in einer anderen Datei gespeichert und werde diese öffnen. Ich nannte es Gesundheitsbilder. |
| Wir brauchen das also nicht mehr. |
| Und wir brauchen die gestapelte Datei nicht mehr. |
| Aber was wir brauchen, ist das kleine Schulbeispiel, mit dem ich angefangen habe. |
| Das Erste, was Sie nun tun müssen, damit diese im angezeigt werden |
| Das Diagramm besteht darin, diese Bildspalte, diese virtuelle Spalte festzulegen. |
| wie beschriftet. |
| Sie können dies auch in einem einfachen Diagramm tun. |
| Wir haben also bereits ein Beispiel ... nun, ich werde das noch einmal öffnen. Warum nicht? Mein Rennskript, nur um Ihnen zu zeigen, dass ich bei Null anfange. Aber da ich diese Spalte beschriftet habe, werden, wenn ich jetzt mit der Maus über eine dieser Grafiken fahre, ... die drei angezeigt |
| Fügen Sie Informationen für diese Grafik hinzu und Sie können dies tun und eine beliebige Anzahl dieser Zeichen anheften. |
| Das ist also eine Möglichkeit, diese Grafiken zu verwenden. |
| Eine andere Möglichkeit ist die Verwendung von Markern. |
| Und die Grafiken, die Sie erhalten, schweben über den Punkten und werden anstelle der Rautenformen verwendet, die ich zuvor hatte. |
| Ich werde diese Gesundheitsbilder zurückbringen, kleine Schule, und ich werde sogar diese Grafik zurückbringen. |
| Im Moment haben wir also diese Diamanten. Um sie hier in diese Formen zu bringen, |
| wir mussten noch einen hinzufügen |
| Abzeichen für diese virtuelle Join-Spalte. Es erfreut sich immer größerer Beliebtheit und wird daher als Marker verwendet. 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 Diagrammbild integriert. |
| Und eine Möglichkeit, das zu erledigen, besteht darin, dass es ein Skript gibt, das diesen weißen Bereich findet und den Alphakanal so einstellt, dass er ihn transparent macht. Jetzt haben wir also Diagramme mit einem schönen |
| runde Form, nicht der quadratische Hintergrund. Möglicherweise möchten Sie 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 bis 11. Okay, das ist es |
| Verwendung vom Marker. Wir wollen ein etwas komplizierteres Diagramm erstellen. Und genau das wollte Dr. Anderson Mayfield erreichen: eine Heatmap hinter den Markierungen. Und das ist ziemlich kompliziert, aber JMP kann damit umgehen. Das ist eigentlich eine Kontur. |
| Eine Sache, die ich hier habe, ist also eine andere Version einer kleinen Schule. Aber dieses Mal habe ich Meerestemperaturen |
| ganz unten |
| und sie sind ausgeblendet, sodass sie nicht als tatsächliche Punkte angezeigt werden. |
| Deshalb habe ich bereits Bilder für dieses erstellt. |
| Eigentlich die gleichen Bilder, die ich zuvor erstellt habe. |
| Und ich fange damit an |
| Das Ende hier, damit wir tatsächlich sehen können, was ich vorhabe. Daher möchte ich grundsätzlich diese Grafiken haben |
| Schweben über der Kontur und ein paar Legenden hier, die zeigen, was die Dinge sind. |
| Das sollte nicht allzu schwer sein. Ich beginne einen Teil des Weges mit einer bereits platzierten Karte und Lat-Längen bereits auf der x- und y-Achse. |
| Als erstes möchte ich also eine Kontur hinzufü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 auf 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 .6. |
| Das ist ungefähr das Gleiche wie das, was ich vorher hatte. Und um nun die Markierungen hinzuzufügen, gibt es zwei Möglichkeiten, dies zu tun. Sie können bei gedrückter Umschalttaste auf die Punkte klicken oder sie einfach hineinziehen. Um es hineinzuziehen, |
| Anschließend können Sie die Markierungsgröße erneut festlegen. |
| das tun durch |
| Gehen Sie hierher und machen Sie andere und verwenden Sie dieses Mal 10. Ich denke, 11 war einfach etwas zu groß. Okay, das sieht also gut aus. Das ist fast geschafft. An dieser Legende wollen wir arbeiten. Wie bekommen wir diese Farben da rein? Nun, wir haben bereits die Gesundheitsrolle. |
| Und das können Sie direkt hierher in die Ecke ziehen, indem Sie einfach eine zweite Farbrolle hinzufügen. Bringt Ihr Diagramm anfangs irgendwie durcheinander. |
| Wir können uns darum 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 also die Farbe hier zur eigentlichen Legende hinzufügen. Und wir können das einfach wieder anpassen, wie wir es zuvor getan haben. |
| Wir werden dieses Mal noch ein bisschen mehr machen. Ich möchte vier Etiketten haben. |
| Ich möchte, dass es um fünf beginnt und bis zu geht |
| 20. |
| Oh, ich wollte auch die Farben umkehren. |
| Da haben wir es, es sieht ungefähr 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 korrigieren würde. |
| Gehen Sie also zu den Legendeneinstellungen und entfernen Sie die Dinge, die nicht allzu viel hinzuzufügen 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 ich das loswerden kann. Ich glaube nicht, dass das alle mehr brauchen. |
| Aber ich möchte noch ein bisschen mehr hinzufügen. |
| Wie wäre es mit dem Hinzufügen dieser Legende, da es nicht wirklich eine Möglichkeit war, herauszufinden, welcher Bereich dieser Grafik was bewirkt hat, nämlich Hunger, Geschwindigkeit, Kraft und Gesundheit. Zum Glück haben wir das |
| Mapping-Datei. Es geht vom Spaltennamen bis zur Form. |
| Und ich werde das nur für eine Sekunde öffnen. |
| Hier können Sie sehen, dass ich alle Zeilen und auch die Spalte mit der Datenbeschriftung beschriftet habe. Das heißt, 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 der Grafik fertig. |
| Wenn ich das also in meine Szene integrieren möchte, ist es am besten, es einfach auszuwählen, das Pluszeichen zu setzen und es dann zu kopieren. |
| Dann öffnen Sie ein Bildbearbeitungsprogramm und speichern es auf der Festplatte. Und das habe ich natürlich schon getan. Also werde ich es tun |
| zeige es, sobald du das hast, und ich muss meine Grafik noch einmal zurückbringen, |
| Wow, ich kann das einfach reinziehen. |
| Und da ist es. Oh, es ist nicht da. Nun, es gibt also eine Möglichkeit, es zu finden. Gehen Sie zu „Anpassen“. Es wurde im Hintergrund abgelegt, denn wenn Sie ein Bild hineinziehen, ziehen Sie normalerweise ein Hintergrundbild hinein. |
| Jetzt müssen wir das Ganze also aus dem Weg räumen, damit Sie sehen können, was passiert, und nach vorne gehen. Hier kommt es |
| und los geht's. Es ist vorne. Und ich würde dem Ganzen gerne etwas mehr Transparenz verleihen, weil es für meinen Geschmack etwas zu hell ist. |
| Also setzen wir .8. |
| Und jetzt müssen wir es nur noch in die Ecke ziehen und schon sind wir damit so gut wie fertig. |
| Okay, es war also eine Menge und es waren viele Dateien dabei. Fassen wir also alle verwendeten Dateien zusammen. Ich habe meinen komplexen Kuchenhersteller verwendet, um die beiden benötigten Kartendateien, Formdateien, zu generieren. Ich habe eine kleine Schule genommen und sie gestapelt. |
| Ich habe diese Spalte erstellt, um die Zuordnungsdatei zu formen, die auf die Namensdatei mit der Zuordnungsrolle verweisen musste. Ich habe eine Linkreferenz verwendet, um eine virtuelle Verbindung zurück zu einem kleinen Schulstapel herzustellen. |
| Dann habe ich eine Grafik erstellt, die ich in eine Datentabelle umwandeln wollte, und diese in meiner Datei „health images.jmp“ gespeichert. |
| Das musste natürlich virtuell wieder mit der ursprünglichen kleinen Schule verbunden werden, damit ich die Grafik damit erstellen kann. |
| Und dann habe ich das Gleiche mit kleinen Schul-Meerestemperaturen gemacht, meinem Link-Referenz zu Gesundheitsbildern. |
| Ich habe nur ... Ich habe meine Spalte als Formdatei genommen und die Legende für die Grafik gezeichnet, die ich mit den Meerestemperaturen zu erstellen versucht habe, und ich habe ... Ich verwende das einfach, indem ich es im Grunde hineingezogen habe. |
| Das war's also mit den 2D-Demonstrationen, die ich machen wollte. Lassen Sie uns hier eine kleine Verschnaufpause einlegen und jetzt tauchen wir ein in die Welt von 3D und sogar ins Web |
| Anwendung. |
| Okay. |
| Das ist also meine Webanwendung für 3D-Streudiagramme. |
| Und was ich Ihnen zeigen werde, ist, wie ich Daten von JMP hineinbekommen habe. |
| Meine Anwendung basierte auf dem 3D-Streudiagramm von JMP. Das soll Sie nur daran erinnern, wie das aussieht. |
| Und jetzt habe ich eine kleine Demo davon. |
| Im Grunde genommen hatte es ... Ich zeige Ihnen einige der Funktionen, 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 sind in Form einer kleinen Kugel gezeichnet. Ich werde gleich erklären, wie das gemacht wird. |
| Aber Sie können es auch drehen, genau wie in JMP, Sie können zoomen und hin- und herbewegen. |
| Und dann gibt 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 etwas blaue Farbe verleihen können. |
| Ja, vielleicht gefällt dir 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 zunächst einmal fragen, ob sie im Web funktionieren kann. Würde es 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 Zufallsdatensätze mit zunehmender Anzahl von Punkten erstellt. Ich ging und benutzte ein... |
| 25.000 waren meiner Meinung nach einen Versuch auf Geräten mit geringerer Leistung wert, aber mit Geräten mit hoher Leistung kann man tatsächlich viel höher gehen. |
| Dann dachte ich, ich sollte versuchen, ein paar echte Daten einzubringen, und ich fand den berühmten Iris-Datensatz, und zwar im CSV-Format (durch Kommas getrennte Variablen). |
| Und ich habe es mitgebracht. Aber ich musste Code schreiben, um ihn in meine internen Strukturen zu konvertieren. |
| Und ich dachte, JMP hat viele Datensätze. Ich würde die lieber einfach reinbringen. Also brachte ich Autos, Diamanten und Zytometrie mit. Der einzige Unterschied war die Zytometrie, die war nicht wirklich gut |
| Kategorie für die Verwendung von Farbe und sie mussten tatsächlich meine Anwendung ändern, um ein Diagramm zu akzeptieren, das keine Farbe hatte. |
| Die Anwendung ist also ziemlich einfach. Es gibt nur eine ... es ist eine einseitige Web-App. Es gibt also eine HTML-Datei. Ich habe ein paar JavaScript-Dateien und verwende ein paar Bibliotheken von Drittanbietern sowie eine Schriftart und eine Textur, und die Textur ist die Kugel, die 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-Visualisierung verwendet. Sie können einige coole Effekte wie Feuer, Rauch, Feuerwerk und Wolken erzielen. |
| Und ich habe in der Vergangenheit einige Zeit damit verbracht, an einer kommerziellen Spiel-Engine zu arbeiten, und meine Aufgabe bestand eigentlich darin, das Partikelsystem zu übernehmen und es zu verbessern. |
| Ich habe also bereits einige Erfahrungen damit gemacht. Ähm, das war in der C++-Welt, nicht in JavaScript. Aber da ich eine ganze Weile an interaktivem HTML5 und JMP gearbeitet habe, dachte ich, es wäre an der Zeit zu sehen, ob ich es schaffen kann |
| Ich verbinde zwei meiner Leidenschaften und entwickle eine webbasierte Version der Verwendung von Partikelsystemen. Ich hatte Glück. Ich habe diese Bibliothek gefunden, Three.js. |
| Es ermöglicht hardwarebeschleunigtes 3D-Zeichnen, verfügt über eine hervorragende Dokumentation und es gibt viele Codebeispiele, einschließlich Partikelsystemen, sodass es ziemlich einfach war, meine Anwendung zu erstellen. |
| Und tatsächlich bestand der schwierige Teil für mich darin, herauszufinden, wie ich Daten aus JMP hineinbekomme. |
| Aber ich werde ... Ich werde das Skript dafür teilen. Das Einzige, was ich getan habe, ist sicherzustellen, dass ich die Verwendung dieser Objekte einfach gemacht habe |
| in meiner Bewerbung. Also habe ich einfach ein Array von JavaScript-Objekten erstellt und für die numerischen Spalten tatsächlich 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 wie ein Kategoriewörterbuch verwenden. Und im Grunde genommen sind es nur die Namen der Kategorien in einer Liste, die dann einfach durch einen auf Null basierenden 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 eine einfache Sache. Und das zeige ich Ihnen gleich. Aber im Grunde muss ich es nur auf numerische Spalten für x, y und z beschränken. |
| Und dann beschränken Sie es auf eine kategoriale Spalte für die Farbrolle. |
| Schauen wir uns also diesen Code an. |
| Okay, ich gebe zunächst ein Beispiel für einen sehr einfachen Datensatz. |
| Und dann war der Dialog wirklich einfach. Ich verwende den Spaltendialog und habe angegeben, was ich für die numerischen Spalten und was ich für die Farbspalte wollte, und habe sichergestellt, dass der Modellierungstyp kategorisch ist, also ordinal und nominal. |
| Als nächstes nehme ich die Spaltendaten und baue die JavaScript-Objekte auf, die ich benötige. Hier sind die Min- und Max-Strings. Und das ist nur der Aufbau einer Reihe dieser Objekte. |
| Und wenn es dann eine Farbspalte gibt, mache ich dasselbe. Es ist etwas komplizierter, weil ich diese Zeichenfolgen herausholen und in das JavaScript-Objekt einfügen muss. |
| Und schließlich muss es nur noch in einer Textdatei gespeichert werden. |
| Probieren wir es also mal aus. |
| Natürlich werde ich Big Class verwenden, es ist also eine schöne kleine Datei. |
| Und |
| Also führe ich das Skript aus. |
| Und es fragte mich: Was möchte ich für mein XYZ? Ich habe bereits eine Größe und ein Gewicht ausgewählt und das Alter ist eine numerische Spalte, also werde ich diese auch verwenden und Geschlecht eignet sich gut für die Farbe. |
| Und dann sind wir fertig. Und tatsächlich sagt mir die Ausgabe hier, wo sich die Datei befindet. |
| Das habe ich zufällig auf der nächsten Folie. Also lasst uns dazu übergehen. |
| Ich wette, Sie haben sich schon immer gefragt, wie Big Class in JavaScript aussehen würde. Und das ist es. Und so können Sie die drei sehen |
| Zahlenspalten mit Ihrem Minimum und Maximum, und dann enthält die Farbspalte dieses Wörterbuch von F und M für die Kategorien, und die Null bedeutet weiblich und die Eins bedeutet männlich. Nun, das ist mein aufregender Abschluss dieses Vortrags. Ich hoffe, es hat Ihnen gefallen. |
| Vielen Dank fürs Zuschauen. Wenn Sie Fragen haben, stellen Sie diese bitte. |
