Kullanım kılavuzuna geç
AntV G2 Chartyazan antvis

AntV G2 Chart Skill.

Başka grafik kütüphanelerinin sözdizimini karıştırmak yerine G2 v5 gramerini bilinçli şekilde kullanın.

  • Data Visualization
  • Grafikler
  • JavaScript
Kaynak İncelemesi · AntV G2 ChartSKILL.md
Görev Data Visualization Çıktılar • Kapsayıcı ve render kurulumu içeren eksiksiz bir G2 v5 grafik tanımı. • Düzeltilmiş mark, kodlama, dönüşüm ve kompozisyon seçimleri. • Etiketlerin, renk anlamlarının, ipuçlarının (tooltip) ve veri anlamının grafiğe özgü incelemesi. Başlamadan Önce @antv/g2 v5 veya belgelenmiş tarayıcı paketi gerekir. İsteğe bağlı referans alımı harici AntV bağlam hizmetini kullanır.
Editoryal özet · kaynak incelendi 2026-10-07 · üretilmiş bir örnek değildir

01 İşlevler

G2 v5 Spec Modunda Grafik Yazın

Bildirimsel spec kurallarını, hedefli referans alımını, yaygın hataların önlenmesini ve veriye duyarlı görsel seçimleri birleştiren bir G2 v5 uygulama rehberi.

Kaynağa dayalı iş akışıÇalıştırma kıyaslaması değildir

Çalışma Yaklaşımı

AntV G2 Chart, @antv/g2 v5 ile grafik uygulamasına odaklanır. Üretilen örneklere eksiksiz bir bildirimsel tanımla başlar; eksik kapsayıcılar, yanlış mark adları, tekil etiket özellikleri ve yanlış yerleştirilmiş dönüşümler gibi yaygın hata noktalarını kapsar. Ayrıca hedefli G2 kavramları ve örnekleri için bir dokümantasyon alım uç noktası sunar.

Kaynak, çoklu mark kompozisyonu konusunda özellikle nettir: çizgi ve noktalar, kök tipinin tekrar tekrar değiştirilmesi yerine bir view'ın children alanında yer alır. Görsel rehberliği, motorun varsayılanlarını Skill'in seçtiği geçersiz kılmalardan ayırır; birimlerin, kaynak etiketlerinin ve başlıkların yalnızca anlamları bilindiğinde eklenmesini ister. Grafikler için olsa da grafik (graph) ağları, diyagram editörleri veya pivot tablolar için genel bir AntV aracı değildir.

Beklenen Çıktılar

  • Kapsayıcı ve render kurulumu içeren eksiksiz bir G2 v5 grafik tanımı.
  • Düzeltilmiş mark, kodlama, dönüşüm ve kompozisyon seçimleri.
  • Etiketlerin, renk anlamlarının, ipuçlarının ve veri anlamının grafiğe özgü incelemesi.
Örnek Brife Göz Atın

Brifden İncelemeye

  1. 01
    Veriyi ve Amacı Okuyun

    Eksik anlamlar uydurmadan alanları, birimleri, karşılaştırma ihtiyaçlarını ve grafik sorusunu belirleyin.

  2. 02
    İlgili Referansı Alın

    API veya grafik türü ayrıntılarının doğrulanması gerektiğinde belgelenmiş G2 alım hizmetini kullanın.

  3. 03
    Eksiksiz Bir Spec Oluşturun

    Geçerli mark'ları ve kanalları seçin, dönüşüm dizilerini kullanın ve bindirmeleri bir view içinde oluşturun.

  4. 04
    Render Edin ve İnceleyin

    Hedef kapsayıcıda gerçek mark'ları, etiketleri, göstergeleri, temaları ve yoğun veri davranışını kontrol edin.

02 Kullanım Alanları

Ne Zaman Kullanılır?

@antv/g2 v5 veya belgelenmiş tarayıcı paketi gerekir. İsteğe bağlı referans alımı harici AntV bağlam hizmetini kullanır.

İyi Bir Uyum

  • G2 v5 UygulamasıGrafikleri kütüphanenin bildirimsel spec stiliyle oluşturmak için kullanışlıdır.
  • Geçiş ve Hata AyıklamaEski G2 kullanımından veya diğer görselleştirme gramerlerinden kopyalanan sözdizimini belirlemeye yardımcı olur.
  • Çoklu Mark'lı GrafiklerBağımsız bindirmelerin nasıl oluşturulması gerektiğini netleştirir.

Kontrol Edilecek Sınırlar

  • Her AntV Kütüphanesi DeğilG6 ağları, X6 diyagramları ve S2 pivot tabloları belirtilen kapsamın dışındadır.
  • Render Etmek Veri Doğrulaması DeğildirDoğru render edilmesi; verinin, toplulaştırmanın veya yorumun geçerli olduğunu göstermez.
  • Referanslar Ağ Erişimi GerektirirBelgelenmiş alım uç noktası harici bir hizmettir; kullanıldığında erişilebilirliği kontrol edilmelidir.

