# ทักษะเอเจนต์การสร้างภาพแผนภูมิ

> เปลี่ยนชุดข้อมูลที่ซับซ้อนให้เป็นแผนภูมิภาพที่เข้าใจง่ายด้วยทักษะการสร้างภาพแผนภูมิ AntV ที่มีประเภทแผนภูมิมากกว่า 26 ประเภทและการสร้างด้วย AI เริ่มต้นสร้างเรื่องราวข้อมูลที่ทรงพลังได้อย่างง่ายดาย

- Canonical: https://nanoskill.ai/th/skills/chart-visualization-skills
- Markdown: https://nanoskill.ai/th/skills/chart-visualization-skills.md
- Author: antvis
- Published: 2026-06-09T05:00:00.000Z
- Updated: 2026-07-25T04:33:38.870Z
- Language: th
- 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

ทักษะการสร้างภาพแผนภูมิ AntV นำเสนอชุดโซลูชันการสร้างภาพระดับมืออาชีพที่ออกแบบมาเพื่อเปลี่ยนชุดข้อมูลที่ซับซ้อนให้เป็นแผนภูมิภาพที่เข้าใจง่ายอย่างมีประสิทธิภาพและแม่นยำ ทักษะชุดนี้ริเริ่มโดย Ant Group ช่วยให้ผู้ใช้สามารถดำเนินการได้ตลอดทั้งกระบวนการตั้งแต่การออกแบบแผนภูมิและการสำรวจแบบโต้ตอบไปจนถึงการวิเคราะห์ข้อมูลเชิงลึก ซึ่งลดอุปสรรคในการสร้างลงอย่างมากผ่านข้อกำหนดการออกแบบที่ชาญฉลาดและคลังส่วนประกอบที่หลากหลาย ให้การสนับสนุนที่แข็งแกร่งสำหรับการรายงานประจำวัน แดชบอร์ดแบบไดนามิก และการวิเคราะห์เชิงโต้ตอบที่ซับซ้อน ทำให้ข้อมูลปรากฏเป็นภาพและเข้าใจได้

ชุดทักษะนี้รวมถึงทักษะเฉพาะทาง เช่น “chart-visualization” สำหรับการสร้างแผนภูมิมากกว่า 26 ประเภท “infographic-creator” สำหรับการเปลี่ยนข้อความให้เป็นอินโฟกราฟิกภาพที่น่าสนใจด้วยเทมเพลตมากกว่า 50 แบบ และ “narrative-text-visualization” สำหรับการแปลงข้อมูลที่ไม่มีโครงสร้างให้เป็นรายงานที่อุดมไปด้วยความหมายโดยใช้ไวยากรณ์ T8 ความสามารถเหล่านี้ได้รับการปรับปรุงเพิ่มเติมด้วยการผสานรวม AI ทำให้การสร้างและเพิ่มประสิทธิภาพการแสดงภาพเป็นไปอย่างราบรื่นและอัตโนมัติ ช่วยให้นักวิเคราะห์มุ่งเน้นไปที่การค้นพบข้อมูลเชิงลึกและการขับเคลื่อนการตัดสินใจทางธุรกิจได้มากขึ้น

นักพัฒนายังสามารถใช้ประโยชน์จากทักษะเฉพาะ เช่น “antv-s2-expert” สำหรับตารางวิเคราะห์ข้ามมิติหลายมิติ “antv-g6-graph” สำหรับการสร้างภาพกราฟ G6 v5 และ “antv-g2-chart” สำหรับการสร้างแผนภูมิสถิติ G2 v5 เครื่องมือเหล่านี้ให้โค้ดที่แม่นยำและสามารถรันได้ตามแนวปฏิบัติที่ดีที่สุด ครอบคลุมฟังก์ชันหลัก อัลกอริทึมเค้าโครงต่างๆ ประเภทส่วนประกอบ และการโต้ตอบ ทักษะเหล่านี้สามารถผสานรวมเข้ากับโปรเจกต์ Node.js ผ่าน CLI หรือ API เพื่อความยืดหยุ่นสำหรับความต้องการในการพัฒนาที่แตกต่างกัน

## Key features

