Datenplattform · Open Source · Datenvisualisierung
Marquez: die Herkunft von Daten auf einen Blick nachvollziehbar machen
Kontext
In einer Datenplattform steht nichts für sich allein. Eine Tabelle erzeugt ein Job, der drei andere Tabellen liest, und diese speisen ein Dashboard, über das sich am Montagmorgen jemand beschwert. Existieren diese Abhängigkeiten nur als Kennungen in einer Liste, wird die Antwort auf die Frage „Woher stammt diese Zahl?“ zu einem Nachmittag voller Rückfragen bei Kollegen.
Herausforderung
Einen dichten Abhängigkeitsgraphen so zeichnen, dass er lesbar bleibt: genug auf einmal sichtbar, um die Form des Systems zu erkennen, genug Detail auf Abruf, um eine echte Frage zu beantworten, und kein Zustand, in dem sich der Nutzer in den eigenen Daten verirrt.
Umfang
Was ich gemacht habe
- 01Ich habe das Frontend der Open-Source-Webanwendung Marquez mitentwickelt.
- 02Ich habe an Oberflächen zum Durchsuchen von Metadaten gearbeitet.
- 03Ich habe die visuelle Darstellung der Abhängigkeiten zwischen Daten umgesetzt.
- 04Ich habe React und D3.js für eine interaktive, stark datengetriebene UI eingesetzt.
Wichtige Entscheidungen
Wichtige Entscheidungen
- 01
Der Graph ist die Hauptlesart, keine Dekoration
Abhängigkeiten werden als Graph gezeichnet, weil die Frage fast immer relational ist: nicht „Was ist dieser Datensatz?“, sondern „Was liegt davor, und was fällt um, wenn ich ihn ändere?“
- 02
D3.js dort, wo eine Diagrammbibliothek endet
Lineage-Graphen verlangen Kontrolle über Layout, Verhalten der Knoten und darüber, wie viel auf einmal gezeichnet wird. D3 gibt diese Kontrolle, auf Kosten von mehr Handarbeit, und das ist der richtige Kompromiss für eine Spezialoberfläche, in der Menschen den ganzen Tag arbeiten.
- 03
React als Klammer für den Rest der Anwendung
Die Komponentenstruktur verband die Visualisierung mit den Metadaten-Panels und den umgebenden Abläufen, sodass der Graph eine Ansicht in der Anwendung ist und keine Insel mittendrin.
Ergebnisse
Ergebnisse
- 01
Eine Oberfläche, in der Ingenieure Metadaten durchsuchen und Abhängigkeiten nachverfolgen, statt sie von Hand zu rekonstruieren.
- 02
Ein technischer Datengraph, der sich erkunden lässt, statt einer Liste von Kennungen.
- 03
Eine öffentlich überprüfbare Arbeit, denn Marquez ist Open Source und der Code liegt auf GitHub.
Stack
- React
- JavaScript
- D3.js
- Open Source
Eingesetzte Leistungen
Haben Sie ein ähnliches Projekt? Schreiben Sie mir, was Sie bauen möchten — in der Regel antworte ich innerhalb von 2 Stunden.