Umiejętności agenta wizualizacji wykresów

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:

/plugin marketplace add antvis/chart-visualization-skills

Lub możesz bezpośrednio zainstalować umiejętności dla swoich wielu agentów:

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:

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:

npm install -g @antv/chart-visualization-skills

Pobieraj lub wyświetlaj umiejętności za pomocą zapytania:

# 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] <query>  Search for skills matching a query
  get [options] <id>          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 <lib>             Filter by library (e.g. g2, g6)
  --topk <n>                  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 <format>           Output format: json | text (default: "text")

Uwaga: --content zawsze dołącza podstawowe ograniczenia biblioteki (Sekcja 1 i 2 SKILL.md, aż do znacznika <!-- CONSTRAINTS:END -->) jako pierwszy wynik, zapewniając, że model otrzymuje podstawowe reguły wraz z dokumentami referencyjnymi.

Użycie API

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 });

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)
}

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 <!-- CONSTRAINTS:END --> — jest wstrzykiwany jako pierwszy element (id z prefiksem __info__), zapewniając, że model zawsze widzi podstawowe reguły.

import { info } from '@antv/chart-visualization-skills';

const skillInfo = info('g2');
// => { name: 'antv-g2-chart', description: '...', content: '...', constraintsContent: '...' }

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 <!-- CONSTRAINTS:END --> marker; injected by retrieve when includeInfo: true
}

Licencja

Licencja MIT - szczegóły w pliku LICENSE.