Heatmap

Eine Heatmap (englisch: heat = ‚Hitze‘, ‚Wärme‘; map = ‚Karte‘) ist ein Diagramm zur Visualisierung von Daten, deren abhängige Werte einer zweidimensionalen Definitionsmenge als Farben repräsentiert werden. Sie dient dazu in einer großen Datenmenge intuitiv und schnell besonders markante Werte zu erfassen.

Der Begriff Heatmap ist unscharf. Er reicht in der engen Interpretation von (hohen) Temperaturen auf einer Landkarte bis hin zu Tree Maps mit unsystematischer Farbcodierung. Weite Verbreitung finden die Bestimmungen

• Zweidimensionale Definitionsmenge: Zeilen und Spalten einer Tabelle, Achsen einer mathematischen Funktion, Bild(-schirm)-Koordinaten (Foto, Webseite)
• Farbcodierung der abhängigen Werte: Darstellung durch eine Temperaturskala (die als solche erkennbar ist), ordinalskalig oder gestufte Zuordnung des Farbtons, einem (Ausschnitt) eines Spektrum oder eines Farbkreises folgend; monochrome Variation von Sättigung oder Helligkeit; aber auch schwarz-weiß- oder Grauwerte, schattiert, gepunktet, schraffiert oder grafisch auf andere Weise unterschieden

Der Name Heatmap leitet sich daraus ab, dass manche Farben mit Temperaturen assoziiert werden.

Geschichte

Die Verwendung von Heatmaps geht mindestens bis auf Toussaint Loua^[1] zurück, der im Jahre 1873 statistische Daten der arrondisements von Paris als Tabelle mit schattierten Feldern darstellte, erst schwarz-weiß, dann farbig.^[2]

Sneath (1957) stellt das Ergebnis einer Clusteranalyse dar, indem er Zeilen und Spalten einer Matrix permutierte um ähnliche Werte nahe beieinander zu platzieren entsprechend ihrer Häufung. Die Idee Cluster-Bäume an Zeilen und Spalten einer Datentabelle anzufügen geht auf Robert Ling im Jahre 1973 zurück. Leland Wilkinson entwickelte 1994 das erste Computerprogramm (SYSTAT) um Cluster-Heatmaps mit großer Farbtiefe zu erzeugen.

Farbcodierung

Ist die abhängige Variable ein Skalar, so lässt sie sich auf natürliche Weise auf eine Temperaturskala abbilden. Weist man in einem zweiten Schritt einer Temperatur eine Farbe zu, blau gilt als kalte Farbe, rot, orange und gelb als warme Farben, so erklärt das den Namen Heatmap.

Die Verbindung von Farbe und Temperatur ist kulturell geprägt und nicht zwingend. Die Wahl der Farbskala ist daher willkürlich und dem Ersteller der Heatmap freigestellt.

Bei festen Endpunkten der Skala stellt sich die Frage der Übergangsfarben. Eine Glühlampe mit steigendem Stromdurchfluss glimmt erst rot (warm), wird dann gelb und schließlich weiß (heiß). Ergänzt um das kalte Blau kann eine Farbskala wie folgt aussehen: Schwarz (unbunt, kältest) – Blau – Violett – Rot – Gelb – Weiß (unbunt, heißest).

Eine breitere Ausnutzung des Farbkreises schreitet von Blau über Grün – Gelb – Orange nach Rot vor. Violett kann hier als kälteste Farbe unterhalb von Blau hinzutreten. Rot ist dann die heißeste, Violett die kälteste Farbe, im Gegensatz zum Glühlampenmodell wo Violett und Rot mittlere Temperaturen repräsentiert.

Farbe ist in diesem Zusammenhang ein unscharfer Begriff. Er lässt sich präzisieren etwa durch Farbton, Sättigung und Helligkeit oder aber durch Rot-, Grün- und Blauanteil oder andere Parametermodelle. Dadurch lassen sich entweder weitere Dimensionen (Datenreihen) in einem Diagramm darstellen, oder aber durch Beschränkung Probleme wie Farbenfehlsichtigkeit oder Schwarz-weiß Druckausgabe entschärfen.

