Vega nodejs 为折线图创建“趋势线”

问题描述

我正在使用 vega 使用 nodejs 创建折线图,但是,它很尖,我想平滑曲线。例如,我希望它创建类似于下图中红线的东西(蓝线是原始图形)。

enter image description here

图表的另一个例子是:

enter image description here

vega 是否可以实现,如果不能,是否可以使用任何节点模块或公式将我的数据集转换为该模块?

这是我的 vega json 的粘贴箱:https://pastebin.com/AQ0ka85f

{ "width": 1250,"height": 500,"background": "white","signals": [{ "name": "interpolate","value": "basis" }],"data": [{ "name": "table","values": [{ "x": "04/09/2021,24:03:26","y": 13 },{ "x": "04/09/2021,24:13:26","y": 11 },24:23:26","y": 8 },24:33:26","y": 9 },24:43:26",24:53:26",01:03:26",01:13:26","y": 10 },01:23:26",01:33:26",01:43:26",01:53:26",02:03:26",02:13:26","y": 12 },02:23:26",02:33:26",02:43:26",02:53:26",03:03:26",03:13:26",03:23:26",03:33:26",03:43:26",03:53:26",04:03:26","y": 7 },04:13:26",04:23:26",04:33:26","y": 6 },04:43:26","y": 5 },04:53:26","y": 4 },05:03:26","y": 3 },05:13:26",05:23:26",05:33:26",05:43:26",05:53:26",06:03:26",06:13:26",06:23:26",06:33:26",06:43:27",06:53:27",07:03:27",07:13:27","y": 14 },07:23:27",07:33:27",07:43:27",07:53:27",08:03:27",08:13:27",08:23:27",08:33:27",08:43:27",08:53:27",09:03:27",09:13:27",09:23:27",09:33:27",09:43:27",09:53:27",10:03:27",10:13:27",10:23:27",10:33:27",10:43:27",10:53:27",11:03:27",11:13:27",11:23:27",11:33:27",11:43:27",11:53:27",12:03:27",12:13:27",12:23:27",12:33:27",12:43:27",12:53:27",13:03:27",13:13:27",13:23:27","y": 15 },13:33:27",13:43:27",13:53:27","y": 17 },14:03:27",14:13:27",14:23:27",14:33:27","y": 16 },14:43:27",14:53:27",15:03:27",15:13:27",15:23:27",15:33:27",15:43:27",15:53:27",16:03:27",16:13:27",16:23:27",16:33:27",16:43:27",16:53:27",17:03:27",17:13:27",17:23:27",17:33:27","y": 19 },17:43:27","y": 18 },17:53:27",18:03:27",18:13:27",18:23:27",18:33:27",18:43:27",18:53:27",19:03:27",19:13:27",19:23:27",19:33:27",19:43:27",19:53:27",20:03:27",20:13:27",20:23:27",20:33:27",20:43:27",20:53:27",21:03:27",21:13:27",21:23:27",21:33:27",21:43:27",21:53:27",22:03:27",22:13:27",22:23:27","y": 21 },22:33:27",22:43:27","y": 20 },22:53:27",23:03:27",23:13:27",23:23:27",23:33:27",23:43:27",23:53:27",{ "x": "04/10/2021,24:03:27",24:13:27",24:23:27",24:33:27",24:43:27",24:53:27",01:03:27",01:13:27",01:23:27",01:33:27",01:43:27",01:53:27",02:03:27",02:13:27",02:23:27",02:33:27",02:43:27",02:53:27",03:03:27",03:13:27",03:23:27",03:33:27",03:43:27",03:53:27",04:03:27",04:13:27",04:23:27",04:33:27",04:43:27",04:53:27",05:03:27",05:13:27",05:23:27",05:33:27",05:43:27",05:53:27",06:03:27",06:13:27",06:23:27",06:33:27","y": 22 },"y": 24 },"y": 23 },"y": 25 },"y": 26 },{ "x": "04/11/2021,{ "x": "04/12/2021,"y": 8 }] }],"scales": [{ "name": "x","type": "point","range": "width","domain": { "data": "table","field": "x" } },{ "name": "y","type": "linear","range": "height","nice": true,"zero": true,"field": "y" } },{ "name": "color","type": "ordinal","range": "category","field": "c" } }],"axes": [{ "orient": "bottom","scale": "x","labeloverlap": true },{ "orient": "left","scale": "y" }],"marks": [{ "type": "group","from": { "facet": { "name": "series","data": "table","groupby": "c" } },"marks": [{ "type": "line","from": { "data": "series" },"encode": { "enter": { "x": { "scale": "x","field": "x" },"y": { "scale": "y","field": "y" },"stroke": { "scale": "color","field": "c" },"strokeWidth": { "value": 2 } },"update": { "interpolate": { "signal": "interpolate" } } } }] }] }

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)