Bu Girdileri Getirin

  • Veri Kümesi ve Alan AnlamlarıGerçek değerleri, türleri, birimleri ve izin verilen toplulaştırmayı sağlayın.
  • Görselleştirme SorusuGrafiğin neyi karşılaştırması veya ortaya koyması gerektiğini açıklayın.
  • Çalışma Zamanı BağlamıG2 sürümünü, kapsayıcıyı, temayı ve etkileşim gereksinimlerini belirtin.

03 Önemli Kararlar

Önemli Kararlar

  1. Eksiksiz Başlangıç Spec'leri

    Tam bir spec, üretilen grafiği kısmi kök değişiklikleri dizisinden daha kolay anlaşılır kılar.

  2. Anlamlı Renk

    Renk, tek serili bir karşılaştırmaya gökkuşağı eklemek yerine anlamlı bir grubu veya durumu kodlamalıdır.

  3. Varsayılanlar ve Geçersiz Kılmalar Farklıdır

    Kaynak, seçilen yarıçap, genişlik ve opaklık değerlerini geçersiz kıldıkları motor davranışından ayırır.

04 Örnek Görev Tanımı

Odaklı Bir Brif Deneyin

Aşağıdaki örnek brif test edilmemiştir. Kullanmadan önce skill'in kurulumunu kontrol edin.

Kurulumu İnceleyin

Skill'i deponun desteklenen yoluyla kurun ve uygun şekilde @antv/g2 paketini hedef uygulamaya ekleyin. Grafik paketi ile agent Skill'i ayrı bağımlılıklardır.

Yukarı Akış Kaynak Dosyası
https://github.com/antvis/chart-visualization-skills/blob/a105fa12a9fa41fccccc2eba7f4b34973628f5d3/skills/antv-g2-chart/SKILL.md

@antv/g2 v5 veya belgelenmiş tarayıcı paketi gerekir. İsteğe bağlı referans alımı harici AntV bağlam hizmetini kullanır.

Tek Bir Çıktıyla Başlayın

Skill'i çalıştırmadan önce bu brifteki kapsamı, kaynak materyali ve kısıtları uyarlayın.

Örnek Brif
Sağlanan aylık gelir verisinden bir G2 v5 grafiği oluşturmak için antv-g2-chart kullan. Bir çizgiyi ve noktaları view ile children kullanarak bindir, sağlanan para birimlerini koru, açık bir kapsayıcı ve render çağrısı içeren eksiksiz bir başlangıç spec'i kullan. Gereksiz renk göstergelerinden kaçın ve yoğun etiketleri eklemeden önce kontrol et.

Sonucu İnceleyin

Gerçek çıktıyı bu gözlemlenebilir ölçütlere göre kontrol edin.

  • Grafikte açık bir kapsayıcı ve render çağrısı vardır.
  • Bindirme mark'ları, bir view'ın bağımsız children öğeleri olarak oluşturulmuştur.
  • Etiketler, birimler ve renk kodlamaları sağlanan verinin anlamıyla uyumludur.

OpenDesign, kodlama agent'ları için yerel bir tasarım çalışma alanı sağlar. Bu liste, skill'in pakete dahil olduğu veya harici araçlarının, kimlik bilgilerinin ve yazılım bağımlılıklarının dahil olduğu anlamına gelmez.

05 Kaynak ve Lisans

Kaynak ve Lisans

Bu sayfa, aşağıda bağlantısı verilen sabitlenmiş kaynak revizyonunu açıklar. Yukarı akış davranışı ve gereksinimleri değişebilir.

Kaynak Sahibi
antvis
Lisans
MIT
İncelenen Anlık Görüntü
2026-10-07 · a105fa12a9fa
Editoryal Kaynak Özeti
Bildirimsel spec kurallarını, hedefli referans alımını, yaygın hataların önlenmesini ve veriye duyarlı görsel seçimleri birleştiren bir G2 v5 uygulama rehberi.

Bağlantısı verilen kaynağa dayanan, OpenDesign tarafından hazırlanmış özgün özet. Depo yıldızları tarihli bir popülerlik göstergesidir; skill kullanımını veya kalite puanını göstermez.

06 Başlamadan Önce Sorular

Başlamadan Önce Sorular

Kök tipini iki kez değiştirerek mark'ları bindirebilir miyim?

Kaynak hayır diyor: bu, bağımsız bindirmeler oluşturmak yerine kök mark'ı günceller. children içeren bir view kullanın.

G6 ağ diyagramlarını kapsıyor mu?

Hayır. Kaynak, G6, X6 ve S2 görevlerini bu G2 grafik Skill'inin dışında tutar.

Önerilen stil değerleri G2 motorunun varsayılanları mı?

Hepsi değil. Kaynak, önerilen açık geçersiz kılmaları motorun kendi varsayılanlarından ayırır.

OpenDesign

Bir Sonraki Tasarım Yinelemesine Yer Açın.

Brifinizi, kaynak materyalinizi ve tasarım çalışmanızı yerel bir çalışma alanında bir arada tutun. İş akışınıza eklemeden önce skill'in kendi kurulumunu kontrol edin.

Yukarı Akış Kaynak Dosyası
https://github.com/antvis/chart-visualization-skills/blob/a105fa12a9fa41fccccc2eba7f4b34973628f5d3/skills/antv-g2-chart/SKILL.md