我在NVD3中有一个多条形图的图表模板:http://jsfiddle.net/hohenheim/6R7mu/5/
我有以下要显示的JSON数据:
[{"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图表所接受的格式获得它。图表目前使用的是对我来说毫无意义的样本数据。
有什么方法可以将我的数据转换成NVD3会接受的东西吗?任何帮助都很感激。
发布于 2014-05-14 00:19:28
data5似乎有这样的格式:
[
{key: x, values: VALUES, vAxis: 1},
{key: x, values: VALUES, vAxis: 1} // and maybe more for more colors
]而价值观似乎有这样的格式:
[
{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轴吗?
假设您的数据顺序是正确的,并且它只有一个源:
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就是其中之一?)
发布于 2016-09-22 18:43:49
我只是偶然发现了他们的github页面,似乎上面的答案是正确的。
https://github.com/novus/nvd3/wiki/Sample-chart-(your-first-nvd3-chart!)图表的数据格式应该是:
[
{
key: "<Series name>",
color: "<CSS color>",
values: [
{x: 0, y: 10},
{x: 1, y: 20},
{x: 2, y: 30}
....
]
},
{
key: "<Series name>"
...
}
]https://stackoverflow.com/questions/23643487
复制相似问题