签表结构 · 赛程顺序 · 赛季区间

把一届杯赛摊成树与轴

LEYU赛程用两种排布说同一件事:树状签表回答「谁和谁落在同一分支」,横向时间轴回答「哪一轮先发生」。角球与净胜球不单独开页,挂在赛季区间上,滑动范围就能看到聚合读数跟着换。

14 赛事体系,9 个联赛 + 5 类杯赛
4800 单赛季平均呈现对阵,单位场
26万+ 签表树累计节点
v4.3 当前移动端版本

01 签表读法

树状签表:从资格赛长出决赛

签表把轮次排成一列一列,同一分支的两条连线最终汇进同一个节点。读到哪一列,就知道这一轮还剩几个对阵格。

三层树状节点与连线的抽象签表示意图,节点用荧光青与珊瑚橙区分主客场,背景为深海蓝网格

一个节点由三样东西构成:1px 的节点边框、一个等宽的场次编号、以及贴在左边的状态色边。色边说明这一格归谁,编号说明它在整棵树里的位置。树枝的连线默认是网格灰蓝,路径被选中后才整段换成状态色。

  • 节点直角方块配 8px 圆角,悬停时在下方展开一条信息条,写明轮次、场次数与状态标记。
  • 连线相邻两列之间走一次折线,同一条路径上的颜色始终一致,便于顺着分支往回找。
  • 晋级线用香槟金单独标出,只落在关键对阵的取值范围上,不与状态色混用。
R1 轮数随规模伸缩

资格赛是整棵树里唯一不固定长度的部分。节点数量随参赛规模变化,但每一格保留同样的字段:场次编号、状态色边、晋级标记。展开后只显示当前这一层,其余分支保持收起状态,避免长签表一次铺满屏幕。

R2 16 场对阵 / 32 个节点

从这一轮起,签表的列宽固定下来,16 场对阵在纵向上等距排布。主客场状态色在抽签结果确认后写入节点左侧边,路径高亮也以这一列为起点向后延伸。

R3 8 场对阵 / 16 个节点

列数收缩一半,节点之间的纵向间距随之放大,这一列适合查看分支走向:上半区与下半区各自的路径在这一轮基本能看出轮廓。

R4 4 场对阵 / 8 个节点

香槟金的晋级线从这一列开始出现,标在关键对阵上,同时这一轮的净胜球读数也进入区间的聚合范围,可在下方的滑块里一并查看。

R5 2 场对阵 / 4 个节点

两场对阵共用同一列刻度,分支在这一轮收束成两条路径。主客场色边在这里最容易被逐条比对,因为对照的样本只有两组。

R6 1 场对阵 / 2 个节点

整棵树在这里收成一个终点。决赛节点不带后续连线,只保留场次编号与状态色边,作为该届签表的收口位置。

02 赛程轴

横向时间轴:轮次对齐,轮换信息贴着刻度走

同一轮的场次压在同一个刻度上,伤停与首发轮换作为附注挂在对应刻度旁边,不单独开一条信息流。

横向时间轴纹理,刻度等距分布,上方叠加错位的抽象信息块
  1. 资格赛

    对阵确认后写入签表节点,轮数按赛事规模伸缩,刻度不固定。

  2. 1/16 决赛

    16 场对阵同刻度展开,主客场状态色随对阵确认落到节点左侧。

  3. 1/8 决赛

    伤停与首发轮换在官方公布后 15 分钟内同步到对应刻度,不另做汇总。

  4. 1/4 决赛

    香槟金的晋级线开始出现,与净胜球读数在同一区间口径下显示。

  5. 半决赛

    两场对阵共用刻度,分支收束成两条路径,便于逐条比对状态色。

  6. 决赛

    单场刻度,签表树在此收口,时间轴到此结束。

赛事日历每日核对两轮;抽签结果确认后 10 分钟内重建签表,时间轴上的刻度顺序随之调整。

03 区间读数

赛季区间滑块:角球与净胜球共用一把尺

刻度分成十段,对应近十个赛季。拖动范围时,角球与净胜球同时按新范围重新聚合,不会只更新其中一个。

一条水平色带被分成十个等长区间,中段高亮,上方分布抽象柱状与折线元素
已选区间用荧光青过渡到渐变中蓝,未选段保持网格灰蓝;角度与净胜球的读数在同一次刷新里一起变。
10 默认区间跨度,近十个赛季
赛季 角球统计的聚合单位
赛季 净胜球统计的聚合单位
香槟金 关键数据的标记色

单场口径不与赛季口径混用。同一项统计在站内只保留一种说法,口径调整即整体替换。

04 状态色标

主场与客场,两种颜色贯穿所有视图

荧光青与珊瑚橙的位置固定:签表节点的左边框、统计图里的柱形与折线、以及列表中的状态点,都遵循同一套映射。

荧光青 · 主队 / 主场

出现在节点左侧边、路径高亮的起始段与图例的左半区。悬停签表节点时,同一条主队路径一次性整段亮起。

珊瑚橙 · 客队 / 客场

与荧光青镜像使用。差异标记与订正提示也借用同一色相,但只出现在文字说明旁,不占用节点色边。

左右对照的抽象色块卡片,左侧荧光青、右侧珊瑚橙,中间以细线分隔并标注符号位置
两种状态色可临时各自隐藏一项,用来单独比对主队路径或客队路径的走向。

05 手机端

手机上怎么读一整套签表

窄屏不做等比缩放,而是把轮次收成折叠条、把赛季选择器收成横向滑动条,让同一屏里只保留一条主线。

A

六条轮次折叠条自上而下排列,一次只展开一层。展开时右侧的签表分支同步高亮,收起的轮次只保留标题与等宽场次计数。

B

赛季选择器放在页面右侧的胶囊里,手感上像一条可横向拖动的带子。滚动条隐藏,但键盘左右键仍可逐段移动,焦点环用香槟金 2px 实线。

C

轻触或悬停节点时,信息条贴着节点下沿出现,写明轮次、场次数与状态标记。离开后收回,不遮挡相邻分支。

D

页面下半部的统计模块不再是窄卡片,而是横跨整屏的一行,区间读数、色标图例与滑块依次排开,纵向滚动长度因此缩短。

抽象窄屏界面轮廓,内部由折叠条与滑动条组成,全部为几何色块,无真实界面文字

06 更新与订正

数字对不上时,从哪一步开始核

签表与统计各有一条核对路径。先确认轮次与区间口径,再确认节点位置,最后才判断是数据本身需要订正。

更新节奏

  • 每日两轮赛事日历按固定节奏核对,签表节点与赛程刻度同步检查。
  • 15 分钟伤停与首发轮换在官方公布后同步,贴在对应轮的刻度旁。
  • 10 分钟抽签结果确认后重建签表,分支与连线的位置重新计算。

订正流程

  1. 确认自己看的轮次与赛季区间,切换轮次折叠条或在滑块上重新选段。
  2. 比对节点位置与场次编号,确认是不是同一条分支被误读。
  3. 仍不一致时,把轮次、节点位置与区间范围一并写清,走反馈渠道提交。