Web Components for data screens

DataV Kit

Precision visual primitives for data dashboard surfaces.

datav-kit ships SSR-safe Custom Elements for large-screen dashboard decoration. Components live under Components; Guide pages stay focused on setup, themes, and authoring.

Install Components Themes

LIVE ELEMENTdvk-border-box-11

Command Center

Operations Surface

Throughput

Nodes

Latency

Decorative Containers

Numbered border boxes and HUD rails that adapt to real host sizes.

Motion Metrics

Animated numeric display with formatting, slots, and reduced-motion support.

Theme Tokens

Optional CSS variable presets for cyber blue, ice white, neon, matrix, and solar palettes.

html

<dvk-border-box-11 colors="#3d7fb8,#6ed7e8,#52f0b5">
  <section>Command Center</section>
</dvk-border-box-11>

Product Scenario

航空运行数据中台完整大屏

以航空 AOC 为业务场景，使用少量 DataV Kit 组件搭建 1920 x 1280 固定设计画布，展示企业级数据中台的整体表达能力。

运行日 D20260630华东主控 / AOC 联席

AERO OPERATIONS COMMAND CENTER

航空运行数据中台

北京时间 14:28:36全域协同状态 NORMAL

今日计划航班已执行 1,426

放行正常率同比 +1.6%

在途航班高密度航路 18

重点保障VIP / 中转 / 医疗

旅客流量值机完成 91.4%

Airspace Situation

全国空域态势总览

航路 286扇区 74流控 12

PEK北京

PVG上海

CAN广州

CTU成都

URC乌鲁木齐

MU583

CA981

CZ327

HO1295

WX-17绕飞评估

Operational Timeline

未来四小时运行节奏

12:00 - 16:00

12:00

离港波峰

13:00

航路放行

14:00

天气绕飞

15:00

到港压降

16:00

机位回收