- **การสร้างแผนภูมิที่ครอบคลุม**: เข้าถึงแผนภูมิอัจฉริยะมากกว่า 26 ประเภท สำหรับความต้องการด้านการแสดงภาพข้อมูลที่หลากหลาย ทั้งอนุกรมเวลา การเปรียบเทียบ ความสัมพันธ์ และข้อมูลภูมิศาสตร์
- **การสร้างอินโฟกราฟิกด้วย AI**: สร้างอินโฟกราฟิกที่สวยงามจากเนื้อหาข้อความ โดยใช้เทมเพลตมากกว่า 50 แบบ แปลงข้อมูลให้เป็นภาษาภาพที่รับรู้ได้ด้วยสัญลักษณ์ที่เข้าใจง่าย
- **การแสดงภาพข้อความเชิงบรรยายที่มีโครงสร้าง**: แปลงข้อมูลที่ไม่มีโครงสร้างให้เป็นรายงานเชิงบรรยายที่มีความหมายสมบูรณ์ โดยใช้ไวยากรณ์ T8 ซึ่งเป็นภาษาคล้าย Markdown สำหรับเรื่องเล่าจากข้อมูล พร้อมคำอธิบายประกอบเอนทิตีและแผนภูมิขนาดเล็ก
- **ตารางวิเคราะห์ข้ามมิติหลายมิติ**: ใช้ AntV S2 Expert สำหรับการพัฒนาตารางพิวอท ชีตตาราง และเซลล์แบบกำหนดเอง โดยให้คำแนะนำที่ครอบคลุมสำหรับการวิเคราะห์ข้อมูลหลายมิติ
- **การสร้างแผนภูมิกราฟและแผนภูมิสถิติขั้นสูง**: สร้างโค้ดกราฟ G6 ที่แม่นยำสำหรับแผนภูมิเครือข่าย แผนภูมิต้นไม้ และผังงาน และสร้างโค้ดแผนภูมิ G2 สำหรับการแสดงภาพสถิติ เช่น แผนภูมิแท่ง แผนภูมิเส้น และแผนภูมิวงกลม โดยปฏิบัติตามแนวทางปฏิบัติที่ดีที่สุด

## Use cases

- **สร้างรายงานประจำวันและแดชบอร์ดแบบไดนามิก**: แปลงชุดข้อมูลที่ซับซ้อนให้เป็นแผนภูมิภาพที่เข้าใจง่ายอย่างรวดเร็ว สำหรับการรายงานประจำวันและแดชบอร์ดแบบไดนามิก ช่วยให้การตัดสินใจที่ขับเคลื่อนด้วยข้อมูลมีประสิทธิภาพ
- **พัฒนาเครื่องมือวิเคราะห์เชิงโต้ตอบที่ซับซ้อน**: ใช้ชุดเครื่องมืออันแข็งแกร่งของ AntV เพื่อสร้างแอปพลิเคชันการวิเคราะห์เชิงโต้ตอบขั้นสูง ให้ความสามารถในการสำรวจและแสดงภาพข้อมูลเชิงลึก
- **สร้างการแสดงภาพที่ปรับให้เหมาะสมด้วย AI**: ปรับปรุงและทำให้การสร้างและเพิ่มประสิทธิภาพของการแสดงภาพข้อมูลเป็นไปโดยอัตโนมัติ ด้วยความสามารถ AI ในตัว ช่วยให้นักวิเคราะห์มุ่งเน้นไปที่ข้อมูลเชิงลึก
- **แปลงข้อมูลให้เป็นอินโฟกราฟิกที่น่าสนใจ**: แปลงข้อมูล สารสนเทศ และความรู้ให้เป็นอินโฟกราฟิกที่ดึงดูดสายตา โดยใช้เทมเพลตที่หลากหลาย เพื่อสื่อสารแนวคิดที่ซับซ้อนอย่างชัดเจนและน่าจดจำ

## Result preview

สำรวจรายงานการสร้างภาพข้อมูลที่ขับเคลื่อนด้วย AI ระดับมืออาชีพซึ่งขับเคลื่อนโดยทักษะนี้

![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

### ติดตั้ง

เพิ่มทักษะการสร้างภาพแผนภูมิ AntV ให้กับเอเจนต์ 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)

### อธิบาย

