dym-lieflat-charts-browse-templates

Skill: dym-lieflat-charts-browse-templates — Xem tận mắt kho template

Vì sao dùng: biết trong kho có gì thì hỏi agent trúng hơn nhiều, và bạn tự đối chiếu được sản phẩm nhận về có đúng "cùng một nhà" với template không (checklist §8 câu 14). Sinh ra cái gì: không sinh gì. Chỉ đọc.

Chạy từ thư mục skill đã cài (~/.claude/skills/lieflat-charts) hoặc bản clone bất kỳ.

Mở gallery

cd ~/.claude/skills/lieflat-charts

open templates/lupi-gallery.html     # 19 hình Lupi Editorial (L1–L20, không có L18)
open templates/basics-gallery.html   # 17 hình Basics (F1–F17)
open templates/glance-gallery.html   # 20 hình Glance (G3–G22)
open templates/maps-gallery.html     # 2 bản đồ (M1, M2) — cần mạng, GeoJSON online
open templates/reports/index.html    # chỉ mục 12 bộ báo cáo, bấm vào là mở bản zh/en

Ba hình lớn tương tác, mỗi hình một file nguyên trang:

open templates/big-circular.html   # B1 · mạng 60 node, dây cung
open templates/big-force.html      # B2 · mạng 180 node, force-directed
open templates/big-threads.html    # B3 · 100+ đường 3 chặng, hover/pin

Linux đổi open → xdg-open.

Gallery dùng IntersectionObserver render lười — phải cuộn tới thì hình mới vẽ. Trang trắng ở giữa không phải hỏng.

Bản đổi màu (chỉ để tra màu, không tra cấu trúc)

ls templates/color/
# basics|glance|lupi|maps × palm|porcelain|wire = 12 file

templates/color/README.md nói thẳng: chính bản của code render/hình học/animation luôn là 4 gallery ở thư mục gốc. Bản màu chỉ là bản thay da. Chép cấu trúc từ đây là đi đường vòng và dễ lệch.

Ba preset:

Hậu tố	Hệ	Logic màu	Hợp với
*-porcelain.html	xanh men sứ	một tông, thang độ sáng	dữ liệu có thứ tự, một chuỗi
*-palm.html	xanh lá dừa	tông màu = category	category không thứ tự ≤4 (5–6 gượng)
*-wire.html	đỏ toà soạn	thang xám + một cam huỳnh quang	hầu hết, khi cần đúng một điểm rơi mắt

Ba hình lớn không có bản wire (wire vốn đã là xám + một điểm nhấn, làm ra gần trùng bản Mono gốc).