ICEN UI

降采样（LTTB）

spec.downsample：大点数序列渲染前的 Largest-Triangle-Three-Buckets 视觉保形抽样（纯函数 lttb 导出可单测）。

5000 点正弦波以 downsample: true 渲染（阈值 1000）——头部行出现「已抽样」提示 · 数据点实际只画 1000 个

…

html
<p class="demo-label" style="margin:0 0 10px">5000 点正弦波以 downsample: true 渲染（阈值 1000）——头部行出现「已抽样」提示 · 数据点实际只画 1000 个</p><div class="icen-chart" id="demo-charts-downsample" style="border:1px solid var(--icen-token-line-soft);border-radius:var(--icen-radius-md);padding:12px"></div><p class="demo-label" id="charts-downsample-status" style="margin-top:8px">…</p>
行为与接口说明

spec.downsample：大点数序列渲染前的 Largest-Triangle-Three-Buckets 视觉保形抽样（纯函数 lttb 导出可单测）。true → 阈值 1000；number → 自定阈值；line/area/scatter 生效（vbar 类目语义不降采样）。保端点保序、峰值优先；发生抽样时头部行追加 faint 提示 .icen-chart-note「已抽样 N→M 点」（诚实纪律：不抽样不出现，spec 数据保持全量）。阈值 <3 或 ≥长度原样返回。

安装

bun add @icen.ai/ui

用法

js
import { renderChart } from '@icen.ai/ui/behaviors/charts';renderChart(el, {  type: 'line',  labels, values,            // 5000 点全量数据（spec 保持全量，提示只是渲染层声明）  downsample: true,          // true → 阈值 1000；number（如 200）→ 自定阈值});/* 头部行自动追加 faint 提示：已抽样 5000→1000 点（.icen-chart-note）   纯 DOM 图型不降采样：vbar 类目语义，点必须逐个可点 */// lttb 纯函数也可单独使用（任意序列）：import { lttb } from '@icen.ai/ui/behaviors/charts';const sampled = lttb(points, 1000, (p) => p.x, (p) => p.y);// 保端点 / 保序 / 阈值 <3 或 ≥长度原样返回