plantuml-ascii

โดย github

สร้างไดอะแกรม ASCII art จากไวยากรณ์ข้อความ PlantUML สำหรับเทอร์มินัลและเอกสารประกอบ รองรับไดอะแกรมหกประเภท: sequence, class, activity, state, component, use case และ deployment diagrams สองรูปแบบเอาต์พุต: ASCII บริสุทธิ์ (-txt) และ ASCII ที่ปรับปรุงด้วย Unicode (-utxt) พร้อมอักขระวาดกล่องเพื่อเพิ่มความสามารถในการอ่าน ทำงานร่วมกับการติดตั้ง PlantUML หรือ JAR แบบสแตนด์อโลน; ส่งออกเป็นไฟล์ .atxt หรือ .utxt ที่พร้อมใช้งานสำหรับเทอร์มินัล, README และระบบควบคุมเวอร์ชัน ตัวเลือกบรรทัดคำสั่งรวมถึง batch...

npx skills add https://github.com/github/awesome-copilot --skill plantuml-ascii

PlantUML ASCII Art Diagram Generator

Overview

Create text-based ASCII art diagrams using PlantUML. Perfect for documentation in terminal environments, README files, emails, or any scenario where graphical diagrams aren't suitable.

What is PlantUML ASCII Art?

PlantUML can generate diagrams as plain text (ASCII art) instead of images. This is useful for:

  • Terminal-based workflows
  • Git commits/PRs without image support
  • Documentation that needs to be version-controlled
  • Environments where graphical tools aren't available

Installation

# macOS
brew install plantuml

# Linux (varies by distro)
sudo apt-get install plantuml  # Ubuntu/Debian
sudo yum install plantuml      # RHEL/CentOS

# Or download JAR directly
wget https://github.com/plantuml/plantuml/releases/download/v1.2024.0/plantuml-1.2024.0.jar

Output Formats

FlagFormatDescription
-txtASCIIPure ASCII characters
-utxtUnicode ASCIIEnhanced with box-drawing characters

Basic Workflow

1. Create PlantUML Diagram File

@startuml
participant Bob
actor Alice

Bob -> Alice : hello
Alice -> Bob : Is it ok?
@enduml

2. Generate ASCII Art

# Standard ASCII output
plantuml -txt diagram.puml

# Unicode-enhanced output (better looking)
plantuml -utxt diagram.puml

# Using JAR directly
java -jar plantuml.jar -txt diagram.puml
java -jar plantuml.jar -utxt diagram.puml

3. View Output

Output is saved as diagram.atxt (ASCII) or diagram.utxt (Unicode).

Diagram Types Supported

Sequence Diagram

@startuml
actor User
participant "Web App" as App
database "Database" as DB

User -> App : Login Request
App -> DB : Validate Credentials
DB --> App : User Data
App --> User : Auth Token
@enduml

Class Diagram

@startuml
class User {
  +id: int
  +name: string
  +email: string
  +login(): bool
}

class Order {
  +id: int
  +total: float
  +items: List
  +calculateTotal(): float
}

User "1" -- "*" Order : places
@enduml

Activity Diagram

@startuml
start
:Initialize;
if (Is Valid?) then (yes)
  :Process Data;
  :Save Result;
else (no)
  :Log Error;
  stop
endif
:Complete;
stop
@enduml

State Diagram

@startuml
[*] --> Idle
Idle --> Processing : start
Processing --> Success : complete
Processing --> Error : fail
Success --> [*]
Error --> Idle : retry
@enduml

Component Diagram

@startuml
[Client] as client
[API Gateway] as gateway
[Service A] as svcA
[Service B] as svcB
[Database] as db

client --> gateway
gateway --> svcA
gateway --> svcB
svcA --> db
svcB --> db
@enduml

Use Case Diagram

@startuml
actor "User" as user
actor "Admin" as admin

rectangle "System" {
  user -- (Login)
  user -- (View Profile)
  user -- (Update Settings)
  admin -- (Manage Users)
  admin -- (Configure System)
}
@enduml

Deployment Diagram

@startuml
actor "User" as user
node "Load Balancer" as lb
node "Web Server 1" as ws1
node "Web Server 2" as ws2
database "Primary DB" as db1
database "Replica DB" as db2

user --> lb
lb --> ws1
lb --> ws2
ws1 --> db1
ws2 --> db1
db1 --> db2 : replicate
@enduml

Command-Line Options

# Specify output directory
plantuml -txt -o ./output diagram.puml

# Process all files in directory
plantuml -txt ./diagrams/

# Include dot files (hidden files)
plantuml -txt -includeDot diagrams/

# Verbose output
plantuml -txt -v diagram.puml

# Specify charset
plantuml -txt -charset UTF-8 diagram.puml

Ant Task Integration

<target name="generate-ascii">
  <plantuml dir="./src" format="txt" />
</target>

<target name="generate-unicode-ascii">
  <plantuml dir="./src" format="utxt" />
</target>

Tips for Better ASCII Diagrams

  1. Keep it simple: Complex diagrams don't render well in ASCII
  2. Short labels: Long text breaks ASCII alignment
  3. Use Unicode (-utxt): Better visual quality with box-drawing chars
  4. Test before sharing: Verify in terminal with fixed-width font
  5. Consider alternatives: For complex diagrams, use Mermaid.js or graphviz

