什么是矩形树图what is a treemap
矩形树图（Treemap，又称矩形式树状结构图、面积占比图）用一组嵌套的矩形表示层级数据：每个矩形的面积与它的数值成正比，大类的矩形里再嵌套小类。和饼图相比，它能在一张图里放下几十上百个分项，同时看出“哪一项占比最大”和“它属于哪一类”。
本工具在浏览器中直接运行：从 Excel 复制数据粘贴进来即可生成，调整配色、字号、图名后导出高清 PNG 或可编辑的 SVG 矢量图。
适合画什么use cases
- 城市用地结构：把用地平衡表中的大类、中类用地面积画成一张图，居住、工业、绿地、道路的配比一眼可见；“规划用地色”会按用地名称自动套用行业习惯色。
- 经济与产业构成：各区县 GDP、三次产业、重点行业产值，可把增速作为颜色值，同时表达“规模”和“增长”。
- 财政与投资：预算支出科目、项目投资构成、资金来源结构。
- 人口与公共设施：各街道人口规模、各类公共服务设施的数量或面积构成。
- 市场与企业：行业市值、销售额构成及涨跌，按“红涨绿跌”着色。
三步制作矩形树图how to
- 整理数据：在 Excel 中按“大类、小类、数值”排成几列，层级列在前，数值列放在最后。
- 粘贴数据：选中单元格复制，粘贴到左侧“数据”框，图表实时更新；也可以上传 CSV 文件。
- 调整并导出：选择按分类或按数值着色，设置字号、间隙、图名和数据来源，导出 1–4 倍 PNG 或 SVG。
数据格式data format
每行一条数据，用 Tab（从 Excel 粘贴时自动产生）或逗号分隔。最后一个数字是数值，决定矩形面积；可以在它后面再加一个数字作为颜色值，用于按数值着色。
居住用地, 二类居住用地, 268 居住用地, 一类居住用地, 36 公共管理与公共服务用地, 教育科研用地, 46 工业用地, 一类工业用地, 118, 4.2
层级数量不限，两列（名称、数值）就是单层矩形树图，三列以上自动形成嵌套。同一路径出现多次时数值会自动累加。也支持 JSON 结构：{"name":"全部","children":[{"name":"居住用地","value":322}]}。
常见问题faq
矩形树图和饼图有什么区别？
饼图超过五六个分项就很难比较大小，也无法表达层级。矩形树图用面积表示数值，一张图可以容纳几十上百个分项，并且大类套小类，能同时看出占比和归属。
矩形树图和旭日图怎么选？
两者都表达层级占比。旭日图用同心圆环，层级关系一目了然，但外圈小项很难辨认；矩形树图对版面的利用率更高，更适合比较分项大小、放更多标签。
可以直接从 Excel 粘贴数据吗？
可以。按“大类、小类、数值”排列后选中单元格复制，粘贴到数据框即可。合并单元格复制出来的空格会自动沿用上一行的分类，带千分位的数字也能识别。CSV 文件可直接上传，GBK 编码的中文 CSV 会自动识别。
第二列数字有什么用？
每行最后一个数字是数值，决定矩形面积；在它后面再加一个数字作为颜色值，例如增速或涨跌幅，切换到“按数值着色”后用颜色表达。
导出的 SVG 可以在 Illustrator 里编辑吗？
可以。导出的 SVG 中矩形是图形、文字是可编辑的文本对象，可在 Illustrator、CorelDRAW、Inkscape 中继续修改。PNG 支持 1–4 倍导出，适合放进汇报文本与展板。
数据会上传到服务器吗？
不会。数据解析和绘图全部在浏览器本地完成，只在本机浏览器中保存上一次的数据和设置，方便下次继续。
数据里有负数怎么办？
面积不能为负，数值为零或负的分项不会参与绘制。像涨跌幅这类有正有负的数据，请放在颜色值那一列，用颜色表达。
相关工具related tools
矩形树图表达“结构与占比”，规划分析中常与下列空间类图纸配合使用。