Lieflat Charts：把 AI 做图的「品味」写成必须执行的硬规则

AI 做的图为什么不好看？问题不在渲染，在选型

把一份数据丢给 AI，让它做张图表。几秒就能出图，速度很快，图也能看，但出来的图往往颜色拉满，坐标轴挤在一起，饼图每个扇区都标着百分比。你让它改一版，AI 把颜色换了，把柱状图变成环形图，信息还是一样地拥挤。

这不是 AI 的渲染能力不行。ECharts和 Chart.js 能画出非常精致的图表。问题出在更前面的一步：AI 不知道「这份数据该用什么图」。

大多数图表工具的逻辑是「先给你一堆模板，你挑一个，然后把数据填进去」。AI 拿到数据后，也在做同样的事——它在自己见过的图型里随机选一个，把数据塞进去。结果就是图型和数据不匹配：只有三个类目的数据被画成了复杂的热力图，时间序列被塞进了饼图，需要快速排名的场景用了需要逐行细读的散点图。每个类目一种高饱和颜色，把颜色多当成好看。

很显然，AI 做图的瓶颈不在渲染，而在选型：这份数据适合哪种图，阅读的人会停留几秒。Lieflat Charts 把这套判断写成 Agent 每次出图都要读取的规则。用户不需要先报图型名称，只需说明数据和用途即可做出好用的、准确的图。

规则从哪一步开始管？

它把选图判断，写成了 Agent 必须执行的规则

Lieflat Charts 是一套遵循 Agent Skills格式的数据可视化与报告生成工具。它可以安装到 moxt、Claude Code、Codex 以及其他兼容 SKILL.md 格式的 AI Agent 中。安装后，你对 Agent 说「把这份调研数据做成适合公众号长文的 5 张中文版图表」，Agent 就会按照 Lieflat Charts 的规则生成单文件 HTML 图表，双击就能在浏览器里打开。

但把它理解成「又一个图表库」就错了。ECharts、Chart.js、D3.js 这些图表库解决的是「怎么画」的问题——它们提供渲染引擎和图型实现。Lieflat Charts 解决的是「画什么、为什么画这个」的问题。

它的核心不是渲染代码，而是一套规则，被称为「图表品味法典」。

类比品味法典像杂志的视觉规范：它不教排版软件如何操作，规定的是标题、留白和图片各占什么位置。编辑按手册执行，版面才会统一。

这些规则规定了：什么时候出单图，什么时候出整页报告；先选哪组图型，后选哪组；什么数据形状对应什么图；颜色怎么自动选；一张图承担几个结论；单页最多放几张图。

这些规则不是建议。SKILL.md 零号节明确写道：「以下规则不是建议，违反任意一条都必须返工。」这意味着 Agent 在执行时没有自由发挥的空间——它必须按优先级审计模板，必须记录选型理由，必须在降级时说明为什么上一级不适用。整个项目的文件结构也服务于这个目标。默认结果是一份双击即可打开的 HTML。只有明确要求年报、月报、白皮书、海报这类整页时，才会进入报告模式。当用户只提供数据，或只要求可视化、做几张图，仍然输出单图。

图型锁定之后，阅读速度如何确定？

Lupi 和 Glance：不是好看与不好看，而是两种阅读速度

图型选定之后，还要决定阅读的人停留多久。Lieflat Charts 把所有图型分成了两大体系，加上一个基础型和一组交互大图。理解这两大体系的区别，是理解整个项目的钥匙。

Lupi 是编辑叙事型，它用细线、点阵、逐条记录和留白把原材料摊开，阅读时间通常在 30 秒以上，适合年报、长文和需要保留细节的复盘。Basics 与 Lupi 同属细读，它保留柱状图、折线图、环形图等常见轮廓，并加上可数刻度和发丝线，适合数据量不大、仍需要读清单位的内容。Glance 是快速判断型，它用粗柱、大数字、色块和清晰排序提前汇总信息，几秒内可以看到高低、变化和异常，适合周报、汇报和 dashboard。

注意这个区分的维度。不是「Lupi 好看、Glance 不好看」，也不是「Lupi 高级、Glance 基础」。它们的区别是阅读速度——读者愿意花多少时间在这张图上。这是一个被大多数图表工具忽略的变量。

普通图表库按图型分类：柱状图、折线图、饼图、散点图。但同一个柱状图，可以做成需要逐根细读的 Lupi 风格，也可以做成只看排名前三的 Glance 风格。图型本身不决定阅读体验，视觉密度才决定。

Lieflat Charts 在 catalog.md 里给每张图都标了「读者时间」。L1 Launch Fan 是 ~30s，G3 Chunky Bars 是 <10s，G16 Bar Race 是动画。这个标签不是装饰，它是选型时的核心依据。如果你的数据是要放在周报里、老板只有 3 秒扫一眼，那选一张需要 30 秒细读的 Lupi 图就是错误——不管它画得多精致。反过来，如果你的数据是要放在公众号长文里、读者愿意停下来看细节，那选一张只显示排名前三的 Glance 图也是错误——它丢失了太多信息。Basics 基础编辑型介于两者之间。它保留柱状图、折线图、环形图等熟悉轮廓，再用可数刻度、发丝线和编辑排版增加质感。它适合数据不多、但仍然希望画面有密度和可读单位的场景。Interactive 交互大图则用于普通静态图承载不了的关系数据——网络、路径和多段流向，通过 hover、聚焦和拖拽把复杂关系变成可以逐条查询的图。

三种风格怎么读：一张表看差异：一张表看差异：一张表看差异

出图流程里固定的六步

常见表格应先比较哪几张？

数据长什么样，就先比较哪几张图

