Kategorien

← View All Tools

Kalender-Heatmap-Generator

Generieren Sie GitHub-Stil Kalender-Heatmaps zur Visualisierung von Aktivitätsmustern über Zeit, perfekt für die Verfolgung von jährlichen Beiträgen, Gewohnheiten oder Metriken

Aktivitätsdaten für die Kalender-Heatmap. Format: Datum|Wert|Label (JJJJ-MM-TT Format)

Titel, der über der Heatmap angezeigt wird

Jahr für den Kalender (leer lassen für aktuelles Jahr)

Startfarbe für benutzerdefiniertes Farbschema (erfordert Auswahl benutzerdefinierter Farben)

Endfarbe für benutzerdefiniertes Farbschema (erfordert Auswahl benutzerdefinierter Farben)

Farbe für Tage ohne Aktivität

Rahmenfarbe für Zellen

Größe jeder Tageszelle in Pixeln (8-20)

Abstand zwischen Zellen in Pixeln (1-5)

Animationsdauer in Millisekunden

Hintergrundfarbe für den Diagramm-Container

Werte innerhalb der Zellen anzeigen (funktioniert besser mit größeren Zellen)

Die Farbintensitätslegende anzeigen

Monatsnamen über dem Kalender anzeigen

Wochentagsbeschriftungen anzeigen

Aktivitätsstatistiken unter dem Diagramm anzeigen

Hover-Tooltips für Zellen aktivieren

Wichtige Fakten

Kategorie
Data Visualization
Eingabetypen
textarea, text, select, number, color, checkbox
Ausgabetyp
html
Sample-Abdeckung
4
API verfügbar
Yes

Überblick

Der Kalender-Heatmap-Generator ermöglicht es Ihnen, Aktivitätsdaten in einer übersichtlichen, GitHub-ähnlichen Jahresansicht zu visualisieren. Durch die farbliche Kodierung von Werten über einen Zeitraum hinweg erkennen Sie Trends, Konsistenz und Muster in Ihren Daten auf einen Blick.

Wann verwenden

  • •Zur Visualisierung Ihrer täglichen Produktivität oder Arbeitsstunden über ein ganzes Jahr.
  • •Um den Fortschritt bei der Etablierung neuer Gewohnheiten oder Fitness-Ziele zu verfolgen.
  • •Zur Darstellung von zeitbasierten Metriken, wie z. B. tägliche Verkaufszahlen oder Website-Besuche.

So funktioniert es

  • •Geben Sie Ihre Daten im Format 'Datum|Wert|Label' oder als JSON-Liste ein.
  • •Wählen Sie ein Farbschema aus oder definieren Sie eigene Farben für die Intensitätsstufen.
  • •Passen Sie das Layout durch Einstellungen wie Zellgröße, Abstände und Beschriftungen an.
  • •Generieren Sie die Heatmap und nutzen Sie die interaktiven Tooltips zur Detailanalyse.

Anwendungsfälle

Tracking von täglichen Coding-Beiträgen oder Projekt-Commits.
Visualisierung von Trainingshäufigkeit und sportlicher Aktivität.
Analyse von täglichen Verkaufs- oder Support-Ticket-Aufkommen über das Jahr.

Beispiele

1. Jahres-Fitness-Tracker

Sportler
Hintergrund
Ein Nutzer möchte seine täglichen Trainingseinheiten über das Jahr hinweg visualisieren, um die Konsistenz zu prüfen.
Problem
Die rohen Trainingsdaten sind schwer zu interpretieren, um langfristige Trends zu erkennen.
Verwendung
Daten im Format '2024-01-01|1|Training' eingeben und das Farbschema 'Grün' wählen.
Beispielkonfiguration
colorScheme: 'green', showStats: true, showTooltip: true
Ergebnis
Eine klare Heatmap zeigt an, an welchen Tagen trainiert wurde, wobei intensivere Tage durch dunklere Grüntöne hervorgehoben werden.

2. Projekt-Commit-Historie

Softwareentwickler
Hintergrund
Ein Entwickler möchte seine Beiträge in einem privaten Repository für das Jahr 2024 dokumentieren.
Problem
Die GitHub-Statistiken sind nur für öffentliche Repositories verfügbar.
Verwendung
Commit-Daten als JSON-Liste importieren und die Zellgröße auf 12px anpassen.
Beispielkonfiguration
year: 2024, cellSize: 12, showMonthLabels: true
Ergebnis
Eine professionelle Jahresübersicht der eigenen Coding-Aktivität, die als Bild exportiert werden kann.

Mit Samples testen

