光滑的线条图表

时间:2014-09-05 21:37:38

标签: javascript smooth spline dygraphs edges

最近我开始在我的网站上使用Dygraph作为图表,一切正常。然而,纯粹作为一种改变,我想根据我的数据绘制的线条是平滑的,而不是锐边。

如果dygraph有一个样条曲线选项,我抬起头来,但是找不到任何东西。我还搜索了Dygraph网站上的选项参考,但再次无济于事。

我唯一能找到的是用dygraph绘制的光滑边缘,它们是示例页面中的一些示例,例如:http://dygraphs.com/gallery/#g/plotter(蓝色和紫色线)

我查看了那段代码,但我无法弄清楚它是如何看起来那样的。我得到的唯一提示是使用Math.sin,Math.cos,Math.round等。但是如果我要使用那些 - 那会改变我给我的图表的数据中的值,而我不希望这样。我希望保持价值观。

如果有人知道如何实现平滑的边缘并仍然保持我的价值观 - 请分享。谢谢你的阅读!

2 个答案:

答案 0 :(得分:0)

不幸的是,在dygraphs中无法使用样条图(这也是here所述)。

如果你真的想要平滑边缘而不改变值,我建议你使用像三次样条插值这样的东西。可以找到一篇可以帮助您入门的好文章here。 那么你接下来要做的就是为大量的X值生成这些插值点。 然后使用dygraphs绘制这些值。 Dygraphs仍使用锐边显示值,但由于您为大量输入值生成这些值,因此显示的线条看起来很平滑。

注意:使用三次样条插值绘制数据点而不更改精确值。

答案 1 :(得分:0)

请参阅github上的dygraphs问题:
使用贝塞尔曲线平滑绘图仪#469
看起来Dan(dygraphs作者)在OP的问题发表几个月后就解决了这个问题。

https://github.com/danvk/dygraphs/pull/469

http://dygraphs.com/extras/