🧑 博主簡介：曾任某智慧城市類企業算法總監，目前在美國市場的物流公司從事高級算法工程師一職，深耕人工智能領域，精通python數據挖掘、可視化、機器學習等，發表過AI相關的專利并多次在AI類比賽中獲獎。CSDN人工智能領域的優質創作者，提供AI相關的技術咨詢、項目開發和個性化解決方案等服務，如有需要請站內私信或者聯系任意文章底部的的VX名片（ID：xf982831907）

💬 博主粉絲群介紹：① 群內初中生、高中生、本科生、研究生、博士生遍布，可互相學習，交流困惑。② 熱榜top10的常客也在群里，也有數不清的萬粉大佬，可以交流寫作技巧，上榜經驗，漲粉秘籍。③ 群內也有職場精英，大廠大佬，可交流技術、面試、找工作的經驗。④ 進群免費贈送寫作秘籍一份，助你由寫作小白晉升為創作大佬。⑤ 進群贈送CSDN評論防封腳本，送真活躍粉絲，助你提升文章熱度。有興趣的加文末聯系方式，備注自己的CSDN昵稱，拉你進群，互相學習共同進步。

---

一、引言

TreeMap（矩形樹圖）是一種流行的數據可視化方式，它通過嵌套的矩形來展示層次結構數據，每個矩形的面積大小與數據值成比例。本文將詳細介紹如何使用PyEcharts庫繪制TreeMap，并深入解析數據格式和各個參數的含義。

二、TreeMap簡介

TreeMap是一種有效的空間填充可視化方法，特別適合展示具有層次結構的大規模數據。它能夠同時顯示數據的層次關系和數值大小，廣泛應用于文件大小分析、市場份額展示、資源配置等領域。

三、基本TreeMap繪制

3.1 簡單示例

首先，我們來看一個基本的TreeMap繪制示例：

from pyecharts import options as opts
from pyecharts.charts import TreeMap# 基本數據格式
data = [{"value": 40, "name": "類別A"},{"value": 30, "name": "類別B"},{"value": 20, "name": "name": "類別C"},{"value": 10, "name": "類別D"},
]# 創建TreeMap實例
treemap = (TreeMap().add("演示數據", data).set_global_opts(title_opts=opts.TitleOpts(title="基本TreeMap示例"))
)treemap.render("basic_treemap.html")

3.2 數據格式詳解

TreeMap的數據格式可以是扁平結構或層次結構：

3.2.1 扁平結構

data = [{"value": 40, "name": "類別A"},{"value": 30, "name": "類別B"},{"value": 20, "name": "類別C"},{"value": 10, "name": "類別D"},
]

3.2.2 層次結構

data = [{"name": "類別A","value": 40,"children": [{"name": "子類A1", "value": 25},{"name": "子類A2", "value": 15},]},{"name": "類別B", "value": 30,"children": [{"name": "子類B1", "value": 20},{"name": "子類B2", "value": 10},]}
]

每個數據項可以包含以下屬性：

• name: 數據項名稱
• value: 數據項數值，決定矩形大小
• children: 子節點數組（可選）
• 其他自定義屬性，可用于視覺映射

四、高級TreeMap示例

4.1 帶鉆取功能的TreeMap

下面的示例展示了如何創建帶鉆取功能的TreeMap，類似于Echarts官方示例，參考鏈接https://gallery.pyecharts.org/#/Treemap/echarts_option_query：

