Replace dimplejs by c3js for chart drawing
This commit is contained in:
Frederic Guillot
parent
1465ca1ae1
commit
81e40e2c91
|
|
@ -34,24 +34,12 @@ class Analytic extends Base
|
|||
public function tasks()
|
||||
{
|
||||
$project = $this->getProject();
|
||||
$metrics = $this->projectAnalytic->getTaskRepartition($project['id']);
|
||||
|
||||
if ($this->request->isAjax()) {
|
||||
$this->response->json(array(
|
||||
'metrics' => $metrics,
|
||||
'labels' => array(
|
||||
'column_title' => t('Column'),
|
||||
'nb_tasks' => t('Number of tasks'),
|
||||
)
|
||||
));
|
||||
}
|
||||
else {
|
||||
$this->response->html($this->layout('analytic/tasks', array(
|
||||
'project' => $project,
|
||||
'metrics' => $metrics,
|
||||
'title' => t('Task repartition for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
$this->response->html($this->layout('analytic/tasks', array(
|
||||
'project' => $project,
|
||||
'metrics' => $this->projectAnalytic->getTaskRepartition($project['id']),
|
||||
'title' => t('Task repartition for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -62,24 +50,12 @@ class Analytic extends Base
|
|||
public function users()
|
||||
{
|
||||
$project = $this->getProject();
|
||||
$metrics = $this->projectAnalytic->getUserRepartition($project['id']);
|
||||
|
||||
if ($this->request->isAjax()) {
|
||||
$this->response->json(array(
|
||||
'metrics' => $metrics,
|
||||
'labels' => array(
|
||||
'user' => t('User'),
|
||||
'nb_tasks' => t('Number of tasks'),
|
||||
)
|
||||
));
|
||||
}
|
||||
else {
|
||||
$this->response->html($this->layout('analytic/users', array(
|
||||
'project' => $project,
|
||||
'metrics' => $metrics,
|
||||
'title' => t('User repartition for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
$this->response->html($this->layout('analytic/users', array(
|
||||
'project' => $project,
|
||||
'metrics' => $this->projectAnalytic->getUserRepartition($project['id']),
|
||||
'title' => t('User repartition for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -100,30 +76,20 @@ class Analytic extends Base
|
|||
$to = $values['to'];
|
||||
}
|
||||
|
||||
if ($this->request->isAjax()) {
|
||||
$this->response->json(array(
|
||||
'columns' => array_values($this->board->getColumnsList($project['id'])),
|
||||
'metrics' => $this->projectDailySummary->getRawMetrics($project['id'], $from, $to),
|
||||
'labels' => array(
|
||||
'column' => t('Column'),
|
||||
'day' => t('Date'),
|
||||
'total' => t('Tasks'),
|
||||
)
|
||||
));
|
||||
}
|
||||
else {
|
||||
$this->response->html($this->layout('analytic/cfd', array(
|
||||
'values' => array(
|
||||
'from' => $from,
|
||||
'to' => $to,
|
||||
),
|
||||
'display_graph' => $this->projectDailySummary->countDays($project['id'], $from, $to) >= 2,
|
||||
'project' => $project,
|
||||
'date_format' => $this->config->get('application_date_format'),
|
||||
'date_formats' => $this->dateParser->getAvailableFormats(),
|
||||
'title' => t('Cumulative flow diagram for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
$display_graph = $this->projectDailySummary->countDays($project['id'], $from, $to) >= 2;
|
||||
|
||||
$this->response->html($this->layout('analytic/cfd', array(
|
||||
'values' => array(
|
||||
'from' => $from,
|
||||
'to' => $to,
|
||||
),
|
||||
'display_graph' => $display_graph,
|
||||
'metrics' => $display_graph ? $this->projectDailySummary->getAggregatedMetrics($project['id'], $from, $to) : array(),
|
||||
'project' => $project,
|
||||
'date_format' => $this->config->get('application_date_format'),
|
||||
'date_formats' => $this->dateParser->getAvailableFormats(),
|
||||
'title' => t('Cumulative flow diagram for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -144,27 +110,19 @@ class Analytic extends Base
|
|||
$to = $values['to'];
|
||||
}
|
||||
|
||||
if ($this->request->isAjax()) {
|
||||
$this->response->json(array(
|
||||
'metrics' => $this->projectDailySummary->getRawMetricsByDay($project['id'], $from, $to),
|
||||
'labels' => array(
|
||||
'day' => t('Date'),
|
||||
'score' => t('Complexity'),
|
||||
)
|
||||
));
|
||||
}
|
||||
else {
|
||||
$this->response->html($this->layout('analytic/burndown', array(
|
||||
'values' => array(
|
||||
'from' => $from,
|
||||
'to' => $to,
|
||||
),
|
||||
'display_graph' => $this->projectDailySummary->countDays($project['id'], $from, $to) >= 2,
|
||||
'project' => $project,
|
||||
'date_format' => $this->config->get('application_date_format'),
|
||||
'date_formats' => $this->dateParser->getAvailableFormats(),
|
||||
'title' => t('Burndown chart for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
$display_graph = $this->projectDailySummary->countDays($project['id'], $from, $to) >= 2;
|
||||
|
||||
$this->response->html($this->layout('analytic/burndown', array(
|
||||
'values' => array(
|
||||
'from' => $from,
|
||||
'to' => $to,
|
||||
),
|
||||
'display_graph' => $display_graph,
|
||||
'metrics' => $display_graph ? $this->projectDailySummary->getAggregatedMetrics($project['id'], $from, $to, 'score') : array(),
|
||||
'project' => $project,
|
||||
'date_format' => $this->config->get('application_date_format'),
|
||||
'date_formats' => $this->dateParser->getAvailableFormats(),
|
||||
'title' => t('Burndown chart for "%s"', $project['name']),
|
||||
)));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -945,4 +945,7 @@ return array(
|
|||
'New due date: %B %e, %Y' => 'Nouvelle date d\'échéance : %d/%m/%Y',
|
||||
'Start date changed: %B %e, %Y' => 'Date de début modifiée : %d/%m/%Y',
|
||||
'%k:%M %p' => '%H:%M',
|
||||
'%%Y-%%m-%%d' => '%%d/%%m/%%Y',
|
||||
'Total for all columns' => 'Total pour toutes les colonnes',
|
||||
'You need at least 2 days of data to show the chart.' => 'Vous avez besoin d\'au minimum 2 jours de données pour afficher le graphique.',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -943,4 +943,7 @@ return array(
|
|||
// 'New due date: %B %e, %Y' => '',
|
||||
// 'Start date changed: %B %e, %Y' => '',
|
||||
// '%k:%M %p' => '',
|
||||
// '%%Y-%%m-%%d' => '',
|
||||
// 'Total for all columns' => '',
|
||||
// 'You need at least 2 days of data to show the chart.' => '',
|
||||
);
|
||||
|
|
|
|||
|
|
@ -149,9 +149,10 @@ class ProjectDailySummary extends Base
|
|||
* @param integer $project_id Project id
|
||||
* @param string $from Start date (ISO format YYYY-MM-DD)
|
||||
* @param string $to End date
|
||||
* @param string $column Column to aggregate
|
||||
* @return array
|
||||
*/
|
||||
public function getAggregatedMetrics($project_id, $from, $to)
|
||||
public function getAggregatedMetrics($project_id, $from, $to, $column = 'total')
|
||||
{
|
||||
$columns = $this->board->getColumnsList($project_id);
|
||||
$column_ids = array_keys($columns);
|
||||
|
|
@ -172,7 +173,7 @@ class ProjectDailySummary extends Base
|
|||
$aggregates[$record['day']] = array($record['day']);
|
||||
}
|
||||
|
||||
$aggregates[$record['day']][$record['column_id']] = $record['total'];
|
||||
$aggregates[$record['day']][$record['column_id']] = $record[$column];
|
||||
}
|
||||
|
||||
// Aggregate by row
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<p class="alert"><?= t('Not enough data to show the graph.') ?></p>
|
||||
<?php else: ?>
|
||||
<section id="analytic-burndown">
|
||||
<div id="chart" data-url="<?= $this->url->href('analytic', 'burndown', array('project_id' => $project['id'], 'from' => $values['from'], 'to' => $values['to'])) ?>"></div>
|
||||
<div id="chart" data-metrics='<?= json_encode($metrics) ?>' data-date-format="<?= e('%%Y-%%m-%%d') ?>" data-label-total="<?= t('Total for all columns') ?>"></div>
|
||||
</section>
|
||||
<?php endif ?>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,10 +3,10 @@
|
|||
</div>
|
||||
|
||||
<?php if (! $display_graph): ?>
|
||||
<p class="alert"><?= t('Not enough data to show the graph.') ?></p>
|
||||
<p class="alert"><?= t('You need at least 2 days of data to show the chart.') ?></p>
|
||||
<?php else: ?>
|
||||
<section id="analytic-cfd">
|
||||
<div id="chart" data-url="<?= $this->url->href('analytic', 'cfd', array('project_id' => $project['id'], 'from' => $values['from'], 'to' => $values['to'])) ?>"></div>
|
||||
<div id="chart" data-metrics='<?= json_encode($metrics) ?>' data-date-format="<?= e('%%Y-%%m-%%d') ?>"></div>
|
||||
</section>
|
||||
<?php endif ?>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<?= $this->asset->js('assets/js/vendor/d3.v3.4.8.min.js') ?>
|
||||
<?= $this->asset->js('assets/js/vendor/dimple.v2.1.2.min.js') ?>
|
||||
<?= $this->asset->js('assets/js/vendor/d3.v3.min.js') ?>
|
||||
<?= $this->asset->js('assets/js/vendor/c3.min.js') ?>
|
||||
|
||||
<section id="main">
|
||||
<div class="page-header">
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<?php else: ?>
|
||||
<section id="analytic-task-repartition">
|
||||
|
||||
<div id="chart" data-url="<?= $this->url->href('analytic', 'tasks', array('project_id' => $project['id'])) ?>"></div>
|
||||
<div id="chart" data-metrics='<?= json_encode($metrics) ?>'></div>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
<?php else: ?>
|
||||
<section id="analytic-user-repartition">
|
||||
|
||||
<div id="chart" data-url="<?= $this->url->href('analytic', 'users', array('project_id' => $project['id'])) ?>"></div>
|
||||
<div id="chart" data-metrics='<?= json_encode($metrics) ?>'></div>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<?= $this->asset->js('assets/js/vendor/d3.v3.4.8.min.js') ?>
|
||||
<?= $this->asset->js('assets/js/vendor/dimple.v2.1.2.min.js') ?>
|
||||
<?= $this->asset->js('assets/js/vendor/d3.v3.min.js') ?>
|
||||
<?= $this->asset->js('assets/js/vendor/c3.min.js') ?>
|
||||
|
||||
<div class="page-header">
|
||||
<h2><?= t('Budget overview') ?></h2>
|
||||
|
|
@ -8,7 +8,8 @@
|
|||
<?php if (! empty($daily_budget)): ?>
|
||||
<div id="budget-chart">
|
||||
<div id="chart"
|
||||
data-serie='<?= json_encode($daily_budget) ?>'
|
||||
data-date-format="<?= e('%%Y-%%m-%%d') ?>"
|
||||
data-metrics='<?= json_encode($daily_budget) ?>'
|
||||
data-labels='<?= json_encode(array('in' => t('Budget line'), 'out' => t('Expenses'), 'left' => t('Remaining'), 'value' => t('Amount'), 'date' => t('Date'), 'type' => t('Type'))) ?>'></div>
|
||||
</div>
|
||||
<hr/>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1 @@
|
|||
.c3 svg{font:10px sans-serif}.c3 line,.c3 path{fill:none;stroke:#000}.c3 text{-webkit-user-select:none;-moz-user-select:none;user-select:none}.c3-bars path,.c3-event-rect,.c3-legend-item-tile,.c3-xgrid-focus,.c3-ygrid{shape-rendering:crispEdges}.c3-chart-arc path{stroke:#fff}.c3-chart-arc text{fill:#fff;font-size:13px}.c3-grid line{stroke:#aaa}.c3-grid text{fill:#aaa}.c3-xgrid,.c3-ygrid{stroke-dasharray:3 3}.c3-text.c3-empty{fill:gray;font-size:2em}.c3-line{stroke-width:1px}.c3-circle._expanded_{stroke-width:1px;stroke:#fff}.c3-selected-circle{fill:#fff;stroke-width:2px}.c3-bar{stroke-width:0}.c3-bar._expanded_{fill-opacity:.75}.c3-target.c3-focused{opacity:1}.c3-target.c3-focused path.c3-line,.c3-target.c3-focused path.c3-step{stroke-width:2px}.c3-target.c3-defocused{opacity:.3!important}.c3-region{fill:#4682b4;fill-opacity:.1}.c3-brush .extent{fill-opacity:.1}.c3-legend-item{font-size:12px}.c3-legend-item-hidden{opacity:.15}.c3-legend-background{opacity:.75;fill:#fff;stroke:#d3d3d3;stroke-width:1}.c3-tooltip-container{z-index:10}.c3-tooltip{border-collapse:collapse;border-spacing:0;background-color:#fff;empty-cells:show;-webkit-box-shadow:7px 7px 12px -9px #777;-moz-box-shadow:7px 7px 12px -9px #777;box-shadow:7px 7px 12px -9px #777;opacity:.9}.c3-tooltip tr{border:1px solid #CCC}.c3-tooltip th{background-color:#aaa;font-size:14px;padding:2px 5px;text-align:left;color:#FFF}.c3-tooltip td{font-size:13px;padding:3px 6px;background-color:#fff;border-left:1px dotted #999}.c3-tooltip td>span{display:inline-block;width:10px;height:10px;margin-right:6px}.c3-tooltip td.value{text-align:right}.c3-area{stroke-width:0;opacity:.2}.c3-chart-arcs-title{dominant-baseline:middle;font-size:1.3em}.c3-chart-arcs .c3-chart-arcs-background{fill:#e0e0e0;stroke:none}.c3-chart-arcs .c3-chart-arcs-gauge-unit{fill:#000;font-size:16px}.c3-chart-arcs .c3-chart-arcs-gauge-max,.c3-chart-arcs .c3-chart-arcs-gauge-min{fill:#777}.c3-chart-arc .c3-gauge-value{fill:#000}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,209 +1,190 @@
|
|||
|
||||
Kanboard.Analytic = (function() {
|
||||
|
||||
// CFD diagram
|
||||
function drawCfd()
|
||||
{
|
||||
var metrics = $("#chart").data("metrics");
|
||||
var columns = [];
|
||||
var groups = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
|
||||
for (var j = 0; j < metrics[i].length; j++) {
|
||||
|
||||
if (i == 0) {
|
||||
columns.push([metrics[i][j]]);
|
||||
|
||||
if (j > 0) {
|
||||
groups.push(metrics[i][j]);
|
||||
}
|
||||
}
|
||||
else {
|
||||
columns[j].push(metrics[i][j]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
c3.generate({
|
||||
data: {
|
||||
columns: columns,
|
||||
x: metrics[0][0],
|
||||
type: 'area-spline',
|
||||
groups: [groups]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'timeseries',
|
||||
tick: {
|
||||
format: $("#chart").data("date-format")
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Burndown chart
|
||||
function drawBurndown()
|
||||
{
|
||||
var metrics = $("#chart").data("metrics");
|
||||
var columns = [[$("#chart").data("label-total")]];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
|
||||
for (var j = 0; j < metrics[i].length; j++) {
|
||||
|
||||
if (i == 0) {
|
||||
columns.push([metrics[i][j]]);
|
||||
}
|
||||
else {
|
||||
columns[j + 1].push(metrics[i][j]);
|
||||
|
||||
if (j > 0) {
|
||||
|
||||
if (columns[0][i] == undefined) {
|
||||
columns[0].push(0);
|
||||
}
|
||||
|
||||
columns[0][i] += metrics[i][j];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
c3.generate({
|
||||
data: {
|
||||
columns: columns,
|
||||
x: metrics[0][0]
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'timeseries',
|
||||
tick: {
|
||||
format: $("#chart").data("date-format")
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Draw task repartition chart
|
||||
function drawTaskRepartition()
|
||||
{
|
||||
var metrics = $("#chart").data("metrics");
|
||||
var columns = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
columns.push([metrics[i].column_title, metrics[i].nb_tasks]);
|
||||
}
|
||||
|
||||
c3.generate({
|
||||
data: {
|
||||
columns: columns,
|
||||
type : 'donut'
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Draw user repartition chart
|
||||
function drawUserRepartition()
|
||||
{
|
||||
var metrics = $("#chart").data("metrics");
|
||||
var columns = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
columns.push([metrics[i].user, metrics[i].nb_tasks]);
|
||||
}
|
||||
|
||||
c3.generate({
|
||||
data: {
|
||||
columns: columns,
|
||||
type : 'donut'
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Draw budget chart
|
||||
function drawBudget()
|
||||
{
|
||||
var metrics = $("#chart").data("metrics");
|
||||
var labels = $("#chart").data("labels");
|
||||
|
||||
var columns = [
|
||||
[labels["date"]],
|
||||
[labels["in"]],
|
||||
[labels["left"]],
|
||||
[labels["out"]]
|
||||
];
|
||||
|
||||
var colors = {};
|
||||
colors[labels["in"]] = '#5858FA';
|
||||
colors[labels["left"]] = '#04B404';
|
||||
colors[labels["out"]] = '#DF3A01';
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
columns[0].push(metrics[i]["date"]);
|
||||
columns[1].push(metrics[i]["in"]);
|
||||
columns[2].push(metrics[i]["left"]);
|
||||
columns[3].push(metrics[i]["out"]);
|
||||
}
|
||||
|
||||
c3.generate({
|
||||
data: {
|
||||
x: columns[0][0],
|
||||
columns: columns,
|
||||
colors: colors,
|
||||
type : 'bar'
|
||||
},
|
||||
axis: {
|
||||
x: {
|
||||
type: 'timeseries',
|
||||
tick: {
|
||||
format: $("#chart").data("date-format")
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
jQuery(document).ready(function() {
|
||||
|
||||
if (Kanboard.Exists("analytic-task-repartition")) {
|
||||
Kanboard.Analytic.TaskRepartition.Init();
|
||||
drawTaskRepartition();
|
||||
}
|
||||
else if (Kanboard.Exists("analytic-user-repartition")) {
|
||||
Kanboard.Analytic.UserRepartition.Init();
|
||||
drawUserRepartition();
|
||||
}
|
||||
else if (Kanboard.Exists("analytic-cfd")) {
|
||||
Kanboard.Analytic.CFD.Init();
|
||||
drawCfd();
|
||||
}
|
||||
else if (Kanboard.Exists("analytic-burndown")) {
|
||||
Kanboard.Analytic.Burndown.Init();
|
||||
drawBurndown();
|
||||
}
|
||||
else if (Kanboard.Exists("budget-chart")) {
|
||||
drawBudget();
|
||||
}
|
||||
});
|
||||
|
||||
return {};
|
||||
|
||||
})();
|
||||
|
||||
Kanboard.Analytic.Burndown = (function() {
|
||||
|
||||
function fetchData()
|
||||
{
|
||||
jQuery.getJSON($("#chart").attr("data-url"), function(data) {
|
||||
drawGraph(data.metrics, data.labels);
|
||||
});
|
||||
}
|
||||
|
||||
function drawGraph(metrics, labels)
|
||||
{
|
||||
var series = prepareSeries(metrics, labels);
|
||||
|
||||
var svg = dimple.newSvg("#chart", "100%", 380);
|
||||
var chart = new dimple.chart(svg, series);
|
||||
|
||||
var x = chart.addCategoryAxis("x", labels['day']);
|
||||
x.addOrderRule("Date");
|
||||
|
||||
chart.addMeasureAxis("y", labels['score']);
|
||||
chart.addSeries(null, dimple.plot.line);
|
||||
|
||||
chart.draw();
|
||||
}
|
||||
|
||||
function prepareSeries(metrics, labels)
|
||||
{
|
||||
var series = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
|
||||
var row = {};
|
||||
var score = parseInt(metrics[i]['score']);
|
||||
row[labels['day']] = metrics[i]['day'];
|
||||
row[labels['score']] = score;
|
||||
series.push(row);
|
||||
}
|
||||
|
||||
return series;
|
||||
}
|
||||
|
||||
return {
|
||||
Init: fetchData
|
||||
};
|
||||
|
||||
})();
|
||||
|
||||
Kanboard.Analytic.CFD = (function() {
|
||||
|
||||
function fetchData()
|
||||
{
|
||||
jQuery.getJSON($("#chart").attr("data-url"), function(data) {
|
||||
drawGraph(data.metrics, data.labels, data.columns);
|
||||
});
|
||||
}
|
||||
|
||||
function drawGraph(metrics, labels, columns)
|
||||
{
|
||||
var series = prepareSeries(metrics, labels);
|
||||
|
||||
var svg = dimple.newSvg("#chart", "100%", 380);
|
||||
var chart = new dimple.chart(svg, series);
|
||||
|
||||
var x = chart.addCategoryAxis("x", labels['day']);
|
||||
x.addOrderRule("Date");
|
||||
|
||||
chart.addMeasureAxis("y", labels['total']);
|
||||
|
||||
var s = chart.addSeries(labels['column'], dimple.plot.area);
|
||||
s.addOrderRule(columns.reverse());
|
||||
|
||||
chart.addLegend(10, 10, 500, 30, "left");
|
||||
chart.draw();
|
||||
}
|
||||
|
||||
function prepareSeries(metrics, labels)
|
||||
{
|
||||
var series = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
|
||||
var row = {};
|
||||
row[labels['column']] = metrics[i]['column_title'];
|
||||
row[labels['day']] = metrics[i]['day'];
|
||||
row[labels['total']] = metrics[i]['total'];
|
||||
series.push(row);
|
||||
}
|
||||
|
||||
return series;
|
||||
}
|
||||
|
||||
return {
|
||||
Init: fetchData
|
||||
};
|
||||
|
||||
})();
|
||||
|
||||
Kanboard.Analytic.TaskRepartition = (function() {
|
||||
|
||||
function fetchData()
|
||||
{
|
||||
jQuery.getJSON($("#chart").attr("data-url"), function(data) {
|
||||
drawGraph(data.metrics, data.labels);
|
||||
});
|
||||
}
|
||||
|
||||
function drawGraph(metrics, labels)
|
||||
{
|
||||
var series = prepareSeries(metrics, labels);
|
||||
|
||||
var svg = dimple.newSvg("#chart", "100%", 350);
|
||||
|
||||
var chart = new dimple.chart(svg, series);
|
||||
chart.addMeasureAxis("p", labels["nb_tasks"]);
|
||||
var ring = chart.addSeries(labels["column_title"], dimple.plot.pie);
|
||||
ring.innerRadius = "50%";
|
||||
chart.addLegend(0, 0, 100, "100%", "left");
|
||||
chart.draw();
|
||||
}
|
||||
|
||||
function prepareSeries(metrics, labels)
|
||||
{
|
||||
var series = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
|
||||
var serie = {};
|
||||
serie[labels["nb_tasks"]] = metrics[i]["nb_tasks"];
|
||||
serie[labels["column_title"]] = metrics[i]["column_title"];
|
||||
|
||||
series.push(serie);
|
||||
}
|
||||
|
||||
return series;
|
||||
}
|
||||
|
||||
return {
|
||||
Init: fetchData
|
||||
};
|
||||
|
||||
})();
|
||||
|
||||
Kanboard.Analytic.UserRepartition = (function() {
|
||||
|
||||
function fetchData()
|
||||
{
|
||||
jQuery.getJSON($("#chart").attr("data-url"), function(data) {
|
||||
drawGraph(data.metrics, data.labels);
|
||||
});
|
||||
}
|
||||
|
||||
function drawGraph(metrics, labels)
|
||||
{
|
||||
var series = prepareSeries(metrics, labels);
|
||||
|
||||
var svg = dimple.newSvg("#chart", "100%", 350);
|
||||
|
||||
var chart = new dimple.chart(svg, series);
|
||||
chart.addMeasureAxis("p", labels["nb_tasks"]);
|
||||
var ring = chart.addSeries(labels["user"], dimple.plot.pie);
|
||||
ring.innerRadius = "50%";
|
||||
chart.addLegend(0, 0, 100, "100%", "left");
|
||||
chart.draw();
|
||||
}
|
||||
|
||||
function prepareSeries(metrics, labels)
|
||||
{
|
||||
var series = [];
|
||||
|
||||
for (var i = 0; i < metrics.length; i++) {
|
||||
|
||||
var serie = {};
|
||||
serie[labels["nb_tasks"]] = metrics[i]["nb_tasks"];
|
||||
serie[labels["user"]] = metrics[i]["user"];
|
||||
|
||||
series.push(serie);
|
||||
}
|
||||
|
||||
return series;
|
||||
}
|
||||
|
||||
return {
|
||||
Init: fetchData
|
||||
};
|
||||
|
||||
})();
|
||||
|
|
|
|||
|
|
@ -1,38 +0,0 @@
|
|||
Kanboard.Budget = (function() {
|
||||
|
||||
jQuery(document).ready(function() {
|
||||
|
||||
if (Kanboard.Exists("budget-chart")) {
|
||||
|
||||
var labels =$("#chart").data("labels");
|
||||
var serie = $("#chart").data("serie");
|
||||
var types = ["in", "out", "left"];
|
||||
var data = [];
|
||||
|
||||
for (var i = 0; i < serie.length; i++) {
|
||||
|
||||
for (var j = 0; j < types.length; j++) {
|
||||
var row = {};
|
||||
row[labels["date"]] = serie[i]["date"];
|
||||
row[labels["value"]] = serie[i][types[j]];
|
||||
row[labels["type"]] = labels[types[j]];
|
||||
|
||||
data.push(row);
|
||||
}
|
||||
}
|
||||
|
||||
var svg = dimple.newSvg("#chart", 750, 600);
|
||||
var myChart = new dimple.chart(svg, data);
|
||||
|
||||
var x = myChart.addCategoryAxis("x", [labels["date"], labels["type"]]);
|
||||
x.addOrderRule(labels["date"]);
|
||||
|
||||
myChart.addMeasureAxis("y", labels["value"]);
|
||||
|
||||
myChart.addSeries(labels["type"], dimple.plot.bar);
|
||||
myChart.addLegend(65, 10, 510, 20, "right");
|
||||
myChart.draw();
|
||||
}
|
||||
});
|
||||
|
||||
})();
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -2,9 +2,9 @@
|
|||
|
||||
print_css="print links table board task comment subtask markdown"
|
||||
app_css="base links title table form button alert tooltip header board task comment subtask markdown listing activity dashboard pagination popover confirm sidebar responsive dropdown"
|
||||
vendor_css="jquery-ui.min chosen.min fullcalendar.min font-awesome.min"
|
||||
vendor_css="jquery-ui.min chosen.min fullcalendar.min font-awesome.min c3.min"
|
||||
|
||||
app_js="base board calendar analytic swimlane dashboard budget screenshot"
|
||||
app_js="base board calendar analytic swimlane dashboard screenshot"
|
||||
vendor_js="jquery-1.11.1.min jquery-ui.min jquery.ui.touch-punch.min chosen.jquery.min dropit.min moment.min fullcalendar.min mousetrap.min mousetrap-global-bind.min app.min"
|
||||
lang_js="da de es fi fr hu it ja nl pl pt-br ru sv sr th tr zh-cn"
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue