← 所有版型

点阵地图 <DotMap />

离线的点阵世界地图(Natural Earth 陆地,公有领域),上面按经纬度放编号圆点,面积与数值成正比,右侧是对应列表。

版型與風格的說明目前僅提供簡體中文。

在範例簡報中查看 →

分組
数据 · 在哪里
元件
DotMap · #dot-map

適合

  • 1–8 个国家或城市的位置和数值
  • 想让观众先看到“分布在哪”

不適合

  • 要按地区着色比较:用 Heatmap 或 BarChart
  • 地点集中在一个城市内:点阵太粗

內容上限

1markers 1–8 个,name ≤ 6 字
2listTitle ≤ 10 字
3数值含单位 ≤ 10 个字符
4地图精度为 2°,只适合国家级位置

欄位

欄位型別
kicker · 必填string标题上方的小节名,2–8 字
title · 必填string | string[]页面标题;传数组可手动断行,每项一行
leadstring一到两句导语,≤ 60 字
sourcestring事实出处;页面上有任何数据或事实时必填
hintReactNode页眉中间的操作提示,可用 <kbd>
markers · 必填{ name, lon, lat, value? }[]地点
unitstring单位
decimalsnumber小数位
listTitlestring列表标题

範例程式碼

<DotMap kicker="地图" title="…" markers={[{ name: '中国', lon: 104, lat: 35, value: 1175 }, …]} unit=" TWh" />