# Umiejętności agenta wizualizacji wykresów > Przekształcaj złożone zbiory danych w intuicyjne wykresy wizualne dzięki Umiejętnościom Wizualizacji Wykresów AntV, oferującym ponad 26 typów wykresów i generowanie wspomagane sztuczną inteligencją. Zacznij tworzyć wpływowe historie danych bez wysiłku. - Canonical: https://nanoskill.ai/pl/skills/chart-visualization-skills - Markdown: https://nanoskill.ai/pl/skills/chart-visualization-skills.md - Author: antvis - Published: 2026-06-09T05:00:00.000Z - Updated: 2026-07-25T04:33:38.870Z - Language: pl - Source type: github - Popularity signal: 523 ## Sources - https://github.com/antvis/chart-visualization-skills ## Install ```shell npx skills add https://github.com/antvis/chart-visualization-skills ``` ## About Umiejętności Wizualizacji Wykresów AntV oferują profesjonalny pakiet rozwiązań wizualizacyjnych zaprojektowanych, aby skutecznie i dokładnie przekształcać złożone zbiory danych w intuicyjne wykresy wizualne. Zainicjowana przez Ant Group kolekcja umiejętności umożliwia użytkownikom poruszanie się po całym przepływie pracy od projektowania wykresów i interaktywnej eksploracji po dogłębną analizę danych, znacznie obniżając barierę tworzenia dzięki inteligentnym specyfikacjom projektowym i bogatej bibliotece komponentów. Zapewnia solidne wsparcie dla codziennego raportowania, dynamicznych pulpitów nawigacyjnych i zaawansowanych interaktywnych analiz, czyniąc dane widocznymi i zrozumiałymi. Pakiet zawiera wyspecjalizowane umiejętności, takie jak "wizualizacja-wykresów" do generowania ponad 26 typów wykresów, "kreator-infografik" do przekształcania tekstu w angażujące infografiki wizualne z ponad 50 szablonami oraz "wizualizacja-tekstu-narracyjnego" do przekształcania nieustrukturyzowanych danych w bogate semantycznie raporty przy użyciu składni T8. Te możliwości są dodatkowo wzmocnione przez integrację AI, usprawniając i automatyzując generowanie i optymalizację wizualizacji, umożliwiając analitykom większe skupienie się na odkrywaniu spostrzeżeń i podejmowaniu decyzji biznesowych. Programiści mogą również korzystać z dedykowanych umiejętności, takich jak "ekspert-antv-s2" do wielowymiarowych tabel analizy krzyżowej, "wykres-antv-g6" do generowania wizualizacji grafów G6 v5 oraz "wykres-antv-g2" do tworzenia wykresów statystycznych G2 v5. Narzędzia te dostarczają dokładny, gotowy do uruchomienia kod zgodny z najlepszymi praktykami, obejmujący podstawowe funkcjonalności, różne algorytmy układu, typy komponentów i interakcje. Umiejętności można zintegrować z projektami Node.js za pośrednictwem CLI lub API, oferując elastyczność dla różnych potrzeb programistycznych. ## Key features - **Wszechstronne generowanie wykresów**: Dostęp do ponad 26 inteligentnych typów wykresów do różnorodnych potrzeb wizualizacji danych, w tym szeregów czasowych, porównań, zależności i danych geograficznych. - **Tworzenie infografik oparte na AI**: Generuj piękne infografiki z treści tekstowej za pomocą ponad 50 szablonów, przekształcając informacje w zrozumiały język wizualny z intuicyjnymi symbolami. - **Strukturalne wizualizacje tekstu narracyjnego**: Konwertuj nieustrukturyzowane dane na bogate semantycznie raporty narracyjne za pomocą składni T8, języka podobnego do Markdown, do narracji danych z adnotacjami encji i miniwykresami. - **Wielowymiarowe tabele analizy krzyżowej**: Wykorzystaj AntV S2 Expert do tworzenia tabel przestawnych, arkuszy tabel i niestandardowych komórek, oferując kompleksowe wskazówki do analizy danych wielowymiarowych. - **Zaawansowane generowanie grafów i wykresów statystycznych**: Generuj dokładny kod grafów G6 dla grafów sieciowych, drzew i schematów blokowych oraz kod wykresów G2 dla wizualizacji statystycznych, takich jak wykresy słupkowe, liniowe i kołowe, zgodnie z najlepszymi praktykami. ## Use cases - **Twórz codzienne raporty i dynamiczne pulpity nawigacyjne**: Szybko przekształcaj złożone zestawy danych w intuicyjne wykresy wizualne do codziennych raportów i dynamicznych pulpitów, umożliwiając efektywne podejmowanie decyzji w oparciu o dane. - **Twórz zaawansowane interaktywne narzędzia analityczne**: Wykorzystaj solidny zestaw narzędzi AntV do budowy zaawansowanych interaktywnych aplikacji analitycznych, zapewniając dogłębną eksplorację danych i możliwości wizualizacji. - **Generuj wizualizacje zoptymalizowane pod kątem AI**: Usprawnij i zautomatyzuj generowanie i optymalizację wizualizacji danych dzięki zintegrowanym możliwościom AI, pozwalając analitykom skupić się na wnioskach. - **Przekształcaj dane w angażujące infografiki**: Konwertuj dane, informacje i wiedzę na atrakcyjne wizualnie infografiki, korzystając z różnych szablonów, aby przekazywać złożone idee w sposób jasny i zapadający w pamięć. ## Result preview Przeglądaj profesjonalny raport wizualizacji danych wspomagany sztuczną inteligencją, stworzony za pomocą tej Umiejętności. ![A chart visualizing 'Salary Distribution by Department' using box plots for Engineering, Design, Marketing, Sales, and Support. Each box plot shows median, interquartile ranges, whiskers, and outliers, with distinct color coding for each department. The chart clearly conveys salary spread and variability across departments.](https://file.nanoskill.ai/chart-outcome-1.png) ![A line chart titled 'Cumulative Growth Trajectory' showing growth over quarters from Q1 23 to Q4 24. Data points are labeled with numerical values and connected by a green line, with a shaded area beneath to highlight cumulative increase. The chart demonstrates steady upward growth from 1,200 to 6,100.](https://file.nanoskill.ai/chart-outcome-2.png) ![A composite image containing two data visualizations. The upper chart is a scatter plot titled 'Investment vs Performance' comparing investment amounts to performance scores for three groups, represented by color-coded circular markers of varying sizes. The lower chart is a bubble chart titled 'GDP vs Life Expectancy' showing GDP per capita versus life expectancy for countries including Japan, Sweden, USA, Germany, China, Brazil, India, and Kenya. Each country is represented by a colored bubble sized by an additional variable, highlighting global economic and health disparities.](https://file.nanoskill.ai/chart-outcome-3.png) ## Result walkthrough ### Zainstaluj Dodaj Umiejętność Wizualizacji Wykresów AntV do swojego agenta AI. ![A screenshot of an AI assistant terminal showing the installation of the AntV chart-visualization-skills package. The assistant logs the execution of the command to add the skills repository via 'npx skills add', confirms interactive selection with the '--yes' flag, and lists all 9 installed skills including chart generation, graph visualization, multi-dimensional tables, editing engines, infographics, narrative visualizations, and skill maintenance. The log notes symlinking into Hermes Agent and a security assessment showing low/medium risk with nothing critical.](https://file.nanoskill.ai/chart-visualization-install.png) ### Opisz Opisz obszar tematyczny, który chcesz zwizualizować, w tym cele, grupę docelową oraz preferowane typy lub style wykresów. ![A screenshot of an AI assistant task panel for creating a comprehensive AntV chart visualization package. The instructions specify generating multiple chart types, infographics from textual data with templates, and narrative-style reports. Emphasis is on a clean, modern, professional style, ensuring readability, hierarchy, interactivity, dynamic dashboards, drill-down exploration, cross-analysis, and production-ready code snippets for Node.js integration. The final output should be a structured PDF or interactive dashboard, balancing aesthetic elegance with functional clarity.](https://file.nanoskill.ai/chart-visualization-task.png) ### Optymalizuj wizualizacje Umiejętność generuje wykresy i pulpity nawigacyjne zoptymalizowane pod kątem przejrzystości, układu i spostrzeżeń. ![A screenshot showing the AI assistant output after loading AntV visualization skills and preparing a professional PowerPoint deck. The assistant indicates understanding of all AntV visualization tools and plans to build a data visualization showcase featuring real data across multiple chart types, infographics, narrative visualizations, network graphs, and S2 tables, ready for presentation in PPT format.](https://file.nanoskill.ai/chart-visualization-outcome.png) ## Skill definition # Umiejętności wizualizacji wykresów Przekształcanie danych w język wizualny dla lepszego myślenia. ## Przegląd W erze podejmowania decyzji opartych na danych, wydajna i dokładna wizualizacja i analiza danych są najważniejsze. AntV oferuje profesjonalny zestaw rozwiązań wizualizacyjnych, zapewniając solidny zestaw narzędzi i kompleksowy zestaw umiejętności dla całego przepływu pracy – od projektowania wykresów i interaktywnej eksploracji po dogłębną analizę danych. Umożliwia użytkownikom szybkie przekształcanie złożonych zbiorów danych w intuicyjne wykresy wizualne, znacznie obniżając barierę tworzenia dzięki inteligentnym specyfikacjom projektowym i bogatej bibliotece komponentów. Niezależnie od tego, czy chodzi o codzienne raportowanie, dynamiczne pulpity nawigacyjne czy zaawansowaną analizę interaktywną, AntV zapewnia niezawodne wsparcie. Dzięki integracji możliwości AI, narzędzia te dodatkowo usprawniają i automatyzują generowanie i optymalizację wizualizacji. Pozwala to analitykom bardziej skupić się na odkrywaniu wniosków i podejmowaniu decyzji biznesowych, naprawdę czyniąc dane widocznymi i zrozumiałymi. > [!WARNING] > Ten projekt tylko scala kod wygenerowany przez AI. > > **Jak wnieść wkład:** > 1. Zgłoś problem, jasno opisując problem > 2. Przypisz go do @copilot ze swoimi wymaganiami ## Użycie Dodaj ten marketplace do Claude Code: ```bash /plugin marketplace add antvis/chart-visualization-skills ``` Lub możesz bezpośrednio zainstalować umiejętności dla swoich wielu agentów: ```bash npx skills add antvis/chart-visualization-skills ``` ## Dostępne umiejętności - 📊 **chart-visualization**: Kompleksowa umiejętność generowania wykresów oparta na AntV, która oferuje ponad 26 typów wykresów do inteligentnej wizualizacji danych. `Chart Visualization` inteligentnie wybiera najbardziej odpowiedni typ wykresu spośród ponad 26 dostępnych opcji, wyodrębnia parametry na podstawie szczegółowych specyfikacji i generuje wysokiej jakości obrazy wykresów. Obejmuje szeregi czasowe, porównania, część-do-całości, relacje, geograficzne, hierarchiczne, statystyczne i specjalistyczne wizualizacje. - 🎨 **infographic-creator**: Twórz piękne infografiki na podstawie podanej treści tekstowej. Używaj, gdy użytkownicy proszą o tworzenie infografik. `Infographic Creator` wykorzystuje AntV Infographic do przekształcania danych, informacji i wiedzy w postrzegalny język wizualny. Łączy projektowanie wizualne z wizualizacją danych, oferując ponad 50 szablonów, w tym listy, sekwencje, hierarchie, porównania, relacje i wykresy. Kompresuje złożone informacje za pomocą intuicyjnych symboli, aby pomóc odbiorcom szybko zrozumieć i zapamiętać kluczowe punkty. - 🖼️ **icon-retrieval**: Wyszukuj i pobieraj ciągi SVG ikon z biblioteki ikon. Domyślnie zwraca do 5 pasujących ikon (możliwość dostosowania). `Icon Search` pomaga użytkownikom znaleźć odpowiednie ikony do różnych zastosowań, w tym infografik, tworzenia stron internetowych, projektowania i nie tylko. Wyszukuj według słów kluczowych, aby odkryć dostępne ikony i bezpośrednio pobrać ich ciągi SVG. Każde wyszukiwanie domyślnie zwraca do 5 pasujących ikon (możliwość dostosowania za pomocą parametru topK) wraz z adresami URL i pełną zawartością SVG. - 📝 **narrative-text-visualization**: Generuj strukturalne wizualizacje tekstu narracyjnego z danych przy użyciu składni T8. `Narrative Text Visualization` (T8) przekształca nieustrukturyzowane dane w bogate semantycznie raporty narracyjne przy użyciu składni T8 – deklaratywnego języka podobnego do Markdown do tworzenia narracji danych z adnotacjami encji. Jest przyjazny dla LLM i niezależny od frameworka, płynnie współpracując z HTML, React i Vue. Idealny do tworzenia raportów analizy danych, podsumowań i dokumentów wniosków z odpowiednio oznaczonymi encjami, takimi jak metryki, wartości, trendy i wymiary. Funkcje obejmują wbudowane mini wykresy, ustandaryzowany styl i profesjonalne formatowanie. Obsługuje autentyczne źródła danych i zapewnia lekkie, niezależne od technologii renderowanie. - 📋 **antv-s2-expert**: Asystent rozwoju wielowymiarowych tabel analizy krzyżowej S2. Używaj, gdy użytkownicy potrzebują pomocy z tabelami przestawnymi S2, arkuszami tabel lub dowolnym rozwojem związanym z @antv/s2. `AntV S2 Expert` pomaga użytkownikom rozwijać za pomocą silnika wielowymiarowych tabel analizy krzyżowej S2. Zapewnia kompleksowe wskazówki dotyczące silnika rdzenia `@antv/s2`, powiązań frameworków `@antv/s2-react` i `@antv/s2-vue`, zaawansowanych komponentów analizy `@antv/s2-react-components` i renderowania po stronie serwera `@antv/s2-ssr`. Obejmuje tabele przestawne, arkusze tabel, niestandardowe komórki, motywy, zdarzenia, interakcje, sortowanie, sumy, podpowiedzi, zamrożone wiersze/kolumny, ikony, paginację i więcej. - 🕸️ **antv-g6-graph**: Generator kodu wizualizacji grafów G6 v5. Używaj, gdy użytkownicy potrzebują wygenerować grafy G6 — grafy sieciowe, drzewa, schematy blokowe, mapy myśli i wszelkie wizualizacje danych relacyjnych lub o strukturze grafowej za pomocą biblioteki G6. `AntV G6 Graph` generuje dokładny, gotowy do uruchomienia kod G6 v5 zgodnie z najlepszymi praktykami. Obejmuje inicjalizację rdzenia grafu, struktury danych (węzły, krawędzie, combo), ponad 10 algorytmów układu (force, dagre, circular, grid, mindmap, fishbone itp.), wszystkie wbudowane typy węzłów/krawędzi/combo, zarządzanie stanem, ponad 15 zachowań (drag-canvas, zoom-canvas, click-select, lasso itp.), ponad 10 wtyczek (minimap, tooltip, toolbar, legend, timebar itp.), rozwój niestandardowych elementów, transformacje i animację. Wbudowane zabezpieczenia zapobiegają powszechnym pułapkom migracji z v4 do v5, takim jak używanie przestarzałych konstruktorów `G6.Graph()`, API `graph.data()` lub konfiguracji zachowań opartej na trybach. - 📈 **antv-g2-chart**: Generator kodu wykresów G2 v5. Używaj, gdy użytkownicy potrzebują wygenerować wykresy G2 — wykresy słupkowe, liniowe, kołowe, punktowe, warstwowe, mapy cieplne i wszelkie wizualizacje danych statystycznych za pomocą biblioteki G2. `AntV G2 Chart` generuje dokładny, gotowy do uruchomienia kod G2 v5 zgodnie z najlepszymi praktykami trybu specyfikacji. Obejmuje ponad 30 typów wykresów (interval, line, area, point, rect, cell, treemap, sankey, chord, wordCloud, gauge i inne), transformacje danych (stackY, dodgeX, binX, fold itp.), układy współrzędnych (kartezjański, biegunowy, theta, radialny), skale, interakcje (brush, slider, filtr legendy), komponenty (oś, legenda, podpowiedź, adnotacja) i kompozycje wielowidokowe. Wbudowane zabezpieczenia zapobiegają powszechnym pułapkom migracji z v4 do v5, takim jak używanie przestarzałych interfejsów API łańcuchowych, nieprawidłowych nazw palet lub odwoływanie się do `d3` w kodzie użytkownika. **Wyniki oceny** Podejście Harness Engineering zostało rygorystycznie przetestowane na 174 przypadkach testowych generowania wykresów, wykazując znaczną poprawę w stosunku do metod bazowych: | **Model** | **G2** | **G6** | | :---: | :---: | :---: | | qwen3-coder-480b-a35b-instruct | ✨ 98.2% +17.7% | 94.8% +15.6% | | Kimi-K2.5 | 97.7% +17.2% | 96.9% +17.7% | | GLM-5.1 | 93.6% +13.1% | 92.8% +13.6% | | DeepSeek-V3.2 | 90.8% +10.3% | ✨ 97.9% +18.7% | | Context7 Linia bazowa | 80.5% | 79.2% | Wyniki pokazują, że Harness Engineering umożliwia LLM-om osiągnięcie dokładności zbliżonej do produkcyjnej (do 98,2%), znacznie przewyższając podejście bazowe Context7. > [!TIP] > Wkrótce więcej umiejętności. ## Użycie biblioteki Może być używana jako biblioteka w projektach Node.js z `CLI` i `API`. ### Użycie CLI Udostępniamy również narzędzie CLI o nazwie `antv` do łatwego użycia w terminalu, zainstaluj globalnie: ```bash npm install -g @antv/chart-visualization-skills ``` **Pobieraj lub wyświetlaj umiejętności za pomocą zapytania**: ```bash # Pobierz umiejętności za pomocą zapytania (tylko metadane) antv retrieve "bar chart" --library g2 --topk 10 # Pobierz umiejętności z pełną zawartością markdown (automatycznie dołączane podstawowe ograniczenia) antv retrieve "bar chart" --library g2 --content # Pobierz umiejętności i wypisz jako JSON antv retrieve "bar chart" --library g2 --output json # Pobierz umiejętność według dokładnego ID antv get g2-mark-interval-basic --library g2 # Wyświetl wszystkie dostępne umiejętności antv list --library g2 --category core # Wyświetl umiejętności i wypisz jako JSON antv list --output json # Pokaż informacje o umiejętności (podstawowe ograniczenia z SKILL.md) antv info --library g2 # Pokaż informacje o umiejętności jako JSON antv info --library g2 --output json ``` **Użycie polecenia**: ``` Usage: antv [options] [command] CLI tool for AntV chart visualization skills retrieval Options: -V, --version output the version number -h, --help display help for command Commands: retrieve [options] Search for skills matching a query get [options] Get a skill by its exact ID list [options] List all available skills info [options] Show skill info from SKILL.md help [command] display help for command Options for retrieve: --library Filter by library (e.g. g2, g6) --topk Number of results to return (default: 7) --content Include markdown content body in results; core constraints (SKILL.md Section 1-2) are always prepended as the first result --output Output format: json | text (default: "text") ``` > Uwaga: `--content` zawsze dołącza podstawowe ograniczenia biblioteki (Sekcja 1 i 2 SKILL.md, aż do znacznika ``) jako pierwszy wynik, zapewniając, że model otrzymuje podstawowe reguły wraz z dokumentami referencyjnymi. ### Użycie API ```typescript import { retrieve } from '@antv/chart-visualization-skills'; // Metadata only (no content) const skills = retrieve('bar chart', { library: 'g2', topK: 5 }); // With full markdown content (core constraints auto-prepended as first result) const skills = retrieve('bar chart', { library: 'g2', topK: 5, content: true }); // With content but without core constraints const skills = retrieve('bar chart', { library: 'g2', topK: 5, content: true, includeInfo: false }); ``` ```typescript retrieve(query: string, options?: RetrieveOptions): Skill[] interface RetrieveOptions { library?: string; // Library filter, e.g. 'g2' or 'g6' topK?: number; // Number of results (default: 7) content?: boolean; // Include markdown content body (default: false) includeInfo?: boolean; // Prepend SKILL.md core constraints (default: same as content) } ``` | Opcja | Typ | Domyślnie | Opis | | :--- | :--- | :--- | :--- | | `library` | `string` | all | Filtr biblioteki (`g2` lub `g6`) | | `topK` | `number` | `7` | Liczba wyników | | `content` | `boolean` | `false` | Dołącz treść markdown | | `includeInfo` | `boolean` | taki jak `content` | Dołącz podstawowe ograniczenia z SKILL.md (Sekcja 1-2) jako pierwszy wynik | > Uwagi: > - Domyślne pobieranie zwraca lekkie obiekty wynikowe bez pola `content`. > - `content: true` zwraca treść markdown (metadane frontmatter są wykluczone). > - Gdy `includeInfo` jest prawdą (domyślnie gdy `content: true`), blok podstawowych ograniczeń — SKILL.md aż do `` — jest wstrzykiwany jako pierwszy element (id z prefiksem `__info__`), zapewniając, że model zawsze widzi podstawowe reguły. ```typescript import { info } from '@antv/chart-visualization-skills'; const skillInfo = info('g2'); // => { name: 'antv-g2-chart', description: '...', content: '...', constraintsContent: '...' } ``` ```typescript info(library?: string): SkillInfo | undefined interface SkillInfo { name: string; description: string; content: string; // Full SKILL.md body (after frontmatter) constraintsContent: string; // SKILL.md body up to marker; injected by retrieve when includeInfo: true } ``` | Parametr | Typ | Domyślnie | Opis | | :--- | :--- | :--- | :--- | | `library` | `string` | `'g2'` | Biblioteka, dla której pobrać informacje (`g2` lub `g6`) | ## Licencja Licencja MIT - szczegóły w pliku [LICENSE](LICENSE). ## FAQ ### Czym są umiejętności wizualizacji wykresów AntV? Umiejętności wizualizacji wykresów AntV to zestaw narzędzi i możliwości opartych na AntV, zaprojektowanych w celu efektywnego i dokładnego wizualizowania oraz analizowania danych. Obejmują one funkcje generowania wykresów, tworzenia infografik, wizualizacji tekstu narracyjnego oraz tworzenia specjalistycznych grafów i wykresów statystycznych. ### Ile typów wykresów obsługuje umiejętność wizualizacji wykresów? Umiejętność wizualizacji wykresów oferuje ponad 26 typów wykresów do inteligentnej wizualizacji danych, obejmując szeroki zakres reprezentacji danych, w tym szeregi czasowe, porównania, zależności i dane geograficzne. ### Czy mogę tworzyć infografiki za pomocą tych umiejętności? Tak, umiejętność tworzenia infografik umożliwia tworzenie pięknych infografik na podstawie podanej treści tekstowej. Wykorzystuje AntV Infographic i oferuje ponad 50 szablonów do przekształcania danych w zrozumiały język wizualny. ### Czym jest wizualizacja tekstu narracyjnego (składnia T8)? Wizualizacja tekstu narracyjnego (T8) przekształca nieustrukturyzowane dane w bogate semantycznie raporty narracyjne za pomocą składni T8, deklaratywnego języka podobnego do Markdown. Jest przeznaczona do tworzenia narracji danych z adnotacjami encji, miniwykresami i profesjonalnym formatowaniem, odpowiednich do raportów analitycznych i dokumentów z wnioskami. ### W jaki sposób umiejętności wizualizacji wykresów AntV pomagają w analizie wielowymiarowej? Umiejętność antv-s2-expert pełni rolę asystenta programistycznego dla silnika wielowymiarowych tabel analizy krzyżowej S2. Zapewnia kompleksowe wskazówki dotyczące pracy z tabelami przestawnymi, arkuszami tabel, niestandardowymi komórkami i różnymi innymi funkcjami @antv/s2. ### Czy istnieją narzędzia do generowania konkretnych grafów i wykresów statystycznych? Tak, umiejętność antv-g6-graph generuje kod G6 v5 do wizualizacji grafów, takich jak grafy sieciowe, drzewa i schematy blokowe. Umiejętność antv-g2-chart generuje kod G2 v5 do wykresów statystycznych, takich jak wykresy słupkowe, liniowe, kołowe i punktowe, zgodnie z najlepszymi praktykami.