地球封面 <GlobeCover />
左侧标题、导语和至多 3 个事实,右侧一个离线点阵地球(正射投影),几条发光弧线沿大圆缓慢流动。地球只做装饰。
Template and style descriptions are currently available in Chinese only.
- Group
- 开场 · 第 1 页
- Component
GlobeCover·#globe-cover
Good for
- 主题和全球网络、跨国业务、地理分布有关
- 深色风格(mono-studio 等)的开场
Avoid when
- 弧线想表达真实流量或路线:用 ArcGlobe 并写出处
- 主题与地理无关:用 Cover
Content limits
| 1 | title ≤ 2 行 × 10 字 |
| 2 | lead ≤ 50 字 |
| 3 | facts 0–3 项:value ≤ 8 个字符,label ≤ 10 字 |
| 4 | arcs 0–8 条,两端都要在 center 朝向的半球 |
Fields
| Field | Type | |
|---|---|---|
kicker · required | string | 标题上方小字 |
title · required | string | string[] | 标题 |
lead | string | 导语 |
facts | { value, label }[] | 底部事实 |
center · required | [lon, lat] | 地球朝向 |
arcs | { from: [lon, lat], to: [lon, lat] }[] | 装饰弧线 |
source | string | 事实出处 |
Example
<GlobeCover kicker="公司介绍" title={['Cloudflare', '是做什么的']} center={[10, 25]} arcs={[{ from: [-74, 40.7], to: [-0.1, 51.5] }]} facts={[{ value: '348', label: '个城市' }]} />