用于具有特定功能的折线图的 JavaScript 画布图表库答案

【问题标题】：JavaScript canvas charting library for line chart with specific features用于具有特定功能的折线图的 JavaScript 画布图表库
【发布时间】：2015-05-06 12:50:36
【问题描述】：

我正在尝试创建具有以下要求的 HTML5 画布（也可以是基于 SVG 或矢量的）折线图。

当一条线大于另一条线时，能够在两条线之间进行遮蔽。（如下图所示）。
能够绘制纹理层

-------------------------------------------------- ----- texture1 10% 宽度，texture2 90% 宽度 -------------------------------------------------- ----- texture1 20% 宽度，texture2 80% 宽度 -------------------------------------------------- ----- .. .. 等等 -------------------------------------------------- -----

能够绘制渐变图

-------------------------------------------------- ----- 颜色1 20% 颜色2 10% 颜色3 40% 颜色4 30% -------------------------------------------------- ----- 颜色1 20% 颜色2 30% 颜色3 30% 颜色4 20% -------------------------------------------------- ----- .. .. 等等 -------------------------------------------------- -----

是否有任何 javascript 库可以做到所有这些？如果没有，是否有任何图书馆可以单独使用它们。如果没有可用的开源解决方案，请推荐好的付费库。

我目前正在使用浮动图表，除了上面提到的第一点和第三点之外，它具有我想要的所有功能。

【问题讨论】：

这看起来非常专业，您可能需要从头开始制作一些东西。在任何情况下，寻求图书馆的建议都是题外话。
谢谢肯。我以后不会发布这类问题。我花了一天的时间试图找到一个适合我们需要的图书馆。是的，我们计划从头开始构建它，但在此之前，我们想知道是否有任何库可以做到这一点，因为我们正在与时间赛跑。 :)

标签： javascript html svg canvas charts

【解决方案1】：

没有理由从头开始做任何事情！渐变是ZingChart charting library 中的标准功能，您可以通过rules 轻松实现range based fill。

至于纹理层，你介意澄清一下吗？您能否提供一个示例来说明您要完成的工作？

免责声明：我是 ZingChart 团队的一员，在这里回答您可能遇到的有关实施的任何问题。

【讨论】：