ICEN UI

流式追加

handle.append(label, values, { maxPoints })（line/area/vbar）：复用当前 spec 对象 push 类目与点后重渲（交互委托不动，高效路径）；

点「推送一拍」模拟流式数据（maxPoints 30 滑动窗口）——头部行提示随追加更新

…

html
<p class="demo-label" style="margin:0 0 10px">点「推送一拍」模拟流式数据（maxPoints 30 滑动窗口）——头部行提示随追加更新</p><div class="icen-toolbar" style="margin:0 0 10px">  <button class="icen-btn icen-btn-sm icen-btn-primary" type="button" id="charts-append-push">推送一拍</button>  <button class="icen-btn icen-btn-sm" type="button" id="charts-append-burst">连推 10 拍</button></div><div class="icen-chart" id="demo-charts-append" style="border:1px solid var(--icen-token-line-soft);border-radius:var(--icen-radius-md);padding:12px"></div><p class="demo-label" id="charts-append-status" style="margin-top:8px">…</p>
行为与接口说明

handle.append(label, values, { maxPoints })（line/area/vbar）：复用当前 spec 对象 push 类目与点后重渲（交互委托不动，高效路径）；超出 maxPoints 时头部淘汰（滑动窗口）；多系列 values 按系列对位（缺失补 0）；缩放窗开启时跟随尾部；与 downsample 同开时追加后重新降采样（提示更新）。非生效类型 no-op + console.warn 一次。

安装

bun add @icen.ai/ui

用法

js
const handle = renderChart(el, { type: 'line', labels, values, downsample: true });source.onTick((label, value) => {  handle.append(label, [value], { maxPoints: 500 });  // 滑动窗口：超出头部淘汰});/* 多系列：handle.append(label, [s1, s2], { maxPoints })（缺失值补 0）   缩放态 append：窗口跟随尾部；非 line/area/vbar → no-op + warn 一次 */