data-visualization
Grafana Fortgeschrittene Anwendungsbeispiele
Umfassende Grafana-Beispiele für fortgeschrittenes Dashboard-Design, Alerting-Konfiguration, Datenquellen-Integration und Plugin-Entwicklung
keywords time,series,data
sample
WebRTC Echtzeitkommunikation Beispiele
Umfassende WebRTC-Beispiele für P2P Audio/Video-Kommunikation, Datenkanäle, Bildschirmfreigabe und Signalisierungsserver
keywords time,data
sample
Chart.js Library Beispiele
Umfassende Chart.js-beispiele einschließlich diagrammtypen, anpassungsoptionen, animationen und responsive designs
keywords graph,data,visualization
sample
ClickHouse Beispiele
ClickHouse Spaltendatenbank mit Beispielen für High-Performance-Analysen, Zeitreihenverarbeitung und Echtzeit-Dashboards
keywords time,series,data
sample

Verwandte Hubs

Json-Convert-Tools
Entdecken Sie 100 json-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Image-Convert-Tools
Entdecken Sie 100 image-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Audio-Convert-Tools
Entdecken Sie 100 audio-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.
Design-Convert-Tools
Entdecken Sie 98 design-Tools für convert-Workflows und vergleichen Sie ähnliche Utilities schnell.

FAQ

Welches Datenformat wird benötigt?

Sie können Daten entweder als JSON-Array mit 'date', 'value' und 'label' oder als Textliste im Format 'JJJJ-MM-TT|Wert|Label' eingeben.

Kann ich die Farben individuell anpassen?

Ja, wählen Sie im Farbschema-Menü 'Benutzerdefinierte Farben' aus, um Start- und Endfarben für die Intensitätsskala festzulegen.

Welche Zeiträume werden unterstützt?

Das Tool ist für die Darstellung eines einzelnen Jahres optimiert. Sie können das gewünschte Jahr über das Eingabefeld 'Jahr' spezifizieren.

Sind die Heatmaps interaktiv?

Ja, bei aktivierten Tooltips werden beim Überfahren der Zellen mit der Maus die spezifischen Werte für den jeweiligen Tag angezeigt.

Wie kann ich die Darstellung verfeinern?

Sie können die Zellgröße, den Abstand zwischen den Tagen sowie die Sichtbarkeit von Legenden, Monats- und Tagesbeschriftungen individuell konfigurieren.

API-Dokumentation

Request-Endpunkt

POST /de/api/tools/calendar-heatmap

Request-Parameter

Parameter-Name Typ Erforderlich Beschreibung
chartData textarea Ja Aktivitätsdaten für die Kalender-Heatmap. Format: Datum|Wert|Label (JJJJ-MM-TT Format)
chartTitle text Nein Titel, der über der Heatmap angezeigt wird
colorScheme select Nein -
year number Nein Jahr für den Kalender (leer lassen für aktuelles Jahr)
startColor color Nein Startfarbe für benutzerdefiniertes Farbschema (erfordert Auswahl benutzerdefinierter Farben)
endColor color Nein Endfarbe für benutzerdefiniertes Farbschema (erfordert Auswahl benutzerdefinierter Farben)
emptyColor color Nein Farbe für Tage ohne Aktivität
borderColor color Nein Rahmenfarbe für Zellen
cellSize number Nein Größe jeder Tageszelle in Pixeln (8-20)
cellSpacing number Nein Abstand zwischen Zellen in Pixeln (1-5)
animationDuration number Nein Animationsdauer in Millisekunden
backgroundColor color Nein Hintergrundfarbe für den Diagramm-Container
showValues checkbox Nein Werte innerhalb der Zellen anzeigen (funktioniert besser mit größeren Zellen)
showLegend checkbox Nein Die Farbintensitätslegende anzeigen
showMonthLabels checkbox Nein Monatsnamen über dem Kalender anzeigen
showDayLabels checkbox Nein Wochentagsbeschriftungen anzeigen
showStats checkbox Nein Aktivitätsstatistiken unter dem Diagramm anzeigen
showTooltip checkbox Nein Hover-Tooltips für Zellen aktivieren

Antwortformat

{
  "result": "
Processed HTML content
",
  "error": "Error message (optional)",
  "message": "Notification message (optional)",
  "metadata": {
    "key": "value"
  }
}
HTML: HTML

MCP-Dokumentation

Fügen Sie dieses Tool zu Ihrer MCP-Server-Konfiguration hinzu: 

{
  "mcpServers": {
    "elysiatools-calendar-heatmap": {
      "name": "calendar-heatmap",
      "description": "Generieren Sie GitHub-Stil Kalender-Heatmaps zur Visualisierung von Aktivitätsmustern über Zeit, perfekt für die Verfolgung von jährlichen Beiträgen, Gewohnheiten oder Metriken",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=calendar-heatmap",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Sie können mehrere Tools verketten, z.B.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, maximal 20 Tools.

Wenn Sie auf Probleme stoßen, kontaktieren Sie uns bitte bei [email protected]