Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add tranfu-labs/tranfu-skills --skill share-heatmap-defaultsgit clone --depth 1 https://github.com/tranfu-labs/tranfu-skillsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/tranfu-labs/tranfu-skills/share-heatmap-defaults)<a href="https://agentmods.dev/skills/tranfu-labs/tranfu-skills/share-heatmap-defaults"><img src="https://agentmods.dev/badge/skills/tranfu-labs/tranfu-skills/share-heatmap-defaults/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/tranfu-labs/tranfu-skills/share-heatmap-defaults"><img src="https://agentmods.dev/badge/skills/tranfu-labs/tranfu-skills/share-heatmap-defaults.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00368 | $0.04033 |
| Opus 5 | $0.00184 | $0.02017 |
| Sonnet 5 | $0.00074 | $0.00807 |
| Haiku 4.5 | $0.00037 | $0.00403 |
Grade A, and why
share-heatmap-defaults scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 11d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Makes network callslowCapability
Not a fault in itself. Listed so you know the mod talks to something, and to what.
- **默认工具**:Treemap 优先用 Apache ECharts 的 `series.type: 'treemap'`,不要自己手写 squarify 布局——自己写的布局算法很容易漏掉"面积够大但形状被拉成细长条"这类边界情况。Artifact 之类有 CSP 限制、不能挂外部 CDN 的环境,把 echarts.min.js 整份源码下载下来内联进 HTML 里(体积大约 1MB,用 `curl` 下载后拼进 `<scri How it starts
The opening of the file, as written. The whole thing — 121 lines — stays where its author put it; the contents beside it link to each section on GitHub.
占比热力图默认判断
触发条件
- 用户要求为某个领域/数据集做"热力图"。
- 描述里同时出现占比/分布/份额/谁大谁小/谁占多少这类语义词(或明显在问"谁占大头""各项各占多少")。
不触发(Do NOT trigger)
- 描述里没有占比/份额语义,格子大小本身没有业务含义——比如"每天一个格子、颜色代表当天活跃度"的日历热力图,或行列交叉格子代表相关性的相关矩阵热力图。这类场景格子大小不该跟着数值变化,维持传统色块深浅热力图才是对的。
- 用户是在柱状图/饼图/折线图等完全不同的图表类型之间做初选,不是"热力图内部该怎么编码"的问题。
- 用户要的是 Treemap 具体怎么实现(布局算法、坐标计算、CSS 写法、验证脚本)——这些不属于本判断范围,交给模型按经验正常处理。
工作流
- 检查描述里有没有占比/分布/份额语义词。没有 → 不适用本 skill,按常规热力图(颜色深浅、格子大小固定)处理。
- 有的话,问自己一句:这些格子/方块的"大小"本身有没有业务含义?
- 有(大小本身代表占比/份额)→ 默认选 Treemap:方块面积按数值真实比例切割,颜色只能做辅助维度,NEVER 用颜色代替面积表达占比大小。
- 没有 → MUST 维持传统色块深浅热力图,NEVER 不分青红皂白都套用 Treemap。
- 拿不准(信号模糊、两种解读都说得通)→ 跳转到下方「失败路径」,直接问用户澄清,不要凭第一直觉选一个。
- 如果同一份数据横跨多个统计口径(比如累计、近 24 小时、近 1 周、近 1 月、近 1 年),NEVER 把"面积用口径 A、颜色用口径 B"当默认设计——这是同一类盲区的变体,看起来信息更丰富,实际会让人分不清两种视觉编码分别代表什么。默认做法是加一组切换控件(Tab/下拉都可以),切换时让面积和颜色同时按被选中的那一个口径重新计算。
- 【容易漏想】如果用户要求的多个口径里,某个口径在参与比较的实体上覆盖率明显偏低(比如只有一半项目查得到这项数据),NEVER 为了让几个切换按钮"看起来对等"就编造缺失数值,也不要放任大片格子因为没有数值而空着/消失——两种处理在读者眼里都像是图表渲染出了 bug,而不是"这个口径本来就没数据"。正确做法:把这个口径整个从切换控件里拿掉,换成图表之外的一段说明或一张小表格,并写清楚为什么没做成 Treemap(数据源覆盖不到、口径不可比等)。这一步很容易漏想,因为"三个口径都做成对称的切换按钮"看起来是更工整的默认设计,但工整不能建立在编数据或留空洞之上。
- 【容易漏想】如果参与比较的实体天然分属体量差异悬殊的不同类别(比如把"巨头级别的项目"和"某个巨头旗下的子项目/衍生品"放进同一张图比总量,巨头所在类别会把其他类别的所有项目一起挤成看不清的碎屑),NEVER 指望"把小项目折进一个「其他」聚合块"就能解决——那能救的是"类别内部的长尾",救不了"类别之间的量级差"。默认应该按类别拆成多张独立的小 Treemap,每张只在类别内部计算占比,类别与类别之间不做面积可比(跨类别的体量对比通常也不是用户真正想看的信息)。
- 产出后自检一句话:只看方块的面积大小,能不能看出谁占比更高? 如果答案是"看不出来,得看颜色深浅才能判断",说明编码方式选错了,回到第 2 步重新判断。
完成以上步骤后,产出一个明确的编码判断结论(Treemap / 传统网格;是否需要口径切换控件;是否需要按类别拆图),带着这个结论再开始动手实现,不要先做一版凭直觉的默认实现,等用户来纠正。
失败路径
- 如果占比语义信号模糊(比如只说"做个热力图看看各板块表现",不确定"表现"是不是"占比"),不要擅自假设,直接问用户一句"这个热力图是要看各项占整体的比例,还是看每一项自己的强弱/活跃度?"——前者走 Treemap,后者走传统色块网格。
- 如果触发词是"分布"但语境更像"数值随某个维度怎么疏密变化"(比如"用户年龄分布热力图""访问时段分布热力图"),先确认这是"谁占整体多少份额"还是"数值在某个维度上怎么疏密分布"——前者走 Treemap,后者可能是直方图/密度图,都不归本判断管,需要先问清楚。
- 如果格子大小的业务含义本身有争议(比如既有"每个分类占比"又有"每个分类自己的活跃度"两种解读),同样问清楚再动手,不要凭第一直觉埋头实现。
Treemap 实现默认用 ECharts,以及几个真踩过的坑
编码判断(选 Treemap)之后,具体怎么落地本来不归本 skill 管,但下面这几条是实际做过程中真正踩过的坑,值得单独记下来——不是"怎么写布局算法"这种通用实现细节,而是"选了 ECharts 之后,它的默认行为会在没人提醒的情况下直接产出一张看起来像渲染出 bug 的图":
What ships with it
5 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 11d ago First seen · 121 lines · 368 tokens per session scan A 46a0c415258d
share-heatmap-defaults is a skill published in the GitHub repository tranfu-labs/tranfu-skills (2 stars, last pushed yesterday), licensed MIT. It adds 368 tokens to every session and 4,033 once invoked, about $0.0018 per session on Opus 5. A static security scan graded it A with 1 finding (makes network calls). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
webgl-holographic-foil
A self-contained WebGL2 hero: thin-film interference over a crushed-foil surface whose palette shifts with the viewing angle; move the cursor to tilt the film.
html-ppt-hermes-cyber-terminal
OpenDesign + BYOK: choosing and wiring your own model, hands-on — cost, quality, and the routing decision. Built as a decision-grade AI literacy deck for engineers, IT, applied-AI teams.
html-ppt-taste-brutalist
16:9 HTML deck in tactical-telemetry / CRT-terminal taste. Deactivated-CRT charcoal slides, white-phosphor monospace, hazard-red accent, scanline overlay, ASCII syntax, density over decoration. Distilled from Leonxlnx/taste-skill brutalist-skill (Tactical Telemetry mode).
visual-ralph
Visual Ralph orchestration for frontend UI from generated references, static references, or live URL targets, using $ralph with built-in visual verdict and pixel-diff evidence until the implementation matches and leaves a reproducible design system.
accessibility
Consolidated accessibility skill entrypoint for WCAG 2.2, ARIA Authoring Practices, cognitive accessibility, Section 508, EN 301 549, design intent verification, and the Accessibility Planner workflow.
make-resume
A Chinese-language tool for creating editable HTML resumes that can be changed in a browser and printed to PDF. It uses available resume templates when they are installed and otherwise provides a simpler fallback.