antvis

AntV 又开源了，这次是一个数据分析 Agent 的开发框架： AVA 简介 我们是 AntV ，蚂蚁做数据可视化解决方案的，今天发布了 AVA 4.0 版本。 - 官网： ava.antv.vision - 开源地址： antvis/AVA 感谢关注一下 ⭐️⭐️。~50 行核心代码 即可构建你的 Data Agent ； AVA 4.0 是 一套面向 JavaScript 应用和 AI Agent 的开源数据分析与可视化框架。 3.0 基于规则与统计方法，聚焦数据洞察与图表推荐，帮助开发者发现数据中的异常、趋势，并选择合适的图表。4.0 进一步面向 AI Agent ，打通数据接入、分析执行与可视化表达。Agent 可以结合业务口径理解问题，调用 AVA 查询和计算数据，再用图表呈现结果。 > 如果你熟悉 PandasAI ，可以把 AVA 理解为 JavaScript 生态中面向 AI Agent 的数据分析与可视化框架。 使用 - 1.安装 npm install @antv/ava@4 - 2.实例化 AVA import { AVA } from '@antv/ava'; const ava = new AVA({ llm: { model: '<your-model>', apiKey: '<your-api-key>', // baseURL: '<your-provider-api-url>', }, }); - 3.加载数据 await ava.source({ type: 'csv-file', options: { path: './sales.csv' } }); 支持 10+ 中数据源，包括本地文件、远程数据、以及像飞书、腾讯表格、Supabase 的 Saas 产品数据，还在社区生态扩展中。 - 4.探索数据 const schema = await ava.schema(); const profile = await ava.profile({ metrics: ['row_count', 'null_count'] }); await ava.semantic(undefined, () => ({ description: 'Use the sales column for amounts after discounts and order_date for monthly comparisons.', })); 通过 API 了解加载的数据集是什么样的？可以做什么分析！ - 5.问题推荐 如果不知道需要问什么？可以让 AVA 来推荐。 const suggestions = await ava.suggest(3); // - How did sales change from January to February 2025? // - Which products contributed most to the sales decline? // - How do sales and profit vary by region? - 6.分析和洞察 自然语言对话，问数，查数，洞察信息等。 const result = await ava.analyze( 'Compare January and February 2025 sales by product. Show both months and the change, ordered by the largest decline.' ); - 7.可视化 AntV 做可视化的，自然少不了分析结果数据的可视化。可视化能力基于 [GPT-Vis]( gpt-vis.antv.vision) 同样也是开源的. const chart = await ava.visualize({ query: 'Plot the sales change by product from January to February 2025 as a bar chart.', data: result.data, }); 周边 除了以 SDK 用 API 快速接入 Data Agent 之外， 也可以直接使用 CLI 或者 Skill ，快速本地做数据分析。具体： - 官网： ava.antv.vision - 生态周边收集： AVA#1035 V2EX 不能贴图，还是去官网看吧，官网有 AI 体验能力，填入 APIKey 就能体验纯前端版本。

AntV Infographic GitHub Explained: How Declarative SVG Rendering Works infographic by antvis: antvis/infographic AntV Infographic is presented as a declarative framework for turning structured intent into editable SVG infographics. This overview follows the pipeline from a two-space, bracketless DSL and fault-tolerant parser through template selection, text measurement, layout calculation, and standalone JSX rendering. It also covers progressive rendering as model tokens arrive, theme styling with patterns and gradients, and the optional in-browser editor for resizing and direct text changes. The discussion closes with practical trade-offs: fixed-height cards can constrain long descriptions, while narrative templates do not map cleanly to every freeform topology. Use the repository as the source for the framework’s syntax, templates, rendering configuration, and editor architecture. TimeStamps: 0:00 Why AI Layouts Need a Declarative Layer 0:46 From Raster Graphics to Editable SVG 1:44 The Infographic Compilation Pipeline 2:43 Streaming Syntax for Progressive Rendering 4:13 Templates and Text Measurement 5:26 Standalone JSX and SVG Output 6:18 The Built-In WYSIWYG Editor 7:14 Fixed-Height Layout Trade-Offs 8:02 Narrative Layouts and Freeform Topologies 8:46 Deterministic Rendering and Schema Trade-Offs 🧩 Declarative intent becomes a structured infographic pipeline ⚡ Indented syntax supports progressive rendering from token streams 🖼️ Standalone JSX renders styled, editable SVG output 🧭 Narrative templates balance determinism with topology fit AntV Infographic’s core idea is to let authors describe structure while the engine handles geometry, rendering, and optional editing. That makes it a useful reference for AI-to-UI pipelines centered on narrative SVG graphics. The key design choice is also the main trade-off: deterministic templates provide consistency, while unusual spatial relationships may require custom structures. #AntVInfographic #SVG #AIVisualization [de-DE] AntV Infographic GitHub erklärt: So funktioniert deklaratives SVG-Rendering Infografik von AntV: antvis/infographic AntV Infographic präsentiert sich als deklaratives Framework zur Umwandlung strukturierter Inhalte in editierbare SVG-Infografiken. Diese Übersicht beschreibt den Workflow von einer zweizeiligen, klammerlosen DSL und einem fehlertoleranten Parser über die Template-Auswahl, Textmessung und Layoutberechnung bis hin zum eigenständigen JSX-Rendering. Außerdem werden progressives Rendering beim Eintreffen von Modell-Tokens, Theme-Styling mit Mustern und Farbverläufen sowie der optionale Browser-Editor zum Ändern der Größe und für direkte Textänderungen behandelt. Abschließend werden praktische Kompromisse aufgezeigt: Karten mit fester Höhe können lange Beschreibungen einschränken, während narrative Templates nicht ohne Weiteres auf jede freie Topologie abgebildet werden können. Das Repository dient als Quelle für die Syntax, die Templates, die Rendering-Konfiguration und die Editor-Architektur des Frameworks. Zeitstempel: 0:00 Warum KI-Layouts eine deklarative Ebene benötigen 0:46 Von Rastergrafiken zu bearbeitbarem SVG 1:44 Die Infografik-Kompilierungspipeline 2:43 Streaming-Syntax für progressives Rendering 4:13 Vorlagen und Textmessung 5:26 Eigenständige JSX- und SVG-Ausgabe 6:18 Der integrierte WYSIWYG-Editor 7:14 Abwägungen bei Layouts mit fester Höhe 8:02 Narrative Layouts und freie Topologien 8:46 Deterministisches Rendering und Schema-Abwägungen 🧩 Deklarative Absicht wird zu einer strukturierten Infografik-Pipeline ⚡ Eingerückte Syntax unterstützt progressives Rendering aus Token-Streams 🖼️ Eigenständiges JSX rendert formatiertes, bearbeitbares SVG 🧭 Narrative Vorlagen vereinen Determinismus und Topologieanpassung Die Kernidee von AntV Infographic ist es, Autoren die Struktur beschreiben zu lassen, während die Engine Geometrie, Rendering und optionale Bearbeitung übernimmt. Das macht es zu einer nützlichen Referenz für KI-zu-UI-Pipelines, die auf narrativen SVG-Grafiken basieren. Die wichtigste Designentscheidung ist gleichzeitig der größte Kompromiss: Deterministische Vorlagen sorgen für Konsistenz, während ungewöhnliche räumliche Beziehungen möglicherweise benutzerdefinierte Strukturen erfordern. #AntVInfographic #SVG #AIVisualization [es-US] Infografía de AntV en GitHub explicada: Cómo funciona el renderizado SVG declarativo Infografía de AntV: antvis/infographic AntV Infographic se presenta como un marco declarativo para transformar la intención estructurada en infografías SVG editables. Esta descripción general sigue el proceso desde un DSL de dos espacios y sin corchetes, con un analizador tolerante a fallos, hasta la selección de plantillas, la medición del texto, el cálculo del diseño y la renderización JSX independiente. También abarca la renderización progresiva a medida que llegan los tokens del modelo, el estilo de temas con patrones y degradados, y el editor opcional en el navegador para redimensionar y modificar el texto directamente. La explicación concluye con algunas consideraciones prácticas: las tarjetas de altura fija pueden limitar las descripciones largas, mientras que las plantillas narrativas no se adaptan perfectamente a todas las topologías de formato libre. Utilice el repositorio como fuente para la sintaxis, las plantillas, la configuración de renderización y la arquitectura del editor del marco. Marcas de tiempo: 0:00 Por qué los diseños de IA necesitan una capa declarativa 0:46 De gráficos rasterizados a SVG editable 1:44 El proceso de compilación de infografías 2:43 Sintaxis de transmisión para renderizado progresivo 4:13 Plantillas y medición de texto 5:26 Salida JSX y SVG independiente 6:18 El editor WYSIWYG integrado 7:14 Ventajas y desventajas de los diseños de altura fija 8:02 Diseños narrativos y topologías de forma libre 8:46 Renderizado determinista y ventajas y desventajas de los esquemas 🧩 La intención declarativa se convierte en un proceso estructurado para infografías ⚡ La sintaxis con sangría admite el renderizado progresivo a partir de flujos de tokens 🖼️ JSX independiente genera una salida SVG editable y con estilo 🧭 Las plantillas narrativas equilibran el determinismo con el ajuste topológico La idea principal de AntV Infographic es permitir que los autores describan la estructura mientras El motor gestiona la geometría, el renderizado y la edición opcional. Esto lo convierte en una referencia útil para flujos de trabajo de IA a interfaz de usuario centrados en gráficos SVG narrativos. La decisión de diseño clave es también la principal disyuntiva: las plantillas deterministas proporcionan coherencia, mientras que las relaciones espaciales inusuales pueden requerir estructuras personalizadas. #AntVInfographic #SVG #AIVisualization [fr-FR] Explication de l'infographie AntV sur GitHub : comment fonctionne le rendu SVG déclaratif Infographie par Antvis : antvis/infographic AntV Infographic est présenté comme un framework déclaratif permettant de transformer des intentions structurées en infographies SVG modifiables. Cet aperçu décrit le processus, depuis un DSL à deux espaces et sans parenthèses et un analyseur syntaxique tolérant aux pannes, jusqu’au rendu JSX autonome, en passant par la sélection de modèles, la mesure du texte, le calcul de la mise en page. Il aborde également le rendu progressif à mesure que les jetons du modèle arrivent, la personnalisation des thèmes avec des motifs et des dégradés, ainsi que l’éditeur optionnel intégré au navigateur pour le redimensionnement et la modification directe du texte. La discussion se termine par les compromis pratiques : les cartes à hauteur fixe peuvent contraindre les descriptions longues, tandis que les modèles narratifs ne s’adaptent pas parfaitement à toutes les topologies libres. Utilisez le dépôt comme source pour la syntaxe, les modèles, la configuration de rendu et l’architecture de l’éditeur du framework. Horodatage : 0:00 Pourquoi les mises en page IA nécessitent une couche déclarative 0:46 Des images raster au SVG modifiable 1:44 Le pipeline de compilation d’infographies 2:43 Syntaxe de flux pour le rendu progressif 4:13 Modèles et mesure du texte 5:26 Sortie JSX et SVG autonomes 6:18 L’éditeur WYSIWYG intégré 7:14 Compromis liés aux mises en page à hauteur fixe 8:02 Mises en page narratives et topologies libres 8:46 Compromis liés au rendu déterministe et aux schémas 🧩 L’intention déclarative devient un pipeline d’infographie structuré ⚡ La syntaxe indentée prend en charge le rendu progressif à partir de flux de jetons 🖼️ Le JSX autonome génère une sortie SVG stylisée et modifiable 🧭 Les modèles narratifs équilibrent déterminisme et adaptation à la topologie L’idée centrale d’AntV Infographic est de permettre aux auteurs de décrire la structure tandis que le moteur gère le reste. Géométrie, rendu et édition optionnelle : autant d’éléments qui en font une référence précieuse pour les pipelines IA-interface utilisateur centrés sur les graphiques SVG narratifs. Le choix de conception principal représente également le principal compromis : les modèles déterministes garantissent la cohérence, tandis que des relations spatiales inhabituelles peuvent nécessiter des structures personnalisées. #AntVInfographic #SVG #AIVisualization [hi] AntV इन्फोग्राफिक GitHub की व्याख्या: डिक्लेरेटिव SVG रेंडरिंग कैसे काम करती है एंटिविस द्वारा इन्फोग्राफिक: antvis/infographic एंटिविस इन्फोग्राफिक एक डिक्लेरेटिव फ्रेमवर्क है जो संरचित सामग्री को संपादन योग्य SVG इन्फोग्राफिक्स में परिवर्तित करता है। यह अवलोकन दो-स्पेस, ब्रैकेटलेस DSL और फॉल्ट-टॉलरेंट पार्सर से लेकर टेम्पलेट चयन, टेक्स्ट मापन, लेआउट गणना और स्टैंडअलोन JSX रेंडरिंग तक की प्रक्रिया को दर्शाता है। इसमें मॉडल टोकन आने पर प्रोग्रेसिव रेंडरिंग, पैटर्न और ग्रेडिएंट के साथ थीम स्टाइलिंग और आकार बदलने और सीधे टेक्स्ट परिवर्तन के लिए वैकल्पिक इन-ब्राउज़र एडिटर भी शामिल हैं। चर्चा व्यावहारिक कमियों के साथ समाप्त होती है: निश्चित ऊंचाई वाले कार्ड लंबे विवरणों को सीमित कर सकते हैं, जबकि नैरेटिव टेम्पलेट हर फ्रीफॉर्म टोपोलॉजी पर सटीक रूप से मैप नहीं होते हैं। फ्रेमवर्क के सिंटैक्स, टेम्पलेट, रेंडरिंग कॉन्फ़िगरेशन और एडिटर आर्किटेक्चर के स्रोत के रूप में रिपॉजिटरी का उपयोग करें। टाइमस्टैम्प: 0:00 एआई लेआउट के लिए डिक्लेरेटिव लेयर की आवश्यकता क्यों है 0:46 रास्टर ग्राफ़िक्स से संपादन योग्य SVG तक 1:44 इन्फ़ोग्राफ़िक संकलन पाइपलाइन 2:43 प्रगतिशील रेंडरिंग के लिए स्ट्रीमिंग सिंटैक्स 4:13 टेम्प्लेट और टेक्स्ट मापन 5:26 स्टैंडअलोन JSX और SVG आउटपुट 6:18 बिल्ट-इन WYSIWYG संपादक 7:14 निश्चित ऊंचाई वाले लेआउट के फायदे और नुकसान 8:02 नैरेटिव लेआउट और फ्रीफॉर्म टोपोलॉजी 8:46 नियतात्मक रेंडरिंग और स्कीमा के फायदे और नुकसान 🧩 डिक्लेरेटिव इंटेंट एक संरचित इन्फ़ोग्राफ़िक पाइपलाइन बन जाता है ⚡ इंडेंटेड सिंटैक्स टोकन स्ट्रीम से प्रगतिशील रेंडरिंग का समर्थन करता है 🖼️ स्टैंडअलोन JSX स्टाइल किए गए, संपादन योग्य SVG आउटपुट को रेंडर करता है 🧭 नैरेटिव टेम्प्लेट नियतात्मकता और टोपोलॉजी अनुकूलता के बीच संतुलन बनाते हैं AntV इंफोग्राफिक का मूल विचार यह है कि लेखक संरचना का वर्णन करें जबकि इंजन ज्यामिति, रेंडरिंग और वैकल्पिक संपादन का काम संभाले। यह इसे कथात्मक SVG ग्राफिक्स पर आधारित AI-से-UI पाइपलाइनों के लिए एक उपयोगी संदर्भ बनाता है। प्रमुख डिज़ाइन विकल्प ही मुख्य समझौता है: निश्चित टेम्पलेट स्थिरता प्रदान करते हैं, जबकि असामान्य स्थानिक संबंधों के लिए अनुकूलित संरचनाओं की आवश्यकता हो सकती है। #AntVInfographic #SVG #AIVisualization [id] Penjelasan Infografis GitHub AntV: Cara Kerja Rendering SVG Deklaratif Infografis oleh antvis: antvis/infographic AntV Infographic disajikan sebagai kerangka kerja deklaratif untuk mengubah maksud terstruktur menjadi infografis SVG yang dapat diedit. Gambaran umum ini mengikuti alur kerja dari DSL dua spasi tanpa tanda kurung dan parser yang toleran terhadap kesalahan hingga pemilihan templat, pengukuran teks, perhitungan tata letak, dan rendering JSX mandiri. Ini juga mencakup rendering progresif saat token model tiba, penataan tema dengan pola dan gradien, dan editor dalam browser opsional untuk mengubah ukuran dan perubahan teks langsung. Diskusi diakhiri dengan pertimbangan praktis: kartu dengan tinggi tetap dapat membatasi deskripsi yang panjang, sementara templat naratif tidak dapat dipetakan dengan rapi ke setiap topologi bentuk bebas. Gunakan repositori sebagai sumber untuk sintaks kerangka kerja, templat, konfigurasi rendering, dan arsitektur editor. Cap Waktu: 0:00 Mengapa Tata Letak AI Membutuhkan Lapisan Deklaratif 0:46 Dari Grafik Raster ke SVG yang Dapat Diedit 1:44 Alur Kompilasi Infografis 2:43 Sintaks Streaming untuk Rendering Progresif 4:13 Templat dan Pengukuran Teks 5:26 Output JSX dan SVG Mandiri 6:18 Editor WYSIWYG Bawaan 7:14 Kompromi Tata Letak Tinggi Tetap 8:02 Tata Letak Naratif dan Topologi Bentuk Bebas 8:46 Rendering Deterministik dan Kompromi Skema 🧩 Niat deklaratif menjadi alur infografis terstruktur ⚡ Sintaks berindentasi mendukung rendering progresif dari aliran token 🖼️ JSX mandiri merender output SVG yang bergaya dan dapat diedit 🧭 Templat naratif menyeimbangkan determinisme dengan kesesuaian topologi Ide inti AntV Infographic adalah membiarkan penulis mendeskripsikan struktur sementara Mesin ini menangani geometri, rendering, dan pengeditan opsional. Hal ini menjadikannya referensi yang berguna untuk alur kerja AI-ke-UI yang berpusat pada grafik SVG naratif. Pilihan desain utama juga merupakan kompromi utama: templat deterministik memberikan konsistensi, sementara hubungan spasial yang tidak biasa mungkin memerlukan struktur khusus. #AntVInfographic #SVG #AIVisualization [it] Infografica AntV su GitHub spiegata: come funziona il rendering SVG dichiarativo Infografica di antvis: antvis/infographic AntV Infographic è presentato come un framework dichiarativo per trasformare intenti strutturati in infografiche SVG modificabili. Questa panoramica illustra il processo, da un DSL senza parentesi e a due spaziatura e un parser tollerante agli errori, fino alla selezione del template, alla misurazione del testo, al calcolo del layout e al rendering JSX autonomo. Vengono inoltre trattati il ​​rendering progressivo all'arrivo dei token del modello, la stilizzazione dei temi con pattern e sfumature e l'editor opzionale integrato nel browser per ridimensionare e modificare direttamente il testo. La discussione si conclude con alcune considerazioni pratiche: le schede ad altezza fissa possono limitare le descrizioni lunghe, mentre i template narrativi non si adattano perfettamente a tutte le topologie a forma libera. Il repository è la fonte per la sintassi del framework, i template, la configurazione del rendering e l'architettura dell'editor. Indice dei contenuti: 0:00 Perché i layout AI necessitano di un livello dichiarativo 0:46 Dalla grafica raster all'SVG modificabile 1:44 La pipeline di compilazione delle infografiche 2:43 Sintassi di streaming per il rendering progressivo 4:13 Modelli e misurazione del testo 5:26 Output JSX e SVG autonomi 6:18 L'editor WYSIWYG integrato 7:14 Compromessi dei layout ad altezza fissa 8:02 Layout narrativi e topologie a forma libera 8:46 Rendering deterministico e compromessi dello schema 🧩 L'intento dichiarativo diventa una pipeline di infografiche strutturata ⚡ La sintassi indentata supporta il rendering progressivo da flussi di token 🖼️ Il JSX autonomo genera output SVG modificabili e stilizzati 🧭 I modelli narrativi bilanciano il determinismo con l'adattamento alla topologia L'idea centrale di AntV Infographic è quella di consentire agli autori di descrivere la struttura mentre il motore gestisce la geometria, il rendering e la modifica opzionale. Ciò lo rende un utile riferimento per le pipeline di intelligenza artificiale verso l'interfaccia utente incentrate sulla grafica narrativa SVG. La scelta progettuale chiave rappresenta anche il principale compromesso: i modelli deterministici garantiscono coerenza, mentre relazioni spaziali insolite possono richiedere strutture personalizzate. #AntVInfographic #SVG #AIVisualization [pt-BR] Infográfico AntV no GitHub explicado: Como funciona a renderização declarativa em SVG Infográfico por antvis: antvis/infographic O AntV Infographic é apresentado como um framework declarativo para transformar intenções estruturadas em infográficos SVG editáveis. Esta visão geral descreve o fluxo de trabalho, desde uma DSL sem colchetes e com dois espaços, passando por um analisador sintático tolerante a falhas, até a seleção de modelos, medição de texto, cálculo de layout e renderização JSX independente. Também aborda a renderização progressiva à medida que os tokens do modelo chegam, a estilização de temas com padrões e gradientes e o editor opcional no navegador para redimensionamento e alterações diretas de texto. A discussão termina com considerações práticas: cartões de altura fixa podem limitar descrições longas, enquanto modelos narrativos não se adaptam perfeitamente a todas as topologias de forma livre. Use o repositório como fonte para a sintaxe, modelos, configuração de renderização e arquitetura do editor do framework. Marcadores de tempo: 0:00 Por que os layouts de IA precisam de uma camada declarativa 0:46 De gráficos rasterizados a SVG editável 1:44 O pipeline de compilação de infográficos 2:43 Sintaxe de streaming para renderização progressiva 4:13 Modelos e medição de texto 5:26 Saída JSX e SVG independentes 6:18 O editor WYSIWYG integrado 7:14 Vantagens e desvantagens de layouts de altura fixa 8:02 Layouts narrativos e topologias de forma livre 8:46 Renderização determinística e vantagens e desvantagens de esquemas 🧩 A intenção declarativa se torna um pipeline de infográfico estruturado ⚡ A sintaxe indentada suporta renderização progressiva a partir de fluxos de tokens 🖼️ O JSX independente renderiza saída SVG estilizada e editável 🧭 Os modelos narrativos equilibram o determinismo com a adequação à topologia A ideia central do AntV Infographic é permitir que os autores descrevam a estrutura enquanto o mecanismo lida com a geometria. renderização e edição opcional. Isso a torna uma referência útil para fluxos de trabalho de IA para interface do usuário centrados em gráficos SVG narrativos. A principal escolha de design também representa a principal compensação: modelos determinísticos proporcionam consistência, enquanto relações espaciais incomuns podem exigir estruturas personalizadas. #AntVInfographic #SVG #AIVisualization

Type text, get an infographic | Awesome GitHub Repos Part 1 AntV Infographic, an open-source framework that renders infographics from a short text syntax, designed for AI and streaming output. ⭐ Repo: antvis/Infographic #opensource #github #programming

做信息图不用再求设计师了。 蚂蚁 AntV 出了个 Infographic：输入一句描述，直接出专业 SVG 信息图，自带约 200 套模板。 装进 Claude 就能用，npm 上开箱集成。 我唯一嘀咕的是：模板这么多，选择困难症要犯。 你打算先拿它画什么？ 仓库：antvis/Infographic t.co

Small tip that made a big difference: have @bot install antvis/mcp-server-chart and use it any time it shows off data. Way better than a markdown table.

VRChatワールド軽量化 12個のTips 使用スキル デザイン: pbakaus/impeccable レンダリング: antvis/infographic t.co