amCharts 5 MCP Server

amCharts 5 MCP Server

Ein MCP (Model Context Protocol)-Server, der KI-Assistenten bei Bedarf Zugriff auf die vollständige amCharts 5-Wissensdatenbank gibt: über 160 Dokumentationsseiten, über 290 Codebeispiele und über 1.300 API-Referenzseiten.

Funktioniert mit Claude Code, Claude Desktop, Cursor, Windsurf, VS Code + GitHub Copilot und jedem anderen MCP-kompatiblen KI-Tool.

Warum?

Anstatt die gesamte amCharts-Referenz in das Kontextfenster der KI zu laden, ermöglicht der MCP-Server der KI, genau das abzufragen, was sie benötigt – eine Referenz zu einem bestimmten Diagrammtyp, ein Codebeispiel oder eine API-Suche. Das bedeutet bessere Antworten bei weniger Kontextverschwendung.

Schnellstart

Der einfachste Weg ist der gehostete Server – keine Installation, einfach eine URL hinzufügen. Möchtest du ihn lieber selbst betreiben? Siehe Lokale Installation unten.

Gehostet (keine Installation) – empfohlen

Richte deinen KI-Client auf Folgendes aus:

https://mcp.amcharts.com/mcp

Claude Code

claude mcp add --transport http amcharts5 https://mcp.amcharts.com/mcp

Claude Desktop / claude.ai – Einstellungen → Connectors → Add custom connector, dann https://mcp.amcharts.com/mcp einfügen.

Cursor – .cursor/mcp.json:

{
  "mcpServers": {
    "amcharts5": {
      "url": "https://mcp.amcharts.com/mcp"
    }
  }
}

VS Code + GitHub Copilot – .vscode/mcp.json:

{
  "servers": {
    "amcharts5": {
      "type": "http",
      "url": "https://mcp.amcharts.com/mcp"
    }
  }
}

Windsurf – ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "amcharts5": {
      "serverUrl": "https://mcp.amcharts.com/mcp"
    }
  }
}

ChatGPT (Plus/Pro/Enterprise mit aktivierten Connectors/Entwicklermodus) – Einstellungen → Connectors → Add custom connector, dann https://mcp.amcharts.com/mcp einfügen.

Cline (VS Code-Erweiterung) – öffne das Panel MCP Servers → Remote Servers, füge https://mcp.amcharts.com/mcp ein oder füge es der JSON-Datei mit den MCP-Einstellungen hinzu:

{
  "mcpServers": {
    "amcharts5": {
      "type": "streamableHttp",
      "url": "https://mcp.amcharts.com/mcp"
    }
  }
}

Clients, die nur lokale (stdio) Server unterstützen (z. B. Zed, Continue, Amazon Q Developer) – verbinde sie über mcp-remote mit der gehosteten URL. Verwende dies als Ausführungsbefehl des Servers in der Konfiguration des Clients:

npx mcp-remote https://mcp.amcharts.com/mcp

Zum Beispiel in einer Konfiguration im Stil von command/args:

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "mcp-remote", "https://mcp.amcharts.com/mcp"]
    }
  }
}

Jeder andere MCP-Client, der eine Remote-Server-URL akzeptiert, funktioniert ebenfalls – verwende den Endpunkt /mcp (Streamable HTTP) oder /sse (Legacy-SSE). Für reine URL-Clients, die dennoch einen Befehl erwarten, verwende die oben gezeigte mcp-remote-Brücke.

Lokale Installation (npx)

Möchtest du ihn lieber selbst betreiben? Der Server ist auch auf npm veröffentlicht und läuft über stdio.

Claude Code

Für alle Projekte (global, empfohlen):

claude mcp add -s user amcharts5 -- npx -y @amcharts/amcharts5-mcp

Nur für das aktuelle Projekt:

claude mcp add amcharts5 -- npx -y @amcharts/amcharts5-mcp

Claude Desktop

Füge Folgendes zu deiner claude_desktop_config.json hinzu:

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

Cursor

Erstelle oder bearbeite .cursor/mcp.json im Stammverzeichnis deines Projekts (oder ~/.cursor/mcp.json für global):

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

Windsurf

