注意:如何将json数据系列转换为人力车系列。
我从网址获取json数据系列,我想用这个系列在人力车和angularjs中绘制图形。
来自网址的Json数据系列
{"series": [{"meter": "instance", "data": [{"y": 82.0, "x": "2015-07-14T23:58:00"}, {"y": 142.0, "x": "2015-07-15T23:58:10"}, {"y": 144.0, "x": "2015-07-16T23:58:10"}, {"y": 139.0, "x": "2015-07-17T23:56:17"}, {"y": 144.0, "x": "2015-07-18T23:56:18"}, {"y": 144.0, "x": "2015-07-19T23:56:17"}, {"y": 277.0, "x": "2015-07-20T23:50:09"}, {"y": 294.0, "x": "2015-07-21T23:51:34"}, {"y": 135.0, "x": "2015-07-22T07:21:34"}], "name": "demo", "unit": "instance"}], "settings": {}}
我根据人力车中使用的系列使用上述系列,但它不起作用..
angular.module('hz.dashboard.ceilometer', [ 'ngSanitize' ])
.controller('ceiloCtrl', function AppCtrl ($scope) {
var text='{"series": [{"meter": "instance", "data": [
{"y": 82.0, "x": "2015-07-14T23:58:00"},
{"y": 142.0, "x": "2015-07-15T23:58:10"},
{"y": 144.0, "x": "2015-07-16T23:58:10"},
{"y": 139.0, "x": "2015-07-17T23:56:17"},
{"y": 144.0, "x": "2015-07-18T23:56:18"},
{"y": 144.0, "x": "2015-07-19T23:56:17"},
{"y": 277.0, "x": "2015-07-20T23:50:09"},
{"y": 294.0, "x": "2015-07-21T23:51:34"},
{"y": 135.0, "x": "2015-07-22T07:21:34"}],
"name": "demo", "unit": "instance"}], "settings": {}}';
var obj =JSON.parse(text);
var graph = new Rickshaw.Graph( {
element: document.getElementById("chart"),
width: 960,
height: 500,
renderer: 'line',
series: [
{
color: "#c05020",
data: obj.series[0].data,
}
]
} );
graph.render();
var hoverDetail = new Rickshaw.Graph.HoverDetail({
graph: graph,
xFormatter: function(x){
return new Date(x*1000).toString();
}
});
var xAxis = new Rickshaw.Graph.Axis.Time( {
graph: graph,
ticksTreatment: ticksTreatment,
timeFixture: new Rickshaw.Fixtures.Time.Local()
} );
xAxis.render();
});