图型优先级定了，接下来要看数据长什么样，才知道先比哪几张。下面只列最常见的几条。还是先用 Lupi 和 Basics；只有明确要求快读，或这两组无法绘制时，再使用 Glance。另有五种数据形状是主力图型画不了的，匹配上就直接用后备图。

颜色如何选择？

颜色是最后一步：图型和阅读速度定了再选色

大多数人做图表时，颜色是最后一步——图画好了，随便挑一组看着顺眼的配色。Lieflat Charts 把颜色提到了和图型同等重要的位置，而且每种颜色都有明确的意思。所有体系共用一套 Mono视觉语法：从纸灰到炭黑，中间铺灰阶。明度负责分主次，位置、长度、密度和结构负责表示数据。拿不准该配什么颜色时，一律用 Mono。所以默认情况下，它生成的图就是黑白灰的。

这不是因为开发者不喜欢颜色，而是因为大多数数据其实不需要颜色——用明度深浅就能分出主次，用位置和长度就能表示数值。颜色应该只在它能增加信息时才出现。当颜色确实需要出现时，Lieflat Charts 内置三套彩色方案，Agent 会按数据结构自动挑，用户不用特意说「要彩色」。

青瓷蓝是单色相的深浅阶梯，适合有先后顺序的数据，用深浅表示数值大小，比如时间序列和排名。椰林绿是偏暗的绿黄色，用不同颜色区分少数几个没有顺序的类别，比如不同产品线。编辑部红是黑灰底上的一个荧光橙，只强调一个异常值或关键指标。这三套不是随手挑的好看配色，每一套对应一种用途：青瓷蓝表达「有序和大小」，椰林绿表达「分类和区分」，编辑部红表达「聚焦和重点」。如果用户给了品牌色或具体色值，也可以做一套自定义配色，但要保证该有的深浅层次齐全、对比度够看。同一份 HTML、同一组图只能用一套配色，不能混着来。图生成后还能继续调色，但每调一次都要重新确认：对比度够不够、主次清不清楚、颜色还对不对得上数据。

这条「同一份交付只锁一种色彩系统」的规则，挡住了 AI 做图最常见的翻车方式——一张图里同时出现蓝色柱状图、红色折线、绿色面积和黄色标注，每个元素都在抢注意力，读者不知道该看哪里。

四套色彩系统，各自管什么

单图之外：整页报告什么时候才该进入

Lieflat Charts 默认输出的是图表，不是报告。SKILL.md 开头用了大篇幅强调这一点：用户只给数据，或说「可视化这组数据 / 分析数据 / 做一张图」，都必须生成图表。没有报告关键词时，不得自行套用报告模板，也不得因为数据很丰富就升级成报告。只有用户明确说「生成报告 / 年报 / 月报 / 白皮书 / 调研一页纸 / 海报 / brief / dashboard 报告」这类完整报告时，才切到报告模式。

这个区分很重要。因为报告模式不是「多画几张图拼在一起」。报告模板管的是整页怎么排——页面留多少边、信息多密、按什么顺序读、每张图占多大位置。但页内每一张图，还是得按 catalog.md 的选型规则和 SKILL.md 的视觉语法来做。

目前有 12 套整页报告模板，每套都提供中文版和英文版。

R01 是调研报告和研究一页，R02 是年度复盘和业绩回顾，R03 是年度数据报告和年度海报，R04 是月度业务和财务经营报告，R05 是项目和产品影响力故事，R06 是长周期产品和业务年鉴，R07 是调研和市场数据拼贴海报，R08 是人群和社会经济数据一页，R09 是业务数据和财务经营 Dashboard，R10 是个人数据、运动和旅行记录，R11 是研究和金融经济简报卡，R12 是周期数据快报和监控摘要。

模板名称表示版式，不限制行业。「个人数据 / 运动 / 旅行记录」也可以用于生活数据，「月度业务 / 财务经营报告」也可以用于财报。

报告模式的流程是：先从 report-catalog.md 挑一个整页骨架，每个图位再复用 catalog.md 里现成的图型。也就是说，模板只规定「这页有几个图位、每个多大、按什么顺序读」，至于每个位置放哪张图，还得按前面的选型优先级一步步来。这保证了整页报告的视觉统一性——不会出现左边是 Lupi 细线风格、右边是 Glance 粗柱风格、上面是青瓷蓝、下面是椰林绿的拼贴感。整页所有图共用同一套视觉设定和同一种配色。

安装之后，如何提出需求？

说明用途就能出图，不必先报图型

在 moxt.ai 里，规则、模板、数据和成品都放在同一个工作区，改起来方便；也可以装到其他支持这类 skill 的工具上。

安装后直接说明用途。例如：把这份调研数据做成适合长文的 5 张中文图，先比较 Lupi 和 Basics，两组都不合适时再使用 Glance。或者说明这是周报，需要在 10 秒内看清排名、变化和异常；或使用 Lupi 保留每条记录和旁注；或使用青瓷蓝重做，用深浅表示数值，结构不变。

图的数量由结论数量决定，不由数据列数决定。一个问题通常 1 张，两到三个结论 2 至 3 张，一篇完整材料 4 至 6 张。指定数量时仍会删除重复图。单页最多 6 张。

Lupi 和 Basics 用的是原生 SVG，断网也能打开。F13 Treemap用 ECharts；Glance、Circular、Force 和报告模板 R11/R12 要靠 Chart.js 或 ECharts，文件里没内置，打开时需要联网。

许可证是 PolyForm Noncommercial 1.0.0：学习、修改、分享和非商业使用都可以，商用要另外拿授权。Chart.js、ECharts 和 Inter 字体各按自己的许可证。

怎么说需求，才会走到对的模式