javascript - 线条流畅的 Dygraph 图表

Question

最近我开始在我的网站上使用 Dygraph 制作图表，一切正常。然而，纯粹作为一种美学上的改变，我想让基于我的数据绘制的线条变得平滑，而不是有尖锐的边缘。

我查看了 dygraph 是否有样条图选项，但我找不到任何东西。我还在 Dygraph 网站上搜索了选项引用，但同样无济于事。

我唯一发现用 dygraph 绘制的平滑边缘是他们示例页面中的一些示例，例如:http://dygraphs.com/gallery/#g/plotter (蓝色和紫色线)

我查看了它的代码，但我无法弄清楚它是如何变成那样的。我得到的唯一提示是使用了 Math.sin、Math.cos、Math.round 等。但是，如果我要使用它们，那会改变我提供给图表的数据中的值，而我不希望这样。我想保持值(value)观不变。

如果有人知道我如何才能实现平滑的边缘并仍然保持我的值(value)观，请分享。感谢阅读!

Answer 1

不幸的是，样条图在 dygraphs 中是不可能的(这也说明了 here )。

如果您真的想要在不更改值的情况下平滑边缘，我建议您使用三次样条插值之类的方法。可以找到一篇可以帮助您入门的好文章 here .因此，您接下来要做的是为大量 X 值生成这些插值点。然后你使用 dygraphs 绘制这些值。 Dygraphs 仍然使用尖锐的边缘来显示值，但是因为您为大量输入值生成这些值，所以显示的线条看起来很平滑。

注意:使用三次样条插值，您可以在不更改精确值的情况下绘制数据点。