อธิบายหัวข้อที่คุณต้องการให้แสดงภาพ รวมถึงวัตถุประสงค์ กลุ่มเป้าหมาย และประเภทแผนภูมิหรือสไตล์ที่ต้องการ

![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)

### เพิ่มประสิทธิภาพการแสดงภาพ

ทักษะนี้สร้างแผนภูมิและแดชบอร์ดที่เพิ่มประสิทธิภาพเพื่อความชัดเจน เค้าโครง และข้อมูลเชิงลึก

![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

# ทักษะการสร้างภาพข้อมูลด้วยแผนภูมิ

เปลี่ยนข้อมูลให้เป็นภาษาภาพเพื่อช่วยในการคิดวิเคราะห์

## ภาพรวม

ในยุคของการตัดสินใจด้วยข้อมูลเป็นหลัก การสร้างภาพข้อมูลและการวิเคราะห์ข้อมูลที่มีประสิทธิภาพและแม่นยำเป็นสิ่งสำคัญยิ่ง AntV นำเสนอชุดโซลูชันการสร้างภาพข้อมูลระดับมืออาชีพ พร้อมด้วยชุดเครื่องมือที่แข็งแกร่งและชุดทักษะที่ครอบคลุมสำหรับกระบวนการทำงานทั้งหมด—ตั้งแต่การออกแบบแผนภูมิ การสำรวจเชิงโต้ตอบ ไปจนถึงการวิเคราะห์ข้อมูลเชิงลึก ช่วยให้ผู้ใช้สามารถเปลี่ยนชุดข้อมูลที่ซับซ้อนให้เป็นแผนภูมิภาพที่เข้าใจง่ายได้อย่างรวดเร็ว ลดอุปสรรคในการสร้างผ่านข้อกำหนดการออกแบบอัจฉริยะและคลังส่วนประกอบที่หลากหลาย ไม่ว่าจะเป็นรายงานประจำวัน แดชบอร์ดแบบไดนามิก หรือการวิเคราะห์เชิงโต้ตอบที่ซับซ้อน AntV มอบการสนับสนุนที่น่าเชื่อถือ ด้วยการผสานความสามารถด้าน AI เครื่องมือเหล่านี้ยังช่วยปรับปรุงและทำให้การสร้างและเพิ่มประสิทธิภาพของภาพเป็นไปโดยอัตโนมัติมากยิ่งขึ้น ช่วยให้นักวิเคราะห์มุ่งเน้นไปที่การค้นพบข้อมูลเชิงลึกและขับเคลื่อนการตัดสินใจทางธุรกิจได้ดียิ่งขึ้น ทำให้ข้อมูลมองเห็นและเข้าใจได้อย่างแท้จริง

> [!WARNING]
> โครงการนี้รวมเฉพาะโค้ดที่สร้างโดย AI
>
> **วิธีการมีส่วนร่วม:**
> 1. ส่ง issue โดยอธิบายปัญหาอย่างชัดเจน
> 2. กำหนดให้ @copilot พร้อมข้อกำหนดของคุณ

## การใช้งาน

เพิ่มตลาดนี้ไปยัง Claude Code:
```bash
/plugin marketplace add antvis/chart-visualization-skills
```

หรือคุณสามารถติดตั้งทักษะเหล่านี้สำหรับหลายเอเจนต์ของคุณโดยตรง:

```bash
npx skills add antvis/chart-visualization-skills
```

## ทักษะที่พร้อมใช้งาน

- 📊 **chart-visualization**: ทักษะการสร้างแผนภูมิที่ครอบคลุม ขับเคลื่อนโดย AntV ซึ่งมีแผนภูมิมากกว่า 26 ประเภทสำหรับการสร้างภาพข้อมูลอย่างชาญฉลาด

`Chart Visualization` เลือกประเภทแผนภูมิที่เหมาะสมที่สุดจากกว่า 26 ตัวเลือกอย่างชาญฉลาด ดึงพารามิเตอร์ตามข้อกำหนดโดยละเอียด และสร้างภาพแผนภูมิคุณภาพสูง ครอบคลุมการแสดงผลแบบอนุกรมเวลา การเปรียบเทียบ สัดส่วน ความสัมพันธ์ ภูมิศาสตร์ ลำดับชั้น สถิติ และเฉพาะทาง

- 🎨 **infographic-creator**: สร้างอินโฟกราฟิกสวยงามจากเนื้อหาข้อความที่กำหนด ใช้เมื่อผู้ใช้ขอให้สร้างอินโฟกราฟิก

`Infographic Creator` ใช้ AntV Infographic เพื่อแปลงข้อมูล สารสนเทศ และความรู้ให้เป็นภาษาภาพที่รับรู้ได้ ผสมผสานการออกแบบภาพเข้ากับการแสดงข้อมูล ให้แม่แบบกว่า 50 แบบ รวมถึงรายการ ลำดับ ลำดับชั้น การเปรียบเทียบ ความสัมพันธ์ และแผนภูมิ บีบอัดข้อมูลที่ซับซ้อนด้วยสัญลักษณ์ที่เข้าใจง่ายเพื่อช่วยผู้ชมเข้าใจและจดจำประเด็นสำคัญได้อย่างรวดเร็ว

- 🖼️ **icon-retrieval**: ค้นหาและดึงสตริง SVG ของไอคอนจากคลังไอคอน ส่งคืนไอคอนที่ตรงกันสูงสุด 5 รายการตามค่าเริ่มต้น (ปรับแต่งได้)

`Icon Search` ช่วยผู้ใช้ค้นหาไอคอนที่เหมาะสมสำหรับกรณีการใช้งานต่างๆ รวมถึงอินโฟกราฟิก การพัฒนาเว็บ การออกแบบ และอื่นๆ ค้นหาด้วยคีย์เวิร์ดเพื่อค้นหาไอคอนที่มีและดึงสตริง SVG โดยตรง การค้นหาแต่ละครั้งส่งคืนไอคอนที่ตรงกันสูงสุด 5 รายการตามค่าเริ่มต้น (ปรับแต่งได้ผ่านพารามิเตอร์ topK) พร้อม URL และเนื้อหา SVG ทั้งหมด

- 📝 **narrative-text-visualization**: สร้างภาพข้อมูลข้อความบรรยายที่มีโครงสร้างจากข้อมูลโดยใช้ T8 Syntax

`Narrative Text Visualization` (T8) แปลงข้อมูลที่ไม่มีโครงสร้างให้เป็นรายงานบรรยายที่เต็มไปด้วยความหมายโดยใช้ T8 Syntax ซึ่งเป็นภาษาที่มีลักษณะคล้าย Markdown แบบประกาศสำหรับการสร้างการเล่าเรื่องข้อมูลด้วยคำอธิบายประกอบเอนทิตี เป็นมิตรกับ LLM และไม่ขึ้นกับเฟรมเวิร์ก ทำงานร่วมกับ HTML, React, และ Vue ได้อย่างราบรื่น เหมาะสำหรับการสร้างรายงานวิเคราะห์ข้อมูล บทสรุป และเอกสารข้อมูลเชิงลึกที่มีเอนทิตี เช่น เมตริก ค่า แนวโน้ม และมิติที่ติดป้ายกำกับอย่างเหมาะสม คุณสมบัติรวมถึงแผนภูมิขนาดเล็กในตัว การจัดรูปแบบมาตรฐาน และรูปแบบมืออาชีพ รองรับแหล่งข้อมูลจริงและให้การแสดงผลที่เบาและไม่ยึดติดเทคโนโลยี

- 📋 **antv-s2-expert**: ผู้ช่วยพัฒนา S2 สำหรับตารางวิเคราะห์แบบไขว้หลายมิติ ใช้เมื่อผู้ใช้ต้องการความช่วยเหลือเกี่ยวกับตาราง Pivot แบบ S2 แผ่นตาราง หรือการพัฒนาใดๆ ที่เกี่ยวข้องกับ @antv/s2

`AntV S2 Expert` ช่วยผู้ใช้พัฒนาโดยใช้เอนจินตารางวิเคราะห์แบบไขว้หลายมิติ S2 ให้คำแนะนำครอบคลุมเกี่ยวกับ `@antv/s2` เอนจินหลัก, การเชื่อมต่อเฟรมเวิร์ก `@antv/s2-react` และ `@antv/s2-vue`, ส่วนประกอบการวิเคราะห์ขั้นสูง `@antv/s2-react-components`, และการแสดงผลฝั่งเซิร์ฟเวอร์ `@antv/s2-ssr` ครอบคลุมตาราง Pivot แผ่นตาราง เซลล์ที่กำหนดเอง การตั้งธีม เหตุการณ์ การโต้ตอบ การเรียงลำดับ ผลรวม คำแนะนำเครื่องมือ การตรึงแถว/คอลัมน์ ไอคอน การแบ่งหน้า และอื่นๆ

- 🕸️ **antv-g6-graph**: ตัวสร้างโค้ดการแสดงผลกราฟ G6 v5 ใช้เมื่อผู้ใช้ต้องการสร้างกราฟ G6 — กราฟเครือข่าย กราฟต้นไม้ ผังงาน แผนที่ความคิด และการแสดงข้อมูลเชิงสัมพันธ์หรือแบบกราฟใดๆ ด้วยไลบรารี G6

`AntV G6 Graph` สร้างโค้ด G6 v5 ที่ถูกต้องและสามารถรันได้ตามแนวทางปฏิบัติที่ดีที่สุด ครอบคลุมการเริ่มต้นกราฟหลัก โครงสร้างข้อมูล (โหนด, เอจ, คอมโบ), อัลกอริทึมการจัดวางกว่า 10 แบบ (force, dagre, circular, grid, mindmap, fishbone ฯลฯ), ประเภทโหนด/เอจ/คอมโบในตัวทั้งหมด, การจัดการสถานะ, พฤติกรรมกว่า 15 แบบ (drag-canvas, zoom-canvas, click-select, lasso ฯลฯ), ปลั๊กอินกว่า 10 ตัว (minimap, tooltip, toolbar, legend, timebar ฯลฯ), การพัฒนาองค์ประกอบที่กำหนดเอง, การแปลง และภาพเคลื่อนไหว มีระบบป้องกันในตัวเพื่อป้องกันข้อผิดพลาดทั่วไปในการย้ายจาก v4 ไป v5 เช่น การใช้ constructor `G6.Graph()`, API `graph.data()` หรือการกำหนดค่าพฤติกรรมแบบ Mode ที่เลิกใช้งานแล้ว

- 📈 **antv-g2-chart**: ตัวสร้างโค้ดแผนภูมิ G2 v5 ใช้เมื่อผู้ใช้ต้องการสร้างแผนภูมิ G2 — แผนภูมิแท่ง, แผนภูมิเส้น, แผนภูมิวงกลม, แผนภาพกระจาย, แผนภูมิพื้นที่, แผนที่ความร้อน และการแสดงข้อมูลทางสถิติใดๆ ด้วยไลบรารี G2

`AntV G2 Chart` สร้างโค้ด G2 v5 ที่ถูกต้องและสามารถรันได้ตามแนวทางปฏิบัติที่ดีที่สุดของ Spec Mode ครอบคลุมประเภทแผนภูมิกว่า 30 แบบ (interval, line, area, point, rect, cell, treemap, sankey, chord, wordCloud, gauge และอื่นๆ), การแปลงข้อมูล (stackY, dodgeX, binX, fold ฯลฯ), ระบบพิกัด (cartesian, polar, theta, radial), สเกล, การโต้ตอบ (brush, slider, legend filter), ส่วนประกอบ (axis, legend, tooltip, annotation), และการประกอบหลายมุมมอง มีระบบป้องกันในตัวเพื่อป้องกันข้อผิดพลาดทั่วไปในการย้ายจาก v4 ไป v5 เช่น การใช้ chain API ที่เลิกใช้งาน, ชื่อพาเล็ตที่ไม่ถูกต้อง, หรือการอ้างอิง `d3` ในโค้ดผู้ใช้

**ผลการประเมิน**

แนวทางของ Harness Engineering ได้รับการทดสอบอย่างเข้มงวดกับกรณีทดสอบการสร้างแผนภูมิ 174 กรณี แสดงให้เห็นถึงการปรับปรุงที่สำคัญเหนือวิธีพื้นฐาน:

| **โมเดล** | **G2** | **G6** |
| :---: | :---: | :---: |
| qwen3-coder-480b-a35b-instruct | ✨ 98.2% <sup><sub>+17.7%</sub></sup> | 94.8% <sup><sub>+15.6%</sub></sup> |
| Kimi-K2.5 | 97.7% <sup><sub>+17.2%</sub></sup> | 96.9% <sup><sub>+17.7%</sub></sup> |
| GLM-5.1 | 93.6% <sup><sub>+13.1%</sub></sup> | 92.8% <sup><sub>+13.6%</sub></sup> |
| DeepSeek-V3.2 | 90.8% <sup><sub>+10.3%</sub></sup> | ✨ 97.9% <sup><sub>+18.7%</sub></sup> |
| Context7 <sub>Baseline</sub> | 80.5% | 79.2% |

ผลลัพธ์แสดงให้เห็นว่า Harness Engineering ช่วยให้ LLM บรรลุความแม่นยำใกล้เคียงระดับที่พร้อมใช้งานจริง (สูงสุด 98.2%) ซึ่งเหนือกว่าแนวทางพื้นฐาน Context7 อย่างมีนัยสำคัญ

> [!TIP]
> มีทักษะเพิ่มเติมกำลังจะมาเร็วๆ นี้

## การใช้เป็นไลบรารี

สามารถใช้เป็นไลบรารีในโปรเจกต์ Node.js ของคุณได้ด้วย `CLI` และ `API`

### การใช้งาน CLI

เรายังมีเครื่องมือ CLI ชื่อ `antv` สำหรับการใช้งานง่ายบนเทอร์มินัลของคุณ ติดตั้งแบบ global:

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

**เรียกค้นหรือแสดงรายการทักษะตามคิวรี**:

```bash
# Retrieve skills by query (metadata only)
antv retrieve "bar chart" --library g2 --topk 10

# Retrieve skills with full markdown content (core constraints auto-prepended)
antv retrieve "bar chart" --library g2 --content

# Retrieve skills and output as JSON
antv retrieve "bar chart" --library g2 --output json

# Get a skill by its exact ID
antv get g2-mark-interval-basic --library g2

# List all available skills
antv list --library g2 --category core

# List skills and output as JSON
antv list --output json

# Show skill info (core constraints from SKILL.md)
antv info --library g2

# Show skill info as JSON
antv info --library g2 --output json
```

**Usage for the command**:

```
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")
```

> หมายเหตุ: `--content` จะเพิ่มข้อจำกัดหลักของไลบรารี (ส่วนที่ 1 และ 2 ของ SKILL.md จนถึงเครื่องหมาย `<!-- CONSTRAINTS:END -->`) ที่จุดเริ่มต้นเป็นผลลัพธ์แรกเสมอ เพื่อให้แน่ใจว่าโมเดลได้รับกฎสำคัญพร้อมกับเอกสารอ้างอิง

### การใช้งาน 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)
}
```

| ตัวเลือก | ประเภท | ค่าเริ่มต้น | คำอธิบาย |
| :--- | :--- | :--- | :--- |
| `library` | `string` | all | ตัวกรองไลบรารี (`g2` หรือ `g6`) |
| `topK` | `number` | `7` | จำนวนผลลัพธ์ |
| `content` | `boolean` | `false` | รวมเนื้อหา markdown |
| `includeInfo` | `boolean` | เหมือนกับ `content` | เพิ่มข้อจำกัดหลักจาก SKILL.md (ส่วน 1-2) เป็นผลลัพธ์แรก |

> หมายเหตุ:
> - การเรียกค้นเริ่มต้นจะส่งคืนวัตถุผลลัพธ์แบบน้ำหนักเบาที่ไม่มีฟิลด์ `content`
> - `content: true` จะส่งคืนเนื้อหา markdown (ไม่รวม metadata แบบ frontmatter)
> - เมื่อ `includeInfo` เป็น true (ค่าเริ่มต้นเมื่อ `content: true`) บล็อกข้อจำกัดหลัก — SKILL.md จนถึง `<!-- CONSTRAINTS:END -->` — จะถูกแทรกเป็นองค์ประกอบแรก (id มีคำนำหน้า `__info__`) เพื่อให้แน่ใจว่าโมเดลเห็นกฎสำคัญเสมอ

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

| พารามิเตอร์ | ประเภท | ค่าเริ่มต้น | คำอธิบาย |
| :--- | :--- | :--- | :--- |
| `library` | `string` | `'g2'` | ไลบรารีที่จะดึงข้อมูล (`g2` หรือ `g6`) |

## ใบอนุญาต

ใบอนุญาต MIT - ดูรายละเอียดได้ที่ไฟล์ [LICENSE](LICENSE)

## FAQ

### ทักษะการสร้างภาพข้อมูลด้วยแผนภูมิ AntV คืออะไร?

ทักษะการสร้างภาพข้อมูลด้วยแผนภูมิ AntV คือชุดเครื่องมือและความสามารถที่ขับเคลื่อนโดย AntV ออกแบบมาเพื่อช่วยให้ผู้ใช้สามารถแสดงผลและวิเคราะห์ข้อมูลได้อย่างมีประสิทธิภาพและแม่นยำ ประกอบด้วยฟีเจอร์สำหรับการสร้างแผนภูมิ การสร้างอินโฟกราฟิก การแสดงภาพข้อความเชิงบรรยาย และการพัฒนาแผนภูมิกราฟและแผนภูมิสถิติเฉพาะทาง

### ทักษะการสร้างแผนภูมิรองรับแผนภูมิกี่ประเภท?

ทักษะการสร้างแผนภูมิให้บริการแผนภูมิมากกว่า 26 ประเภทสำหรับการแสดงภาพข้อมูลอัจฉริยะ ครอบคลุมการนำเสนอข้อมูลที่หลากหลาย ทั้งอนุกรมเวลา การเปรียบเทียบ ความสัมพันธ์ และข้อมูลภูมิศาสตร์

### ฉันสามารถสร้างอินโฟกราฟิกด้วยทักษะเหล่านี้ได้หรือไม่?

ได้ ทักษะผู้สร้างอินโฟกราฟิกช่วยให้คุณสร้างอินโฟกราฟิกที่สวยงามจากเนื้อหาข้อความที่กำหนด โดยใช้ AntV Infographic และมีเทมเพลตมากกว่า 50 แบบ เพื่อแปลงข้อมูลให้เป็นภาษาภาพที่รับรู้ได้

### Narrative Text Visualization (T8 Syntax) คืออะไร?

Narrative Text Visualization (T8) แปลงข้อมูลที่ไม่มีโครงสร้างให้เป็นรายงานเชิงบรรยายที่มีความหมายสมบูรณ์ โดยใช้ไวยากรณ์ T8 ซึ่งเป็นภาษาเชิงประกาศคล้าย Markdown ออกแบบมาเพื่อสร้างเรื่องเล่าจากข้อมูล พร้อมคำอธิบายประกอบเอนทิตี แผนภูมิขนาดเล็ก และการจัดรูปแบบแบบมืออาชีพ เหมาะสำหรับรายงานการวิเคราะห์และเอกสารข้อมูลเชิงลึก

### ทักษะการสร้างภาพข้อมูลด้วยแผนภูมิ AntV ช่วยในการวิเคราะห์หลายมิติได้อย่างไร?

ทักษะ antv-s2-expert ทำหน้าที่เป็นผู้ช่วยพัฒนาสำหรับเอ็นจินตารางวิเคราะห์ข้ามมิติ S2 โดยให้คำแนะนำที่ครอบคลุมสำหรับการทำงานกับตารางพิวอท ชีตตาราง เซลล์แบบกำหนดเอง และฟีเจอร์ต่างๆ ของ @antv/s2

### มีเครื่องมือสำหรับสร้างแผนภูมิกราฟและแผนภูมิสถิติเฉพาะหรือไม่?

มี ทักษะ antv-g6-graph สร้างโค้ด G6 v5 สำหรับการแสดงภาพกราฟ เช่น กราฟเครือข่าย กราฟต้นไม้ และผังงาน ส่วนทักษะ antv-g2-chart สร้างโค้ด G2 v5 สำหรับแผนภูมิสถิติ เช่น แผนภูมิแท่ง แผนภูมิเส้น แผนภูมิวงกลม และแผนภูมิกระจาย โดยปฏิบัติตามแนวทางปฏิบัติที่ดีที่สุด