Varianten

Wärmebild

Choroplethenkarte mit stufiger "Temperaturskala": Graustufen (links), Farbtöne (rechts) und Kombination (mitte)

Tree Map: Einordnung unter Heatmap zweifelhaft

Hitzekarte

Eine Hitzekarte im engeren Sinn stellt eine Temperaturverteilung auf einer Landkarte dar, etwa die (Sommer-)Temperaturen in der Stadt oder auf einer topologischen U-Bahn-Karte^[3].

Hitzekarte ist die wörtliche deutsche Übersetzung von Heatmap. Inwiefern damit die gleichen Konzepte beschrieben oder ein Falscher Freund geschaffen wird, ob sich das Lehnwort in seiner englischen oder deutschen Schreibweise im deutschen Sprachraum festsetzen kann, ist unklar.

Wärmebild

Ein Wärmebild repräsentiert Temperaturen farbcodiert in zwei Dimensionen. Da der Meßwert im Prinzip bereits eine Temperatur ist, entfällt der Abstraktionsschritt vom Meßwert auf eine Temperaturskala. Wärmebilder stellen somit die Urform der Heatmap dar und erklären ihren Namen.

Falschfarbenbild

Bei Falschfarbenbildern werden die Farben oder Graustufen eines Originalbildes auf neue Farben umcodiert zur Erhöhung des Kontrasts oder der intuitiven Erfassbarkeit.

Geclusterte Heatmap

Besteht keine Ordnung auf den Achsen der Tabelle, so können die Zeilen (Spalten) ohne Informationsverlust permutiert werden. Wird die Vertauschung so durchgeführt, dass ähnliche Zeilen (Spalten) aufeinander folgen, so erhält die Tabelle zusätzliche Struktur und die Cluster fallen deutlich ins Auge.

Choroplethenkarte

In einer Choroplethenkarte folgen die Farbflächen keinem starren Rechteckraster, sondern den unregelmäßig geformten Gebieten auf einer Landkarte zugeordnet, etwa Vegetationsarten, Klimazonen oder Verwaltungsgrenzen. Manche verwenden das griffigere Heatmap fälschlich anstelle des korrekten Begriffs Choroplethenkarte aus Gründen der Bequemlichkeit^[4]

Tree Map

Eine Tree Map basiert nicht auf einer zweidimensionalen Tabelle, sondern auf einer hierarchischen Knotenmenge. Zweifelhaft ist, inwiefern der Begriff der Heatmap hier gerechtfertigt ist, insbesondere wenn die Farben keiner intuitiv erfassbaren Systematik folgen^[5] oder triviale Werte wie die Pfadlänge farbcodiert wird anstelle etwa der Partitionsgröße in einem Dateisystem. Ähnliches gilt für Mosaik-Diagramme.

Alternativen

Statt durch Farbe kann ein Variablenwert auch durch andere Merkmale dargestellt werden. Kombinationen mit Farben im Allgemeinen und einer Heatmap im Besonderen sind möglich.

Blasendiagramm

Statt durch eine Farbe kann der abhängige Variablenwert auch durch eine geometrische Figur, etwa einem Kreis in einem Blasendiagramm, dargestellt werden. Der Wert ist dann wahlweise proportional zum Durchmesser oder zur Fläche. Bei einer Tabelle mit drei unabhängigen Parametern wird aus dem Kreis eine Kugel. Verwendung findet diese Darstellung besonders, wenn die Achsen geordnet und die Tabelle dünn besetzt ist.

Säulendiagramm