import re
import asyncio
from aiohttp import TCPConnector, ClientSession
import pyecharts.options as opts
from pyecharts.charts import TreeMapasync def get_json_data(url: str) -> dict:async with ClientSession(connector=TCPConnector(ssl=False)) as session:async with session.get(url=url) as response:return await response.json()# 獲取官方的數據
data = asyncio.run(get_json_data(url="https://echarts.apache.org/examples/data/asset/data/""ec-option-doc-statistics-201604.json")
)tree_map_data: dict = {"children": []}def convert(source, target, base_path: str):for key in source:if base_path != "":path = base_path + "." + keyelse:path = keyif re.match(r"/^\$/", key):passelse:child = {"name": path, "children": []}target["children"].append(child)if isinstance(source[key], dict):convert(source[key], child, path)else:target["value"] = source["$count"]convert(source=data, target=tree_map_data, base_path="")(TreeMap(init_opts=opts.InitOpts(width="1200px", height="720px")).add(series_name="option",data=tree_map_data["children"],visual_min=300,leaf_depth=1,# 標簽居中為 position = "inside"label_opts=opts.LabelOpts(position="inside"),).set_global_opts(legend_opts=opts.LegendOpts(is_show=False),title_opts=opts.TitleOpts(title="Echarts 配置項查詢分布", subtitle="2016/04", pos_left="leafDepth"),).render("echarts_option_query.html")
)

4.2 多層級樣式配置

下面的示例展示了如何為不同層級配置不同的樣式，參考鏈接：https://gallery.pyecharts.org/#/Treemap/treemap_levels

import json
from pyecharts import options as opts
from pyecharts.charts import TreeMap# 假設我們有一個包含層次結構數據的JSON文件
# 數據格式示例：
# [
#   {
#     "name": "類別A",
#     "value": 100,
#     "children": [
#       {"name": "子類A1", "value": 60},
#       {"name": "子類A2", "value": 40}
#     ]
#   },
#   {
#     "name": "類別B", 
#     "value": 80,
#     "children": [
#       {"name": "子類B1", "value": 50},
#       {"name": "子類B2", "value": 30}
#     ]
#   }
# ]with open("treemap.json", "r", encoding="utf-8") as f:data = json.load(f)c = (TreeMap().add(series_name="演示數據",data=data,levels=[opts.TreeMapLevelsOpts(treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color="#555", border_width=4, gap_width=4)),opts.TreeMapLevelsOpts(color_saturation=[0.3, 0.6],treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color_saturation=0.7, gap_width=2, border_width=2),),opts.TreeMapLevelsOpts(color_saturation=[0.3, 0.5],treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color_saturation=0.6, gap_width=1),),opts.TreeMapLevelsOpts(color_saturation=[0.3, 0.5]),],).set_global_opts(title_opts=opts.TitleOpts(title="TreeMap-Levels-配置")).render("treemap_levels.html")
)

五、參數詳解

5.1 add() 方法參數

.add() 方法是TreeMap的核心配置方法，主要參數包括：

• series_name: 系列名稱，用于提示框顯示
• data: 數據數組，支持扁平結構和層次結構
• leaf_depth: 顯示到第幾層，默認為無限層級
• pos_left, pos_right, pos_top, pos_bottom: TreeMap組件的位置
• size: TreeMap組件尺寸
• label_opts: 標簽配置
• tooltip_opts: 提示框配置
• visual_min, visual_max: 視覺映射的最小/最大值

5.2 標簽配置 (LabelOpts)

標簽配置控制矩形中文本的顯示方式：

label_opts=opts.LabelOpts(position="inside",  # 位置：inside, top, left, right, bottomformatter="{b}: {c}",  # 格式化器：{b}名稱, {c}數值, {d}百分比color="#fff",  # 文字顏色font_size=12,  # 字體大小font_style="normal",  # 字體樣式：normal, italic, obliquefont_weight="bold",  # 字體粗細：normal, bold, bolder, lighterrotate=0,  # 旋轉角度margin=8,  # 邊距is_show=True  # 是否顯示
)

5.3 視覺映射配置 (VisualMapOpts)

視覺映射可以將數據值映射到顏色：

visual_map_opts=opts.VisualMapOpts(is_show=True,  # 是否顯示視覺映射組件dimension=0,  # 指定用數據的哪個維度做映射min_=10,  # 允許的最小值max_=100,  # 允許的最大值range_color=["#313695", "#4575b4", "#74add1", "#abd9e9", "#e0f3f8", "#ffffbf", "#fee090", "#fdae61", "#f46d43", "#d73027", "#a50026"],# 顏色過渡序列is_calculable=True,  # 是否顯示拖拽用的手柄orient="vertical",  # 方向：vertical, horizontalpos_left="left",  # 位置pos_top="center"  # 位置
)

5.4 層級樣式配置 (TreeMapLevelsOpts)

