Google Charts - 带有曲线（平滑）线的面积图答案

【问题标题】：Google Charts - Area Charts with Curved (Smooth) LinesGoogle Charts - 带有曲线（平滑）线的面积图
【发布时间】：2016-05-10 12:17:19
【问题描述】：

我正在尝试在 Google Charts 中创建一个面积图，但我希望线条是弯曲的而不是尖锐的。选项 curveType: 函数似乎只在折线图中有效。之前有人破解过这个吗？

【问题讨论】：

提供代码示例
在 JSFiddle 中查看：取消注释选项中的曲线类型将导致图形不呈现。它适用于折线图。想知道面积图中是否存在平滑线条的选项 [link]jsfiddle.net/aravindfantain/eehtmkzb/1
图表不呈现，因为它应该是curveType: 'function' -- 但是此选项或任何类似选项在面积图上不可用
谢谢@WhiteHat。函数周围的引号是一个疏忽，想看看平滑选项在类似于折线图的区域图中是否可用。可惜它不存在，曲线面积图看起来更光滑！
嗨，有人知道吗？我面临同样的问题，正在寻找解决方案。

标签： google-visualization

【解决方案1】：

我认为对使用间隔的引用可能是在谈论以下内容。我在这里提供 JSON 版本的选项和数据。重要的位是选项“curveType”和“intervals”（将设置曲线下区域的颜色并指定间隔应该是一个区域），以及定义底部和顶部的数据中的两个附加列的区间。将区间的底部设置为图表底部的值（在我的例子中为 0），并将区间的顶部设置为数据点。

 "options" :   {
      "vAxis" : { "title" : "No. of Results", "titleTextStyle" : { "italic" : false} },
      "series": [{"color" : "#9a5324"}],
      "curveType" : "function",
      "intervals" : { "style" : "area", "color" : "#D49464" },
      "legend" : { "position" : "none" },
      "height" : 320,
      "width" : 355
   }

"data" : [
   [ "Month", "NumResults", { "role" : "annotation" }, { "id" : "iBottom", "type" : "number", "role" : "interval" }, { "id" : "iTop", "type" : "number", "role": "interval" } ],
   [ "Sep-2013",1000, "1000",0,1000 ],
   [ "Oct-2013",1550, "1550",0,1550 ],
   [ "Nov-2013",900,"900", 0,900 ],
   [ "Dec-2013",400,"400",0,400 ]]

【讨论】：

【解决方案2】：

关于这个主题有一个issue from 2015。第一条评论指出：

在那之前，如果你想努力，事实证明你可以做一个使用“间隔”角色平滑 AreaChart，结合多个间隔具有区域和线条的样式。您将不得不添加一个额外的系列间隔可以与正确的域值相关联。见 https://developers.google.com/chart/interactive/docs/gallery/intervals#area-intervals的间隔详情

【讨论】：