将 JSON 数据解析为 C3.js 图表的数组答案

【问题标题】：Parsing JSON data into an array for a C3.js chart将 JSON 数据解析为 C3.js 图表的数组
【发布时间】：2018-06-01 22:45:41
【问题描述】：

我正在以这种格式从 django 向 C3.js 发送一个 json 变量：

{
   datetime.date(2015, 5, 1): 22792461.479999978, 
   datetime.date(2015, 6, 1): 24807797.38999998, 
   datetime.date(2015, 7, 1): 25261456.609999962
}

我需要提取这些值并将它们编译成一个可供 c3.js 使用的数组。这是我的脚本：

<script>
   {% include "croydon_dashboards/dashboard_includes/gb_locale.html" %}

   var row_value = {{ row_value }};
   var sum_list = [];

   for(var i in row_value)
      sum_list.push(row_value[i])

   sum_list = JSON.stringify(sum_list);

   var chart = c3.generate({
       data: {
          columns: [
              sum_list
          ],
          type: 'bar'
       },
        bar: {
           width: {
              ratio: 0.5
           }
       }
   });
</script>

将值硬编码到图表中有效，所以我知道 c3.js 是正确的，但我构建数组的方式有问题。

我知道这里有答案：JSON Data doesn't show on c3.js bar chart

但我是 javascript 新手，不知道如何解析我正在使用的 json。

【问题讨论】：

你为什么要对列表进行字符串化sum_list = JSON.stringify(sum_list);？
我不知道 :( 我只是想办法让价值观发挥作用，但没有成功。
@woodbine，使用提供的 JSON，您应该生成什么？一行还是一列？
我正在尝试使用来自 json 的值构建一个列表，如下所示：[22792461.479999978, 24807797.38999998, 25261456.609999962]

标签： javascript json c3.js

【解决方案1】：

您不需要 JSON.stringify() 将您的数据与 c3 一起使用。
但是你可能需要 JSON.parse() 让它看起来像这样：

var row_value = {
   "2015-05-01": 22792461.479999978, 
   "2015-06-01": 24807797.38999998, 
   "2015-07-01": 25261456.609999962
};

并且不要忘记在数据数组的开头添加文本标签：

// This first value of array if the name of your data
 var sum_list = ['something'];

您的其余代码可以正常工作。

 for(var i in row_value)
    sum_list.push(row_value[i])


 var chart = c3.generate({
     data: {
        columns: [
            sum_list
        ],
        type: 'bar'
     },
      bar: {
         width: {
            ratio: 0.5
         }
     }
 });

见this fiddle。

【讨论】：