动态流式数据的按需裁剪是依托属性描述符实现的逻辑处理，包括数据源接入时声明裁剪意图、渲染前执行轻量裁剪、图表联动时上下文感知裁剪，从而实现低代码下的流式数据治理。
在 B 端可视化大屏中，“动态流式数据的按需裁剪”不是指视频或图像裁剪，而是对持续到达的实时数据流（如每秒数千条设备上报、订单事件、日志指标）进行逻辑层面的筛选、截断、聚合或窗口化处理，确保图表只渲染当前业务关注的有效片段。而“属性描述符”在这里并非 JavaScript 的 Object.defineProperty 机制，而是指数据字段的元信息定义——即字段名、类型、语义标签、时间戳标识、更新频率、有效范围等描述性属性。这些描述符是实现智能裁剪的前提和依据。
下面从三个关键环节说明如何依托属性描述符驱动流式数据裁剪：
数据源接入阶段：用描述符声明裁剪意图
当配置 API 或数据模型作为数据源时，系统允许为每个字段添加结构化描述符。例如：
{
"field": "timestamp",
"type": "datetime",
"isTimeKey": true,
"format": "YYYY-MM-DD HH:mm:ss"
},
{
"field": "device_id",
"type": "string",
"isDimension": true,
"filterable": true
},
{
"field": "cpu_usage",
"type": "number",
"min": 0,
"max": 100,
"outlierThreshold": 99.5
}
这些描述符让系统知道：
- 哪个字段是时间主键（用于滑动窗口）
- 哪些是维度字段（支持下钻/筛选）
- 哪些是度量字段且含异常阈值（触发自动剔除）
✅ 实际效果：接入后，大屏组件可自动启用“最近5分钟滚动窗口”或“仅展示 cpu_usage
渲染前处理阶段：基于描述符执行轻量裁剪
在数据抵达图表前，由统一的数据加工层（如 BI 平台内置的 dataProcessor 模块）读取字段描述符，动态注入裁剪逻辑：
- 时间字段存在 → 启用
timeWindow: { unit: 'minute', span: 5 } - 存在
outlierThreshold→ 过滤超出该值的记录 - 字段标记
isDimension: true且用户已选择某设备 → 自动添加WHERE device_id = 'D-2084'
该过程不修改原始数据源，而是生成一份按需裁剪后的子集，供 ECharts 或 Canvas 渲染器使用。
图表联动阶段：描述符支撑上下文感知裁剪
当用户点击地图上的某个区域、切换下拉框中的产线编号，或拖动时间轴时，系统会结合当前交互目标与字段描述符，实时重算裁剪边界：
- 若点击热力图某网格，且该网格绑定
region_code字段，而该字段描述符中注明"hierarchy": ["province", "city", "district"]，则自动将后续所有图表数据裁剪为该region_code下的子集； - 若时间轴缩放到“最近1小时”，而
timestamp字段描述符含"granularity": "second"，系统会主动降采样（如每10秒取均值），避免前端渲染过载。
这种裁剪不是静态规则，而是由字段语义驱动的响应式行为。
以上方式已在图扑 HT、FineVis、以及自研 Vue3+Pinia 大屏平台中落地。核心价值在于：把“裁什么、为什么裁、何时裁”的决策权，从硬编码逻辑转移到可配置、可复用、可审计的字段描述符上。开发人员定义一次描述符，业务人员即可通过界面完成多场景裁剪策略配置，真正实现低代码下的流式数据治理。