Bei einem Säulendiagramm werden die Variablenwerte durch die Höhe von Säulen dargestellt. Weitere Dimensionen lassen sich gewinnen durch Hinzunahme weiterer Säulen je Tabellenfeld. Maxima lassen sich sehr gut erfassen, kleinere Werte im Hintergrund werden durch größere im Vordergrund verdeckt. Ähnliches gilt für ein Oberflächendiagramm.

Anwendungen

Eine Auswahl von Anwendungen für Heatmaps (Liste nicht vollständig):

Molekularbiologie

Visualisierung von Genexpressionsdaten; Darstellung, wie experimentelle Bedingungen die Produktion (Expression) von mRNA für eine Gruppe von Genen beeinflussen.

Webdesign

Visualisierung von Klicks, Mausbewegung oder Blickdauer (Eyetracker) zum Zwecke der Entwicklung und Erfolgskontrolle, unterstützt die Optimierung des Layouts, der Benutzerfreundlichkeit und der Platzierung von Elementen und Werbemitteln auf Onlineshops, Blogs, Portalen und normalen Webseiten.

Funktionsgraph

alternativ oder verstärkend kann ein Funktionsgraph auf einer zweidimensionalen Definitionsmenge mit einer Heatmap versehen werden.

Sport

Aufenthaltsdauer von Fußballspielern in einem bestimmten Spielfeldbereich^[6]

Geolokalisierung

Nachrichten und ihre Häufung auf einer Weltkarte^[7]. Genauso lassen sich Fotos, Niederschläge, Geburten- und Todesfälle und jedes andere geolokalisierbare Datum visualisieren.

Börse

Kursbewegung relativ zum Vortag, hinterlegt mit Hintergrundinformationen^[8]

• 

  Clusterheatmap in der Genexpressionsanalyse mit Clusterbäumen an den Achsen

• 

  Webanalyse: Klickdichte auf einer Webseite

• 

  Aufenthaltsdauer auf dem Fußballfeld

• 

  Kombination aus Heatmap und Oberflächendiagramm

Software

• R (Statistiksoftware) – Kostenlose Statistiksoftware, quasi-Standard im akademischen Bereich, enthält mehrere Funktionen zum zeichnen von Heatmaps
• Gnuplot – universelles und kostenloses kommandozeilenorientiertes Programm für Funktionsgraphen, ermöglicht das Zeichnen von 2D und 3D Heatmaps^[9]. Ähnliche Programme sind PyXPlot, Matplotlib und andere
• In der Biologie ist der Diagrammtyp der Heatmap so verbreitet, dass es eine Vielzahl von Herstellern gibt, die passende Software dazu anbieten. Siehe dazu auf der englischen Wikipedia: List of bioinformatics companies
• Microsoft Excel kann dazu gebracht werden Heatmaps zu erzeugen, indem das Oberflächendiagramm verwendet wird. Da die Standardfarben der Legende mit einer Heatmap nicht verträglich sind, können die Farben geändert werden um benutzerfreundliche und intuitive Heatmaps zu erzeugen. LibreOffice und OpenOfficeOrg bieten diesen Diagrammtyp nicht an.

Kritik

Menschen mit Farbenfehlsichtigkeit können die Informationen in einer Heatmap mit bunten Farben schlechter, gar nicht, oder entgegen der Absicht der Erstellers wahrnehmen. Das sollte bei Überlegungen zur Barrierefreiheit berücksichtigt werden.

Je Ausgabemedium kann die Farbe unterschiedlich ausfallen: jeder Bildschirm stellt eine Farbe anders dar; beim Druck findet ein Wechsel von additiver zu subtraktiver Farbmischung statt, was den Farbeindruck verändert.

Abhilfe können hier die Beschränkung auf monochrome Farbskalen oder Grauwerte schaffen.

Mitunter gelten Heatmaps als hübsch, aber nutzlos^[10]. Diese Kritik ist aber auf jede Visualisierung anwendbar, die nicht zielgerecht eingesetzt wird.

Siehe auch