可以為不同層級配置不同的樣式：

levels=[# 第一層級樣式opts.TreeMapLevelsOpts(treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color="#555",  # 邊框顏色border_width=4,  # 邊框寬度gap_width=4  # 間隙寬度)),# 第二層級樣式opts.TreeMapLevelsOpts(color_saturation=[0.3, 0.6],  # 顏色飽和度范圍treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color_saturation=0.7,  # 邊框顏色飽和度gap_width=2,  # 間隙寬度border_width=2  # 邊框寬度),),# 更多層級...
]

六、完整示例與實戰

下面是一個完整的實戰示例，展示如何使用TreeMap可視化電商銷售數據：

import pandas as pd
from pyecharts import options as opts
from pyecharts.charts import TreeMap# 模擬電商銷售數據（與之前相同）
data = [{"name": "電子產品","value": 10000,"children": [{"name": "手機", "value": 6000, "children": [{"name": "iPhone", "value": 3500},{"name": "三星", "value": 1500},{"name": "華為", "value": 1000}]},{"name": "電腦", "value": 3000, "children": [{"name": "筆記本", "value": 2000},{"name": "臺式機", "value": 1000}]},{"name": "配件", "value": 1000, "children": [{"name": "耳機", "value": 600},{"name": "充電器", "value": 400}]}]},{"name": "服裝","value": 8000,"children": [{"name": "男裝", "value": 4000, "children": [{"name": "上衣", "value": 2000},{"name": "褲子", "value": 1500},{"name": "鞋", "value": 500}]},{"name": "女裝", "value": 4000, "children": [{"name": "上衣", "value": 2500},{"name": "裙子", "value": 1000},{"name": "鞋", "value": 500}]}]},{"name": "家居","value": 5000,"children": [{"name": "家具", "value": 3000},{"name": "家紡", "value": 1500},{"name": "裝飾", "value": 500}]}
]# 創建TreeMap（修改了VisualMapOpts的range_color）
treemap = (TreeMap(init_opts=opts.InitOpts(width="1200px", height="600px", theme="dark")).add(series_name="銷售數據",data=data,levels=[opts.TreeMapLevelsOpts(treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color="#000", border_width=2, gap_width=3)),opts.TreeMapLevelsOpts(treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color="#333", border_width=1, gap_width=2)),opts.TreeMapLevelsOpts(treemap_itemstyle_opts=opts.TreeMapItemStyleOpts(border_color="#666", gap_width=1)),],label_opts=opts.LabelOpts(position="inside",formatter="{b}\n{c}",color="#fff",font_size=12),tooltip_opts=opts.TooltipOpts(formatter="{b}: {c}元")).set_global_opts(title_opts=opts.TitleOpts(title="電商銷售數據分布",subtitle="按品類和子品類劃分",pos_left="center",title_textstyle_opts=opts.TextStyleOpts(color="#fff"),subtitle_textstyle_opts=opts.TextStyleOpts(color="#ccc")),legend_opts=opts.LegendOpts(is_show=False),visualmap_opts=opts.VisualMapOpts(is_show=True,min_=500,max_=10000,range_color=["#FF0000", "#FF7F00", "#FFFF00",  # 紅色到黃色的高對比度顏色"#00FF00", "#0000FF", "#4B0082"   # 綠色、藍色到深紫色的高對比度顏色],orient="vertical",pos_left="10",pos_bottom="20"))
)treemap.render("ecommerce_sales_treemap_vivid.html")

七、總結

TreeMap是一種強大的數據可視化工具，特別適合展示層次結構數據和比例關系。PyEcharts提供了豐富的配置選項，可以創建高度定制化的TreeMap圖表。

關鍵要點：

1. TreeMap數據可以是扁平結構或層次結構
2. 可以使用label_opts配置標簽顯示方式
3. 可以使用levels參數為不同層級配置不同樣式
4. 可以使用visual_map_opts實現數據到顏色的映射
5. TreeMap支持交互功能，如點擊鉆取、懸停提示等

通過合理配置這些參數，可以創建出既美觀又實用的TreeMap圖表，有效展示復雜的數據關系。

---