Bearbeite ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "amcharts5": {
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

VS Code + GitHub Copilot

Erstelle oder bearbeite .vscode/mcp.json in deinem Workspace:

{
  "servers": {
    "amcharts5": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@amcharts/amcharts5-mcp"]
    }
  }
}

Andere MCP-kompatible Tools

Für jedes andere Tool, das MCP unterstützt (Cline, Continue, Amazon Q, Zed usw.), konfiguriere es so, dass es Folgendes ausführt:

npx -y @amcharts/amcharts5-mcp

Lokal ausführen (für die Entwicklung)

git clone https://github.com/amcharts/amcharts5-mcp.git
cd amcharts5-mcp
npm install
npm start

Verfügbare Tools

Tool	Beschreibung
get_core_reference	Ruft die zentralen amCharts 5-Dokumente ab – Einrichtung, Themes, Farben, Events, häufige Fallstricke
get_chart_reference	Ruft die vollständige Referenz für einen Diagrammtyp ab (z. B. "pie", "sankey", "xy")
list_chart_types	Listet alle verfügbaren Diagrammtypen und ihre Schlüsselwörter auf
search_docs	Durchsucht die Skill-Referenzdokumente nach Schlüsselwörtern (scope: "all" fügt die vollständigen Dokumente, die API-Referenz und Beispiele hinzu)
search_all	Durchsucht alles – Skill-Dokumente, vollständige Dokumentation und Codebeispiele
get_doc	Ruft eine vollständige Dokumentationsseite ab (z. B. "charts/xy-chart/axes", "concepts/events")
get_section	Ruft einen bestimmten Abschnitt aus einer Referenzdatei anhand der Überschrift ab
get_quick_start	Ruft eine minimale funktionierende Vorlage für jeden Diagrammtyp ab
list_examples	Durchsucht alle über 290 Beispiele, optional gefiltert nach Kategorie
get_example	Ruft den vollständigen Code für ein bestimmtes Beispiel ab
get_api_reference	Ruft die API-Referenz für eine Klasse, ein Interface oder eine Funktion ab – Einstellungen mit ihren Standardwerten, Events, Vererbung und die Importzeile
list_geodata	Findet Karten-(Geodaten-)Dateien – Welt, Kontinente, Länder, regionale Pakete und die US-Kongresswahlkreis-Pakete pro Kongress – mit dem CDN-Pfad, dem Script-Global und dem ES-Import jeder Datei

Beispielverwendung

Sobald verbunden, kann dein KI-Assistent:

• "Erstelle mir ein Kreisdiagramm" → Die KI ruft get_quick_start("pie") auf und passt die Vorlage an
• "Wie formatiere ich Beschriftungen der Datumsachse?" → Die KI ruft search_all("date axis label format") auf
• "Zeig mir das Sankey-Diagramm-Beispiel" → Die KI ruft get_example("examples/flow/sankey-diagram") auf
• "Welche Einstellungen unterstützt XYChart?" → Die KI ruft get_doc("reference/xychart") auf
• "Wie integriere ich mit React?" → Die KI ruft get_doc("getting-started/integrations/react") auf, was das Paket @amcharts/amcharts5-react abdeckt
• "Welche Diagrammtypen sind verfügbar?" → Die KI ruft list_chart_types() auf
• "Kartiere die aktuellen US-Kongresswahlkreise" → Die KI ruft list_geodata("congressional whole country") auf

Inhalt

Der Server enthält über 1.800 Dokumente:

• Über 160 Dokumentationsseiten – Erste Schritte, Diagramm-Anleitungen, Konzepte (Themes, Events, Adapter, Datenbindung, Animationen, Barrierefreiheit usw.) und Anleitungen zur Framework-Integration für die React-, Vue-, Angular-, Svelte- und React Native-Pakete von amCharts (mit Next.js, Nuxt, SvelteKit, React Router und Remix 3)
• Über 290 Codebeispiele – funktionierende Demos in 16 Kategorien, darunter Säulen/Balken, Linie/Fläche, Kreis/Donut, Karten, Hierarchie, Fluss, Radar/Polar, Aktien, Messgeräte, Gantt, Timeline und mehr
• Über 1.300 API-Referenzseiten – jede Klasse, jedes Interface und jede Funktion in der amCharts 5-Bibliothek, generiert aus den Typdefinitionen der jeweiligen Version: Einstellungen mit ihren tatsächlichen Standardwerten (einschließlich Theme-Regeln), Events, Eigenschaften, Datenfelder, die Vererbungskette und die Importzeile
• Über 670 Geodaten-Einträge – jede Karte in @amcharts/amcharts5-geodata, für list_geodata
• Kuratierte Skill-Referenz – Schnellstartvorlagen und diagrammspezifische Anleitungen aus dem amCharts 5 AI Skill

