Encontrar um gráfico e renderizar SVG com @microcharts/mcp

Para quem

Para quem quer que um modelo escolha um gráfico do tamanho de uma palavra, descubra como ligá-lo e renderize um SVG pronto com alt text real. O texto oficial diz An MCP server and Vercel AI-SDK toolset for microcharts — let a model find the right word-sized chart, get exactly how to wire it, and render it to a finished SVG with real alt text. Página do produto: https://microcharts.dev/

Pré-requisito: esta máquina executa npx e você adiciona @microcharts/mcp ao cliente com o JSON oficial. Locais nomeados: claude_desktop_config.json do Claude Desktop, ou .cursor/mcp.json do Cursor.

O texto oficial também diz Runs on your machine, stdio server, distributed on npm, Nothing is hosted; no account, no key, no data leaves. Ainda assim não é risco zero: o processo roda aqui e lê a série que você passa para renderizar. Não leia isso como ausência de fronteira de privacidade.

Primeira tentativa em 3 minutos

Use só npx -y @microcharts/mcp. A configuração tem command npx e args -y e @microcharts/mcp. Não abra um endpoint hospedado.

Pré-requisito: conseguir escrever um desses dois arquivos de configuração. A documentação oficial não exige conta nem chave.

Locais de instalação e execução: Claude Desktop usa claude_desktop_config.json; Cursor usa .cursor/mcp.json. O nome do servidor é microcharts.

Uma observação de baixo risco: primeiro leia o recurso microcharts://catalog (every chart + metadata). Os trechos oficiais escrevem find, get, render como capacidades, sem nomes de função; na primeira vez leia só o recurso de catálogo, não invente nomes de função.

Sinal de sucesso: ver o catálogo de gráficos e metadata. A documentação oficial não lista campos do catálogo.

Casos de uso

Caso 1: percorrer o catálogo. Leia microcharts://catalog e confirme quais gráficos do tamanho de uma palavra existem e seus metadata. Somente leitura; não passe dados de série.

Caso 2: renderizar um SVG pronto. O texto oficial diz Render to a finished, self-contained SVG plus its generated alt text. A série vai em data; outros props incluem value, target, curve, color, width. Antes de chamar, confirme que esses números são os que você quer desenhar. Há também o recurso microcharts://agent-setup, the prompt for wiring microcharts into a codebase; isso é um prompt de ligação, não o render em si.

Limites de uso

O render gera SVG e alt text; a documentação oficial não escreve caminho de salvamento nem desfazer. find / get / render não aparecem como nomes de função; não invente um conjunto de chamadas.

Entrada oficial: https://github.com/ganapativs/microcharts/tree/main/packages/mcp