fixed pie chart formatting and added text for empty pie chart

This commit is contained in:
Jared Tabor 2014-07-14 17:14:02 -04:00
parent f56a8c16b0
commit 3ced24655a
4 changed files with 27 additions and 17 deletions

View File

@ -74,36 +74,36 @@ function Home($scope, $compile, $routeParams, $rootScope, $location, Wait, Dashb
$scope.removeDashboardReady = $scope.$on('dashboardReady', function (e, data) {
DashboardCounts({
scope: $scope,
target: 'container1',
target: 'dash-counts',
dashboard: data
});
JobStatusGraph({
scope: $scope,
target: 'container2',
target: 'dash-job-status-graph',
dashboard: data
});
if ($rootScope.user_is_superuser === true) {
HostGraph({
scope: $scope,
target: 'container3',
target: 'dash-host-count-graph',
dashboard: data
});
}
else{
$('#container4').replaceWith("<div id='container4' class='left-side col-sm-12 col-xs-12'></div>");
$('#dash-host-count-graph').replaceWith("<div id='dash-host-count-graph' class='left-side col-sm-12 col-xs-12'></div>");
}
DashboardJobs({
scope: $scope,
target: 'container4',
target: 'dash-jobs-list',
dashboard: data
});
HostPieChart({
scope: $scope,
target: 'container5',
target: 'dash-host-status-graph',
dashboard: data
});

View File

@ -24,6 +24,7 @@ function JobsListController ($log, $scope, $compile, $routeParams, ClearScope, B
expecting = 0,
max_rows;
event_socket = Socket({
scope: $scope,
endpoint: "jobs"
@ -274,7 +275,7 @@ function JobsListController ($log, $scope, $compile, $routeParams, ClearScope, B
}
JobsListController.$inject = [ '$log', '$scope', '$compile', '$routeParams', 'ClearScope', 'Breadcrumbs', 'LoadBreadCrumbs', 'LoadSchedulesScope', 'LoadJobsScope', 'RunningJobsList', 'CompletedJobsList',
'QueuedJobsList', 'ScheduledJobsList', 'GetChoices', 'GetBasePath', 'Wait', 'Socket' ];
'QueuedJobsList', 'ScheduledJobsList', 'GetChoices', 'GetBasePath', 'Wait', 'Socket'];
function JobsEdit($scope, $rootScope, $compile, $location, $log, $routeParams, JobForm, JobTemplateForm, GenerateForm, Rest,
Alert, ProcessErrors, LoadBreadCrumbs, RelatedSearchInit, RelatedPaginateInit, ReturnToCaller, ClearScope, InventoryList,

View File

@ -62,6 +62,10 @@ angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
.x(function(d) { return d.label; })
.y(function(d) { return d.value; })
.showLabels(true)
.labelThreshold(0.01)
.tooltipContent(function(x, y) {
return '<b>'+x+'</b>'+ '<p>' + Math.floor(y) + ' hosts ' + '</p>';
})
.color(['#00aa00', '#aa0000']);
chart.pie.pieLabelsOutside(true).labelType("percent");
@ -71,7 +75,13 @@ angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
.attr('width', width)
.attr('height', height)
.transition().duration(350)
.call(chart);
.call(chart)
.style({
"font-family": 'Open Sans',
"font-style": "normal",
"font-weight":400,
"src": "url(/static/fonts/OpenSans-Regular.ttf)"
});
nv.utils.windowResize(chart.update);
scope.$emit('WidgetLoaded');
return chart;
@ -86,13 +96,12 @@ angular.module('HostPieChartWidget', ['RestServices', 'Utilities'])
canvas = document.getElementById("circlecanvas");
context = canvas.getContext("2d");
context.arc(50, 50, 50, 0, Math.PI * 2, false);
//context.beginPath();
context.globalAlpha = 0.4;
context.fillStyle = '#A9A9A9';
context.fill();
context.lineWidth = 1;
context.strokeStyle = '#1778c3';
context.stroke();
context.font = "12px Open Sans";
context.fillText("No Host data",10,50);
scope.$emit('WidgetLoaded');
}
};

View File

@ -9,15 +9,15 @@
-->
<div class="row">
<div id="container1" class="col-sm-12 col-xs-12"></div>
<div id="dash-counts" class="col-sm-12 col-xs-12"></div>
</div>
<div class="row">
<div id="container2" class="left-side col-sm-6 col-xs-12"></div>
<div id="container5" class="right-side col-sm-6 col-xs-12"></div>
<div id="dash-job-status-graph" class="left-side col-sm-6 col-xs-12"></div>
<div id="dash-host-status-graph" class="right-side col-sm-6 col-xs-12"></div>
</div>
<div class="row">
<div id="container4" class="left-side col-sm-6 col-xs-12"></div>
<div id="container3" class="right-side col-sm-6 col-xs-12"></div>
<div id="dash-jobs-list" class="left-side col-sm-6 col-xs-12"></div>
<div id="dash-host-count-graph" class="right-side col-sm-6 col-xs-12"></div>
</div>
</div>
</div>