made host vs license graph consume live data

This commit is contained in:
Jared Tabor
2014-07-03 11:49:18 -04:00
parent d6f6930847
commit a5b0864a7a
3 changed files with 69 additions and 15 deletions

View File

@@ -101,7 +101,7 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
}; };
$scope.refresh = function () { $scope.refresh = function () {
('start'); Wait('start');
loadedCount = 0; loadedCount = 0;
Rest.setUrl(GetBasePath('dashboard')); Rest.setUrl(GetBasePath('dashboard'));
Rest.get() Rest.get()

View File

@@ -10,15 +10,15 @@
'use strict'; 'use strict';
angular.module('HostGraphWidget', ['RestServices', 'Utilities']) angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
.factory('HostGraph', ['$rootScope', '$compile', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait', .factory('HostGraph', ['$rootScope', '$compile', '$location', 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
function ($rootScope, $compile) { function ($rootScope, $compile, $location, Rest, GetBasePath, ProcessErrors, Wait) {
return function (params) { return function (params) {
var scope = params.scope, var scope = params.scope,
target = params.target, target = params.target,
//dashboard = params.dashboard, //dashboard = params.dashboard,
html, element; html, element, url, license;
html = "<div class=\"graph-container\">\n"; html = "<div class=\"graph-container\">\n";
@@ -28,12 +28,66 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
html += "</div>\n"; html += "</div>\n";
html += "</div>\n"; html += "</div>\n";
function makeHostCountGraph(){
d3.json("static/js/hostcount.json",function(error,data) {
data.map(function(series) { function getLicenseNumber(){
series.values = series.values.map(function(d) { return {x: d[0], y: d[1] }; }); Rest.setUrl(GetBasePath('config'));
Rest.get()
.success(function (data) {
//$scope.$emit('dashboardReady', data);
// console.log(data);
license = data.license_info.available_instances;
makeHostCountGraph(license);
})
.error(function (data, status) {
//Wait('stWaitop');
ProcessErrors(null, data, status, null, { hdr: 'Error!', msg: 'Failed to get dashboard graph data: ' + status });
});
//return license;
};
function makeHostCountGraph(license){
url = GetBasePath('dashboard')+'graphs/';
var graphData = [];
//d3.json("static/js/jobstatusdata.json",function(error,data) {
d3.json(url, function(error,data) {
// console.log(data);
graphData = [
{
"key" : "Hosts" ,
"color" : "#1778c3",
"values": data.hosts
},
{
"key" : "License" ,
"color" : "#171717",
"values": data.hosts
}
];
graphData.map(function(series) {
if(series.key==="Hosts"){
series.values = series.values.map(function(d) {
return {
x: d[0],
y: d[1]
};
});
}
if(series.key==="License"){
series.values = series.values.map(function(d) {
return {
x: d[0],
y: license
};
});
}
return series; return series;
}); });
nv.addGraph({ nv.addGraph({
@@ -53,8 +107,8 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
chart.xAxis chart.xAxis
.axisLabel("Time") .axisLabel("Time")
.tickFormat(function(d) { .tickFormat(function(d) {
var dx = data[0].values[d] && data[0].values[d].x || 0; var dx = graphData[0].values[d] && graphData[0].values[d].x || 0;
return dx ? d3.time.format('%m/%d')(new Date(dx)) : ''; return dx ? d3.time.format('%m/%d')(new Date(Number(dx+'000'))) : '';
}); });
chart.yAxis //Chart y-axis settings chart.yAxis //Chart y-axis settings
@@ -62,7 +116,7 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
.tickFormat(d3.format('.f')); .tickFormat(d3.format('.f'));
d3.select('.host-count-graph svg') d3.select('.host-count-graph svg')
.datum(data).transition() .datum(graphData).transition()
.attr('width', width) .attr('width', width)
.attr('height', height) .attr('height', height)
.duration(500) .duration(500)
@@ -91,8 +145,8 @@ angular.module('HostGraphWidget', ['RestServices', 'Utilities'])
element = angular.element(document.getElementById(target)); element = angular.element(document.getElementById(target));
element.html(html); element.html(html);
$compile(element)(scope); $compile(element)(scope);
// makeJobStatusGraph(); getLicenseNumber();
makeHostCountGraph(); // makeHostCountGraph(license);
scope.$emit('WidgetLoaded'); scope.$emit('WidgetLoaded');
}; };

View File

@@ -11,7 +11,7 @@
angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities']) angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
.factory('JobStatusGraph', ['$rootScope', '$compile', '$location' , 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait', .factory('JobStatusGraph', ['$rootScope', '$compile', '$location' , 'Rest', 'GetBasePath', 'ProcessErrors', 'Wait',
function ($rootScope, $compile, $location, Rest, GetBasePath, ProcessErrors, Wait) { function ($rootScope, $compile , $location, Rest, GetBasePath, ProcessErrors, Wait) {
return function (params) { return function (params) {
var scope = params.scope, var scope = params.scope,
@@ -72,7 +72,7 @@ angular.module('JobStatusGraphWidget', ['RestServices', 'Utilities'])
//d3.json("static/js/jobstatusdata.json",function(error,data) { //d3.json("static/js/jobstatusdata.json",function(error,data) {
d3.json(url, function(error,data) { d3.json(url, function(error,data) {
console.log(data); //console.log(data);
graphData = [ graphData = [
{ {
"color": "#1778c3", "color": "#1778c3",