d3 Best Practices zur Visualisierung von Daten?

Ich arbeite an einem Projekt, bei dem Datenpunkte im Streudiagramm mit d3 visualisiert werden. Da es sich um eine Webanwendung handelt, ist die Region begrenzt und viele Punkte überschneiden sich. Insgesamt gibt es 20k Punkte und ich erlaube Benutzern, mit einem Pinsel (und dessen Ausdehnung) auf Regionen zu zoomen, aber selbst wenn man hineinzoomt, gibt es immer noch eine große Überlappung von Punkten. Ein Beispiel für eine solche Situation:d3 Best Practices zur Visualisierung von Daten?

enter image description here

Was gute Ansätze sind nach wie vor zugrunde liegende Punkte sichtbar zu machen, die Sicht oder die Wahrnehmung der Punkte zu verbessern? Ich dachte daran, vielleicht Transparenz zu verwenden, aber ich weiß nicht, ob es das tun würde.

Es mag erwähnenswert sein, dass alle Punkte Gene repräsentieren, daher ist die Clusterbildung in Bezug auf die Repräsentation nicht sehr logisch.

Quelle

2015-06-01 Gooey

Ist Ihre Eingangsdaten wirklich zweidimensional oder projizieren Sie> 2 Dimensionen der 2-dimensionalen Scatterplot? –

@FaKeller Es sind wirklich 2D Daten – Gooey

Ok, ich habe gerade die Antwort unten mit einer anderen Visualisierungstechnik aktualisiert. Wenn das nicht das ist, was Sie suchen, geben Sie bitte einige weitere Informationen zum * Zweck * der Visualisierung aus der ** Benutzerperspektive ** an. Welche Informationen sollte der Benutzer sehen können? Wie analysiert er? Welche Schlussfolgerung kann er ziehen? –

Ich würde empfehlen, d3's fisheye plug-in. Sie können die Skala mit der Maus zoomen und verzerren, um Bereiche zu vergrößern.

Sie können ein Beispiel dafür, verwendet mit einer Streuung/Blasendiagramm auf der Seite niedriger hier: http://bost.ocks.org/mike/fisheye/

enter image description here

Darüber hinaus, wenn Sie überlappen ich Opazität erhöhen würde, damit Sie sehen können welche Punkte haben viel Überlappung gegenüber Punkten, die nicht haben.

Hier ist ein Beispiel Graph mit sehr gruppierten Punkte, die ich unter Verwendung erstellt sowohl Fisheye und Opazität: http://crclayton.com/projects/fisheye/

Es erlaubt Ihnen auch über einzelne Punkte zu schweben ein Tooltip zu sehen, die etwa sie weitere Details.

enter image description here

Quelle

2015-06-02 20:21:28

Sehr interessant. So etwas habe ich noch nie gehört. Eine Frage taucht jedoch in meinem Kopf auf: Wie gut kann dies mit einer Pinselauswahl kombiniert werden, da beim Putzen die Maus bewegt werden muss? – Gooey

Ich würde Fisheye eher als eine Alternative zu Bürsten anstatt etwas zusätzlich zu, um ehrlich zu sein. Ich denke, Transparenz eingeschlossen zu haben, wie Sie zuerst sagten, und das Entfernen der Punktgrenzen würde etwas ziemlich Vernünftiges erreichen. –

Ich dachte daran, tatsächlich zwischen den beiden zu wechseln und zum Beispiel, sobald jemand anfängt, die Maus zu ziehen, um das Fisheye zu deaktivieren. Ich werde das heute untersuchen – Gooey

Wenn die Anzahl der Datenpunkte von Interesse ist, könnten Sie Cluster die die Punkte (entweder auf Client/Server-Seite). Dieses Muster wird normalerweise angezeigt, wenn Karten zu viele Markierungen aufweisen (example cluster map).

bearbeitet:

Ich bin noch nicht ganz sicher, ob ich in der richtigen Richtung fahre. Um die Anzahl der Punkte zu visualisieren, können Sie eine 3D-Visualisierung verwenden. Hier ist eine Idee aus dem Software Cities Projekt genommen:

enter image description here

Sie grundsätzlich die Position der Punkte auf der Ebene machen könnte und vertikale Zylinder schaffen - je mehr Punkte an der gleichen Stelle, desto höher ist der Zylinder.

Quelle

2015-06-01 14:32:14

Ich bin nicht sicher, Clustering wäre in meinem Fall sinnvoll. Vergessen, das zu erwähnen, habe meinen Beitrag aktualisiert. – Gooey

@Gooey Ein Binned Scatter ist immer noch eine vernünftige Option, wie in [diesem Beispiel] (http://www.gibmetportal.gi/images/example_scatter_plot.jpg), die hexagonale Bins verwendet, aber Rechtecke sind auch eine Option natürlich. Im Gegensatz zur obigen Beispiel-Cluster-Map wird bei einer binned scatter ein einheitliches Raster angewendet. Ihre Idee, Transparenz zu verwenden, entspricht in gewisser Weise der Binning-Option, da sich die Transparenzen zu einer Heatmap-Farbgebung addieren. Binning verbessert jedoch die Leistung, da der Browser nicht so viele einzelne Knoten rendern muss. – meetamit

@Gooey, um die Notwendigkeit, einzelne Punkte (Gene) zugänglich zu machen, können Sie Zoomen implementieren, und wenn der Zoom-Level hoch genug ist, tauschen Sie die Bins mit den tatsächlichen Punkten. – meetamit

d3 Best Practices zur Visualisierung von Daten?

Antwort

Verwandte Themen