求前端高频数据绘图库

[lzyong2019]

背景

我正在开发一个上位机的工具，是用 tcp 进行连接的。连接完了之后我会接收到数据，格式如下:

demo:>1,2,3
demo:>5,6,7

我需要对上面的数据进行解析组成每个通道的数据(通道由每一列元素)，如上所示就是有 3 个通道[1,5], [2,6], [3,7]。 然后需要实时的绘图，最大的问题是，这个连接数返回的数据很大约 1s 有 1w 行的数据量。我要怎么进行一个比较好的数据绘图呢。

[liuhuihao]

具体是要绘制成什么样子呢？三个柱状图，每个柱状图表示每个通道数据的数据和？ 6 ，8 ，10 这样？

[crysislinux]

你需要先找一个合适的采样算法，屏幕上肯定不可能全部去画的

[UnluckyNinja]

数据正常更新，绘图时 raf debounce 就行了，高频低频对接基本都是这个策略

[fenglayting]

使用 canvas 绘制图片，每次重新绘制图片，使用 webworker 加 WebSocket 推送，数据比较大需要后端压缩，前端解压；一秒一次很慢了。。

[3085570450tt]

可以试试 [scichart]( https://www.scichart.com/javascript-chart-features/)

[mayli]

这个连接数返回的数据很大约 1s 有 1w 行的数据量

这个 1w 行是每行刷新绘制一次？那 1w fps 哪个库也做不到。
普通显示 30-60fps 就够了，你肯定要重采样，比如把 min max last avg 质量的算一下，然后 60fps 随便找个库就能做.

[mayli]

顺便推荐个库：Dear ImGui
应该性能是够的