Sicherheit

• Nur-Lese-Tools. Jedes Tool liest die mitgelieferte amCharts-Dokumentation und gibt Text zurück. Kein Tool schreibt Dateien, führt Befehle aus oder ruft URLs ab.
• Der gehostete Endpunkt hat bewusst keine Authentifizierung. https://mcp.amcharts.com/mcp stellt dieselbe öffentliche Dokumentation wie amcharts.com bereit. Es gibt keine Konten, API-Schlüssel, Benutzerdaten oder Schreibvorgänge dahinter.
  • Er läuft auf Cloudflare Workers.
  • Der MCP-Sitzungsstatus wird in einem Durable Object gespeichert, wie es das MCP-Agents-Framework erfordert. Er wird gelöscht, wenn die Sitzung endet, oder 24 Stunden nach ihrer letzten Anfrage.
  • Protokolle pro Anfrage (Workers-Aufrufprotokolle) sind deaktiviert. Es werden nur Fehlermeldungen protokolliert, und diese enthalten keine Tool-Argumente. Siehe „Datenschutz" unten.
• Lokale Installation. Das npm-Paket läuft über stdio auf deinem Rechner und liest nur die darin enthaltenen Inhalte; es stellt keine Netzwerkanfragen. Seine einzigen Laufzeitabhängigkeiten sind @modelcontextprotocol/sdk und zod.
• Maintainer-Skripte. Die Skripte in scripts/ (die Demo- und Doku-Scraper, der API-Referenz-Generator) sind nicht Teil des npm-Pakets und werden niemals im Server ausgeführt.
• Melden einer Sicherheitslücke: https://www.amcharts.com/report-vulnerability/

Datenschutz

Weder der gehostete Server noch das npm-Paket benötigen ein Konto oder verlangen personenbezogene Daten.

• Gehosteter Server (https://mcp.amcharts.com/mcp):
  • Was deine KI-App sendet: einen Suchbegriff, einen Diagrammtyp, einen Doku-Pfad. Diese werden nur zur Erstellung der Antwort verwendet und nicht protokolliert oder gespeichert. Eine Antwort wird nur bis zu ihrer Auslieferung im Speicher der Sitzung gehalten (damit ein abgebrochener Stream fortgesetzt werden kann) und danach gelöscht.
  • Sitzungsdatensatz: Wenn eine KI-App sich verbindet, speichert der Server ihre MCP-Initialize-Nachricht im Speicher der Sitzung. Diese Nachricht enthält, was die App über sich selbst angibt (ihren Namen und ihre Version und was auch immer sie sonst dort ablegt), die Protokollversion und die MCP-Fähigkeiten der App. Der gesamte Speicher der Sitzung wird gelöscht, wenn die App die Sitzung beendet, oder 24 Stunden nach ihrer letzten Anfrage.
  • Protokolle: Der Server führt keine Anfrageprotokolle (Workers-Aufrufprotokolle sind deaktiviert). Er läuft auf Cloudflare Workers, und Cloudflare verarbeitet jede Anfrage, einschließlich ihrer IP-Adresse, um sie auszuliefern. Fehler- und Warnmeldungen werden protokolliert und bis zu 7 Tage lang aufbewahrt; sie enthalten keine Anfrageinhalte oder Tool-Argumente.
• npm-Paket: Es läuft auf deinem Computer über stdio und sendet nichts an amCharts oder andere.
• Richtlinie und Fragen: Siehe die amCharts-Datenschutzrichtlinie oder schreibe an contact@amcharts.com.

Lizenz

MIT