NVD3图表中的JSON数据格式 [英] JSON data format in NVD3 chart

查看:102
本文介绍了NVD3图表中的JSON数据格式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在此处具有NVD3中的多条形图的图表模板: http://jsfiddle.net /hohenheim/6R7mu/5/

I have a chart template for a multi bar chart in NVD3 here: http://jsfiddle.net/hohenheim/6R7mu/5/

我要显示以下JSON数据:

I have the following JSON data I want to display:

[{"date": 1396828800, "impressions": 49145385},
{"date": 1396915200, "impressions": 46704447},
{"date": 1397001600, "impressions": 47181000},
{"date": 1397088000, "impressions": 47337965},
{"date": 1397174400, "impressions": 51129266},
{"date": 1397260800, "impressions": 60547397},
{"date": 1397347200, "impressions": 62217077},
{"date": 1397433600, "impressions": 49145385},
{"date": 1397520000, "impressions": 46704447},
{"date": 1397606400, "impressions": 47181000},
{"date": 1397692800, "impressions": 47337965},
{"date": 1397779200, "impressions": 51129266},
{"date": 1397865600, "impressions": 60547397},
{"date": 1397952000, "impressions": 62217077}]

我希望使用自己拥有的JSON数据(如上所示,并在小提琴中已注释掉),但不知道如何以此NVD3图表接受的格式获取它.该图表当前使用的示例数据对我来说毫无意义.

I'm looking to use JSON data I have (shown above and also commented out in the fiddle) but don't have any idea how to get it in the format that this NVD3 chart will accept. The chart is currently using sample data that is meaningless to me.

是否可以将我的数据转换为NVD3可以接受的内容?任何帮助表示赞赏.

Is there a way to convert my data into something NVD3 will accept? Any help appreciated.

推荐答案

data5似乎具有以下格式:

data5 seems to have this format:

[
  {key: x, values: VALUES, vAxis: 1},
  {key: x, values: VALUES, vAxis: 1} // and maybe more for more colors
]

和VALUES似乎具有以下格式:

and VALUES seems to have this format:

[
  {x: 0, y: N},
  {x: 1, y: N},
  {x: 2, y: N} // and more for more on the X axis
]

因此,您必须将数据重写为该格式.只是似乎您没有更多的来源.您只有一种颜色.是什么使{"date": 1396828800, "impressions": 49145385}彼此对应? date是X轴吗?

So you have to rewrite your data to that format. Only it seems you don't have more sources. You have only 1 color. What makes {"date": 1396828800, "impressions": 49145385} one or the other? Is date the X axis?

假设您的数据顺序正确,并且只有1个来源:

Assuming the order of your data is correct, and it's only 1 source:

data5 = [{key: 'X', values: [], vAxis: 1}]
yourData.forEach(function(el, i) {
  data5[0].values.push({x: i, y: el.impressions});
     // ^ only 1 source/color
                        // ^ incremental X, starting at 0
});

您可能必须以某种方式调整x和y范围. (也许vAxis是一个?)

You might have to adjust the x and y range somehow. (Maybe vAxis is one?)

这篇关于NVD3图表中的JSON数据格式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