• Visualisierung – abstrakte Daten grafisch oder visuell erfassbar machen
• Diagramm – Übersicht über verschiedene (alternative) Diagrammtypen
• Falschfarben - Bei der Farbkodierung werden einzelnen Helligkeitsstufen eines Farbtons verschiedene Farbwerte zugeordnet.
• Warme Farbe und Kalte Farbe – etablierte Endpunkte der Farbskala
• Farbkreis – Farbbeziehungen als Anhaltspunkt für die Farbskala
• Clusteranalyse - Strukturentdeckung in (großen) Datenbeständen

Weblinks

• Heatmap Builder. Heatmap Builder, a program for generating heatmaps developed at the Ashley Labs.
• Matrix2png . Web-based or command-line generation of heat maps.
• [1]. A Map of the Market using a heatmap data visualization and London Stock Exchange data (FTSE 100 Index) from Panopticon Software
• NASDAQ 100 Heatmap. Heatmap visualization of NASDAQ 100 index.
• heatmap.js. Open Source JavaScript library for generating realtime web heatmaps
• heatcanvas. Another open source library for modern web browser.

Einzelnachweise

1. ↑ Michael Friendly, Daniel J. Denis: Milestones in the history of thematic cartography, statistical graphics, and data visualization. 2001, abgerufen am 15. August 2011 (englisch): „First-known use of a semi-graphic table to display a data table by shading levels“ 
2. ↑ Leland Wilkinson, Michael Friendly: The History of the Cluster Heat Map. 18. November 2008, S. 11 (http://www2.cs.uic.edu/~wilkinson/Publications/heatmap.pdf, abgerufen am 15. August 2011).
3. ↑ Map reveals hotspots of the Tube. In: News. BBC Mobile, 24. August 2009, abgerufen am 15. August 2011 (englisch, Artikel verlinkt auf eine Heatmap der Londoner Untergrundbahnlinien): „The heat map monitored most Underground lines in zones one and two on 28 July last year - the hottest day of the year.“ 
4. ↑ Pete Warden: FAQ – Why call it OpenHeatMap when it generates choropleths? In: OpenHeatMap. github, 13. September 2010, abgerufen am 15. August 2011 (englisch): „I can never remember how to spell cloro… churo… that word“ 
5. ↑ Newsmap. Marcos Weskamp, abgerufen am 15. August 2011 (Nachrichtensammler als Tree Map. (Willkürliche) Kategorien werden auf Farbtöne abgebildte, das Meldungsalter auf die Helligkeit (je älter desto dunkler)). 
6. ↑ Mike Glindmeier: Mehr Daten, mehr live, mehr mobil. SPIEGEL-ONLINE, 4. August 2011, abgerufen am 15. August 2011 (Beispiel einer Heatmap): „Anhand der Vierecke können Sie das Bewegungsprofil des jeweiligen Spielers nachvollziehen.“ 
7. ↑ Ilya Grigorik: World News With Geographic Heatmaps. 31. Januar 2007, abgerufen am 15. August 2011 (englisch). 
8. ↑ Peter Simpson: FTSE Market Heatmap Monitor. Panopticon, abgerufen am 15. August 2011 (englisch, Kursbewegungen zum FTSE 100): „A Heatmap monitors price changes within the constituents of the FTSE 100 Index.“ 
9. ↑ gnuplot demo script: heatmaps.dem. gnuplot, 30. Mai 2009, abgerufen am 15. August 2011 (englisch, Beispiele mit Quelltext zur Erzeugung von Heatmaps im SVG-Format). 
10. ↑ Jens Witzig: Heatmap – lets face it. In: I love tracking – A Web Analytics Blog. 23. November 2008, abgerufen am 15. August 2011 (englisch, Heatmaps werden als hübsch und nutzlos betrachtet): „Just the same and same image of some color over your website. Everyday. A heatmap is like your girlfriend´s room decoration: pretty. And useless.“