js流api与JSON数据源不工作
C3.js flow api with JSON data source not working
我试图使用流api(http://c3js.org/samples/api_flow.html)从C3 json数据。我正在传递我的json与键,如http://c3js.org/reference.html#api-flow所述,但我的图表没有刷新新的数据。
下面是我的代码和jsfiddle:http://jsfiddle.net/k9Dbf/496/
var chart = c3.generate({
data: {
json: [{
"proxy": "10.0.1.15:1213",
"url": "http://www.google.com/in/aaaa",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 121,
"pageSize": 500
}],
type: 'line',
keys: {
x: 'url',
value: ['proxy', 'url', 'host', 'time', 'responsetime', "pageSize", "useragent"]
}
},
axis: {
x: {
type: 'category'
}
}
});
setTimeout(function () {
chart.flow({
data: {
json: getDataFromAPI(),
keys: {
x: 'url',
value: ['proxy', 'url', 'host', 'time', 'responsetime', "pageSize", "useragent"]
}
},
duration: 1500
})
}, 2000);
var getDataFromAPI = function () {
var data = [{
"proxy": "10.0.1.15:1211",
"url": "http://www.google.com/in/test",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 200,
"pageSize": 332
}, {
"proxy": "10.0.1.15:1212",
"url": "http://www.google.com/in/try",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 100,
"pageSize": 200
}, {
"proxy": "10.0.1.15:1213",
"url": "http://www.google.com/in/demo",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 333,
"pageSize": 500
}];
return data;
};
我在理解API方面犯了一个愚蠢的错误。我们不需要将JSON封装在data
键中。下面是工作代码:
var chart = c3.generate({
data: {
json: [{
"proxy": "10.0.1.15:1213",
"url": "http://www.google.com/in/aaaa",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 121,
"pageSize": 500
}],
type: 'line',
keys: {
x: 'url',
value: ['proxy', 'url', 'host', 'time', 'responsetime', "pageSize", "useragent"]
}
},
axis: {
x: {
type: 'category'
}
}
});
setTimeout(function () {
chart.flow({
json: getDataFromAPI(),
keys: {
x: 'url',
value: ['proxy', 'url', 'host', 'time', 'responsetime', "pageSize", "useragent"]
},
duration: 1500
})
}, 2000);
var getDataFromAPI = function () {
var data = [{
"proxy": "10.0.1.15:1211",
"url": "http://www.google.com/in/test",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 200,
"pageSize": 332
}, {
"proxy": "10.0.1.15:1212",
"url": "http://www.google.com/in/try",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 100,
"pageSize": 200
}, {
"proxy": "10.0.1.15:1213",
"url": "http://www.google.com/in/demo",
"host": "http://www.google.com/",
"time": "Thu Sep 03 2015 02:34:04 GMT-0700 (PDT)",
"useragent": "Mozilla/5.0 (X11; Linux i686) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.95 Safari/537.36",
"responsetime": 333,
"pageSize": 500
}];
return data;
};
http://jsfiddle.net/k9Dbf/497/相关文章:
- Javascript:selenium Web驱动程序isDisplayed()不工作
- jQuery UI自动完成突然停止工作
- AngularJS UI路由器不能像ng路由器那样工作
- HTML5音频加载和播放获胜'我不能在iPad上工作
- JavaScript打印功能使日历停止工作
- Javascript.getHours()工作不正常
- 为什么这在IE中的工作方式与在Firefox中不同
- 视频HTML没有'无法在Internet Explorer 11上工作
- 扩展移相器按钮类不工作
- Firebase迁移-简单的Firebase.set没有'不再工作了——旧的还是新的
- 谷歌地图不是以HTML显示,而是在JS Fiddle上工作
- 正在尝试使用if和else添加类,但无法正常工作
- Jquery FadeIn FadeOut 只工作一次
- Foreach无法在Typescript中工作
- Java/Javascript->多个用户在同一个sql数据源上工作,必须在前端保持一致
- Kendo UI DropDownList来自外部url的数据源不工作
- 剑道ui数据源“包含”过滤器不工作
- js流api与JSON数据源不工作
- Telerik数据源Json服务器分页不工作
- 在d3js布局中使用XML作为数据源;我不在firefox工作