Example Output Comparison

Standard ASCII (-txt):

     ,---.          ,---.
     |Bob|          |Alice|
     `---'          `---'
      |   hello      |
      |------------->|
      |              |
      |  Is it ok?   |
      |<-------------|
      |              |

Unicode ASCII (-utxt):

┌─────┐        ┌─────┐
│ Bob │        │Alice│
└─────┘        └─────┘
  │   hello      │
  │─────────────>│
  │              │
  │  Is it ok?   │
  │<─────────────│
  │              │

Quick Reference

# Create sequence diagram in ASCII
cat > seq.puml << 'EOF'
@startuml
Alice -> Bob: Request
Bob --> Alice: Response
@enduml
EOF

plantuml -txt seq.puml
cat seq.atxt

# Create with Unicode
plantuml -utxt seq.puml
cat seq.utxt

Troubleshooting

Problem: Garbled Unicode characters

  • Solution: Ensure terminal supports UTF-8 and has proper font

Problem: Diagram looks misaligned

  • Solution: Use fixed-width font (Courier, Monaco, Consolas)

Problem: Command not found

  • Solution: Install PlantUML or use Java JAR directly

Problem: Output file not created

  • Solution: Check file permissions, ensure PlantUML has write access

Skills เพิ่มเติมจาก github

console-rendering
github
คำแนะนำสำหรับการใช้ระบบเรนเดอร์คอนโซลที่ใช้ struct tag ใน Go
official
acquire-codebase-knowledge
github
ใช้ทักษะนี้เมื่อผู้ใช้ขอให้ทำแผนที่ จัดทำเอกสาร หรือเริ่มต้นใช้งานในโค้ดเบสที่มีอยู่จริง โดยจะเริ่มทำงานเมื่อมีข้อความแจ้งเช่น "ทำแผนที่โค้ดเบสนี้" "จัดทำเอกสาร…
official
acreadiness-assess
github
Run the AgentRC readiness assessment on the current repository and produce a static HTML dashboard at reports/index.html. Wraps `npx github:microsoft/agentrc…
official
acreadiness-generate-instructions
github
สร้างไฟล์คำแนะนำ AI agent ที่ปรับแต่งตามคำสั่ง AgentRC instructions สร้างไฟล์ .github/copilot-instructions.md (ค่าเริ่มต้น แนะนำสำหรับ Copilot ใน VS…)
official
acreadiness-policy
github
ช่วยผู้ใช้เลือก เขียน หรือใช้ AgentRC policy นโยบายปรับแต่งการให้คะแนนความพร้อมโดยปิดการตรวจสอบที่ไม่เกี่ยวข้อง เปลี่ยนระดับผลกระทบ/ระดับ การตั้งค่า…
official
add-educational-comments
github
เพิ่มความคิดเห็นเชิงการศึกษาให้กับไฟล์โค้ดเพื่อเปลี่ยนให้เป็นแหล่งเรียนรู้ที่มีประสิทธิภาพ ปรับระดับความลึกและน้ำเสียงของคำอธิบายตามระดับความรู้ที่กำหนดได้สามระดับ: ผู้เริ่มต้น ระดับกลาง และระดับสูง ขอไฟล์โดยอัตโนมัติหากไม่มีไฟล์ที่ให้ไว้ พร้อมการจับคู่รายการแบบมีหมายเลขเพื่อการเลือกที่รวดเร็ว ขยายไฟล์ได้สูงสุด 125% โดยใช้เฉพาะความคิดเห็นเชิงการศึกษา (ขีดจำกัดสูงสุด: 400 บรรทัดใหม่; 300 บรรทัดสำหรับไฟล์ที่มีมากกว่า 1,000 บรรทัด) รักษาการเข้ารหัสไฟล์ รูปแบบการเยื้อง ความถูกต้องของไวยากรณ์ และ...
official
adobe-illustrator-scripting
github
เขียน ดีบัก และปรับสคริปต์อัตโนมัติของ Adobe Illustrator ให้เหมาะสมโดยใช้ ExtendScript (JavaScript/JSX) ใช้เมื่อสร้างหรือแก้ไขสคริปต์ที่จัดการ...
official
agent-governance
github
นโยบายเชิงประกาศ การจำแนกเจตนา และเส้นทางการตรวจสอบสำหรับควบคุมการเข้าถึงเครื่องมือและพฤติกรรมของเอเจนต์ AI นโยบายการกำกับดูแลที่ประกอบได้กำหนดเครื่องมือที่อนุญาต/บล็อก ตัวกรองเนื้อหา การจำกัดอัตรา และข้อกำหนดการอนุมัติ — จัดเก็บเป็นคอนฟิกูเรชัน ไม่ใช่โค้ด การจำแนกเจตนาเชิงความหมายตรวจจับพรอมต์อันตราย (การขโมยข้อมูล การยกระดับสิทธิ์ การฉีดพรอมต์) ก่อนการดำเนินการเครื่องมือโดยใช้สัญญาณตามรูปแบบ ตัวตกแต่งการกำกับดูแลระดับเครื่องมือบังคับใช้นโยบายที่ฟังก์ชัน...
official