#14; Prototype (iface+module) du graphique des classes d'ages
This commit is contained in:
parent
912bb8933f
commit
ee3d18261a
|
@ -94,7 +94,7 @@
|
||||||
$db = new lightdb('phone_db', __ROOT__.'/src/dynamic/');
|
$db = new lightdb('phone_db', __ROOT__.'/src/dynamic/');
|
||||||
var_dump( array_keys($db->index()));
|
var_dump( array_keys($db->index()));
|
||||||
$db->close();
|
$db->close();
|
||||||
$req = new ModuleRequest('chart/sexe', array( 'subject' => 273 ));
|
$req = new ModuleRequest('chart/direction', array( 'subject' => 273 ));
|
||||||
|
|
||||||
$res = $req->dispatch();
|
$res = $req->dispatch();
|
||||||
|
|
||||||
|
|
|
@ -128,6 +128,14 @@
|
||||||
"parameters": {
|
"parameters": {
|
||||||
"subject": { "description": "Identifiant du sujet à étudier,", "type": "id" }
|
"subject": { "description": "Identifiant du sujet à étudier,", "type": "id" }
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
"ages": {
|
||||||
|
"description": "Renvoie les données pour un graphique sur les ages des contacts",
|
||||||
|
"permissions": ["admin"],
|
||||||
|
"parameters": {
|
||||||
|
"subject": { "description": "Identifiant du sujet à étudier,", "type": "id" }
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
namespace manager\module;
|
namespace manager\module;
|
||||||
use \manager\sessionManager;
|
use \manager\sessionManager;
|
||||||
use \manager\ManagerError;
|
use \manager\ManagerError;
|
||||||
|
use \manager\ResourceDispatcher;
|
||||||
use \manager\lightdb;
|
use \manager\lightdb;
|
||||||
|
|
||||||
|
|
||||||
|
@ -11,6 +12,56 @@
|
||||||
class chart{
|
class chart{
|
||||||
|
|
||||||
|
|
||||||
|
/* CHARGE LE CONTENU DU DICTIONNAIRE
|
||||||
|
*
|
||||||
|
* @return dictionary<Array> Contenu du dictionnaire, ou FALSE si erreur
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
private static function loadDictionary(){
|
||||||
|
$dict = ResourceDispatcher::getResource('f/json/dictionary/dy/phone');
|
||||||
|
|
||||||
|
$dict = json_decode( $dict, true );
|
||||||
|
|
||||||
|
// Si erreur, on retourne false
|
||||||
|
if( is_null($dict) )
|
||||||
|
return false;
|
||||||
|
|
||||||
|
return $dict;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* MODIFIE LES COULEURS DONNEES
|
||||||
|
*
|
||||||
|
* @colors<Array> Tableau de couleurs au format hsl
|
||||||
|
* @tint<int> Valeur a ajouter à tint
|
||||||
|
* @constract<int> Valeur a ajouter à constract
|
||||||
|
* @lightness<int> Valeur a ajouter à lightness
|
||||||
|
*
|
||||||
|
* @return darken<Array> Copie du tableau d'entrée, mais en plus foncé
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
private static function cFilter($colors, $tint=0, $contrast=0, $lightness=0){
|
||||||
|
$darken = $colors;
|
||||||
|
|
||||||
|
/* [1] Pour chaque couleur
|
||||||
|
=========================================================*/
|
||||||
|
foreach($colors as $i=>$color){
|
||||||
|
|
||||||
|
/* (1) On vérifie que c'est bien au format hsl(tint, saturation%, lightness%) */
|
||||||
|
if( !preg_match('/^hsl\((\d+) ?, ?(\d+)% ?, ?(\d+)%\)$/i', $color, $matches) )
|
||||||
|
continue;
|
||||||
|
|
||||||
|
$newTint = intval($matches[1]) + $tint;
|
||||||
|
$newContrast = intval($matches[2]) + $contrast;
|
||||||
|
$newLightness = intval($matches[3]) + $lightness;
|
||||||
|
|
||||||
|
$darken[$i] = "hsl($newTint,$newContrast%, $newLightness%)";
|
||||||
|
}
|
||||||
|
|
||||||
|
return $darken;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/* RETOURNE UN JEU DE DONNEES POUR LE SENS DE COMMUNICATION (MANQUE/ENTRANT/SORTANT)
|
/* RETOURNE UN JEU DE DONNEES POUR LE SENS DE COMMUNICATION (MANQUE/ENTRANT/SORTANT)
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
@ -31,44 +82,47 @@
|
||||||
return array( 'ModuleError' => ManagerError::ModuleError );
|
return array( 'ModuleError' => ManagerError::ModuleError );
|
||||||
|
|
||||||
|
|
||||||
/* [2] S'il a un journal d'appel, on renvoie les données
|
/* [2] On initialise les compteurs
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
if( isset($data['logs']) && is_array($data['logs']) ){
|
$labels = array('ENTRANT', 'SORTANT', 'MANQUÉ');
|
||||||
|
|
||||||
/* (1) On initialise les compteurs */
|
|
||||||
$MISSED = 0;
|
$MISSED = 0;
|
||||||
$OUTGOING = 0;
|
$OUTGOING = 0;
|
||||||
$INCOMING = 0;
|
$INCOMING = 0;
|
||||||
|
|
||||||
/* (2) On incrémente les compteurs */
|
/* [3] S'il a un journal d'appel, on renvoie les données
|
||||||
|
=========================================================*/
|
||||||
|
if( isset($data['logs']) && is_array($data['logs']) ){
|
||||||
|
|
||||||
|
/* (1) On incrémente les compteurs */
|
||||||
foreach($data['logs'] as $log){
|
foreach($data['logs'] as $log){
|
||||||
|
|
||||||
/* (3) Si ce n'est pas un appel, on passe au suivant */
|
/* (2) Si ce n'est pas un appel, on passe au suivant */
|
||||||
if( $log['type'] != 0 )
|
if( $log['type'] != 0 )
|
||||||
continue;
|
continue;
|
||||||
|
|
||||||
/* (4) On incrémente les types */
|
/* (3) On incrémente les types */
|
||||||
$MISSED += ($log['direction']==2) ? 1 : 0;
|
$MISSED += ($log['direction']==2) ? 1 : 0;
|
||||||
$OUTGOING += ($log['direction']==1) ? 1 : 0;
|
$OUTGOING += ($log['direction']==1) ? 1 : 0;
|
||||||
$INCOMING += ($log['direction']==0) ? 1 : 0;
|
$INCOMING += ($log['direction']==0) ? 1 : 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* [3] Si aucun journal d'appel
|
|
||||||
=========================================================*/
|
|
||||||
}else{
|
|
||||||
|
|
||||||
/* (1) On initialise les compteurs */
|
|
||||||
$MISSED = 0;
|
|
||||||
$OUTGOING = 0;
|
|
||||||
$INCOMING = 0;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* [4] Gestion des couleurs
|
||||||
|
=========================================================*/
|
||||||
|
$colors = array();
|
||||||
|
|
||||||
|
$colors['default'] = array( 'hsl(347,100%,69%)', 'hsl(204,82%,57%)', 'hsl(43,100%,67%)' );
|
||||||
|
$colors['hover'] = self::cFilter($colors['default'], 0, 0, -2);
|
||||||
|
|
||||||
|
|
||||||
return array(
|
return array(
|
||||||
'ModuleError' => ManagerError::Success,
|
'ModuleError' => ManagerError::Success,
|
||||||
'labels' => array('ENTRANT', 'SORTANT', 'MANQUÉ'),
|
'labels' => $labels,
|
||||||
|
'colors' => $colors,
|
||||||
'data' => array($INCOMING, $OUTGOING, $MISSED)
|
'data' => array($INCOMING, $OUTGOING, $MISSED)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -97,36 +151,39 @@
|
||||||
return array( 'ModuleError' => ManagerError::ModuleError );
|
return array( 'ModuleError' => ManagerError::ModuleError );
|
||||||
|
|
||||||
|
|
||||||
|
/* [2] On initialise les compteurs
|
||||||
|
=========================================================*/
|
||||||
|
$PHONE = 0;
|
||||||
|
$SMS = 0;
|
||||||
|
|
||||||
|
|
||||||
/* [2] S'il a un journal d'appel, on renvoie les données
|
/* [2] S'il a un journal d'appel, on renvoie les données
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
if( isset($data['logs']) && is_array($data['logs']) ){
|
if( isset($data['logs']) && is_array($data['logs']) ){
|
||||||
|
|
||||||
/* (1) On initialise les compteurs */
|
/* (1) On incrémente les compteurs */
|
||||||
$PHONE = 0;
|
|
||||||
$SMS = 0;
|
|
||||||
|
|
||||||
/* (2) On incrémente les compteurs */
|
|
||||||
foreach($data['logs'] as $log){
|
foreach($data['logs'] as $log){
|
||||||
|
|
||||||
/* (3) On incrémente les compteurs */
|
/* (2) On incrémente les compteurs */
|
||||||
$PHONE += ($log['type']==0) ? 1 : 0;
|
$PHONE += ($log['type']==0) ? 1 : 0;
|
||||||
$SMS += ($log['type']==1) ? 1 : 0;
|
$SMS += ($log['type']==1) ? 1 : 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* [3] Si aucun journal d'appel
|
|
||||||
=========================================================*/
|
|
||||||
}else{
|
|
||||||
|
|
||||||
/* (1) On initialise les compteurs */
|
|
||||||
$H = 0;
|
|
||||||
$F = 0;
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* [4] Gestion des couleurs
|
||||||
|
=========================================================*/
|
||||||
|
$colors = array();
|
||||||
|
|
||||||
|
$colors['default'] = array( 'hsl(347,100%,69%)', 'hsl(204,82%,57%)' );
|
||||||
|
$colors['hover'] = self::cFilter($colors['default'], 0, 0, -2);
|
||||||
|
|
||||||
|
|
||||||
return array(
|
return array(
|
||||||
'ModuleError' => ManagerError::Success,
|
'ModuleError' => ManagerError::Success,
|
||||||
|
'colors' => $colors,
|
||||||
'labels' => array('APPELS', 'SMS'),
|
'labels' => array('APPELS', 'SMS'),
|
||||||
'data' => array($PHONE, $SMS)
|
'data' => array($PHONE, $SMS)
|
||||||
);
|
);
|
||||||
|
@ -135,7 +192,7 @@
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* RETOURNE UN JEU DE DONNEES POUR LE SEXE DES CONTACTS
|
/* RETOURNE UN JEU DE DONNEES POUR LE SEXE DES COMMUNICATIONS (HOMME/FEMME)
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
public static function sexe($params){
|
public static function sexe($params){
|
||||||
|
@ -154,14 +211,99 @@
|
||||||
if( $data === false )
|
if( $data === false )
|
||||||
return array( 'ModuleError' => ManagerError::ModuleError );
|
return array( 'ModuleError' => ManagerError::ModuleError );
|
||||||
|
|
||||||
|
/* [2] On initialise les compteurs
|
||||||
|
=========================================================*/
|
||||||
|
$H = 0;
|
||||||
|
$F = 0;
|
||||||
|
|
||||||
/* [2] S'il a un journal d'appel, on renvoie les données
|
/* [3] S'il a un journal d'appel, on renvoie les données
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
if( isset($data['logs']) && is_array($data['logs']) ){
|
if( isset($data['logs']) && is_array($data['logs']) ){
|
||||||
|
|
||||||
|
/* (1) On incrémente les compteurs */
|
||||||
|
foreach($data['logs'] as $log){
|
||||||
|
|
||||||
|
/* (2) On récupère le contact associé */
|
||||||
|
$associatedContact = null;
|
||||||
|
foreach($data['contacts'] as $contact)
|
||||||
|
if( $log['id'] == $contact['id'] )
|
||||||
|
$associatedContact = $contact;
|
||||||
|
|
||||||
|
// Si on ne trouve pas, on passe au suivant
|
||||||
|
if( is_null($associatedContact) )
|
||||||
|
continue;
|
||||||
|
|
||||||
|
/* (3) On incrémente les compteurs */
|
||||||
|
$H += ($associatedContact['sexe']==0) ? 1 : 0;
|
||||||
|
$F += ($associatedContact['sexe']==1) ? 1 : 0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* [4] Gestion des couleurs
|
||||||
|
=========================================================*/
|
||||||
|
$colors = array();
|
||||||
|
|
||||||
|
$colors['default'] = array( 'hsl(347,100%,69%)', 'hsl(204,82%,57%)' );
|
||||||
|
$colors['hover'] = self::cFilter($colors['default'], 0, 0, -2);
|
||||||
|
|
||||||
|
|
||||||
|
return array(
|
||||||
|
'ModuleError' => ManagerError::Success,
|
||||||
|
'colors' => $colors,
|
||||||
|
'labels' => array('HOMME', 'FEMME'),
|
||||||
|
'data' => array($H, $F)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* RETOURNE UN JEU DE DONNEES POUR LES AGES DES COMMUNICATIONS
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
public static function ages($params){
|
||||||
|
extract($params);
|
||||||
|
|
||||||
|
$subject = intval($subject);
|
||||||
|
|
||||||
|
|
||||||
|
/* [1] On récupère les données de ce sujet
|
||||||
|
=========================================================*/
|
||||||
|
$db = new lightdb('phone_db', __ROOT__.'/src/dynamic/');
|
||||||
|
$data = $db->fetch($subject);
|
||||||
|
$db->close();
|
||||||
|
|
||||||
|
// Si erreur
|
||||||
|
if( $data === false )
|
||||||
|
return array( 'ModuleError' => ManagerError::ModuleError );
|
||||||
|
|
||||||
|
|
||||||
|
/* [2] On initialise les valeurs
|
||||||
|
=========================================================*/
|
||||||
/* (1) On initialise les compteurs */
|
/* (1) On initialise les compteurs */
|
||||||
$H = 0;
|
$age_classes = array();
|
||||||
$F = 0;
|
for( $i = 0 ; $i < 18 ; $i++ )
|
||||||
|
$age_classes[$i] = 0;
|
||||||
|
|
||||||
|
/* (2) On charge le dictionnaire */
|
||||||
|
$dict = self::loadDictionary();
|
||||||
|
if( $dict === false )
|
||||||
|
return array( 'ModuleError' => ManagerError::ParsingFailed );
|
||||||
|
|
||||||
|
/* (2) On initialise les labels */
|
||||||
|
$labels = array();
|
||||||
|
foreach($dict['contacts']['age'] as $i=>$label)
|
||||||
|
array_push($labels, $label);
|
||||||
|
|
||||||
|
|
||||||
|
/* [3] S'il a un journal d'appel, on renvoie les données
|
||||||
|
=========================================================*/
|
||||||
|
if( isset($data['logs']) && is_array($data['logs']) ){
|
||||||
|
|
||||||
|
|
||||||
/* (2) On incrémente les compteurs */
|
/* (2) On incrémente les compteurs */
|
||||||
foreach($data['logs'] as $log){
|
foreach($data['logs'] as $log){
|
||||||
|
@ -176,29 +318,38 @@
|
||||||
if( is_null($associatedContact) )
|
if( is_null($associatedContact) )
|
||||||
continue;
|
continue;
|
||||||
|
|
||||||
/* (4) On incrémente les compteurs */
|
/* (4) On incrémente le compteur de la classe d'age en question */
|
||||||
$H += ($associatedContact['sexe']==0) ? 1 : 0;
|
if( isset($age_classes[ $associatedContact['age'] ]) )
|
||||||
$F += ($associatedContact['sexe']==1) ? 1 : 0;
|
$age_classes[ $associatedContact['age'] ]++;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* [3] Si aucun journal d'appel
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* [4] Gestion des couleurs
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
}else{
|
$colors = array();
|
||||||
|
|
||||||
/* (1) On initialise les compteurs */
|
$colors['default'] = array();
|
||||||
$H = 0;
|
|
||||||
$F = 0;
|
|
||||||
|
|
||||||
}/* (1) On initialise les compteurs */
|
$step = (int) (50/count($age_classes));
|
||||||
|
|
||||||
|
// Pour chaque classe, on ajoute une couleur
|
||||||
|
for( $i = 0 ; $i < count($age_classes) ; $i++ )
|
||||||
|
array_push($colors['default'], 'hsl(216,100%,'.(25+(50-$step*$i)).'%)');
|
||||||
|
|
||||||
|
$colors['hover'] = self::cFilter($colors['default'], 0, 0, -2);
|
||||||
|
|
||||||
|
|
||||||
return array(
|
return array(
|
||||||
'ModuleError' => ManagerError::Success,
|
'ModuleError' => ManagerError::Success,
|
||||||
'labels' => array('HOMME', 'FEMME'),
|
'colors' => $colors,
|
||||||
'data' => array($H, $F)
|
'labels' => $labels,
|
||||||
|
'data' => $age_classes
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -15,7 +15,6 @@
|
||||||
"contacts": {
|
"contacts": {
|
||||||
"sexe": { "0":"Homme", "1":"Femme" },
|
"sexe": { "0":"Homme", "1":"Femme" },
|
||||||
"age": {
|
"age": {
|
||||||
".": "NA",
|
|
||||||
"0": "5 à 10", "1": "10 à 15", "2": "15 à 20", "3": "20 à 25", "4": "25 à 30",
|
"0": "5 à 10", "1": "10 à 15", "2": "15 à 20", "3": "20 à 25", "4": "25 à 30",
|
||||||
"5": "30 à 35", "6": "35 à 40", "7": "40 à 45", "8": "45 à 50", "9": "50 à 55",
|
"5": "30 à 35", "6": "35 à 40", "7": "40 à 45", "8": "45 à 50", "9": "50 à 55",
|
||||||
"10": "55 à 60", "11": "60 à 65", "12": "65 à 70", "13": "70 à 75", "14": "75 à 80",
|
"10": "55 à 60", "11": "60 à 65", "12": "65 à 70", "13": "70 à 75", "14": "75 à 80",
|
||||||
|
|
|
@ -11,6 +11,7 @@
|
||||||
<canvas id="direction" width="400" height="400"></canvas>
|
<canvas id="direction" width="400" height="400"></canvas>
|
||||||
<canvas id="type" width="400" height="400"></canvas>
|
<canvas id="type" width="400" height="400"></canvas>
|
||||||
<canvas id="sexe" width="400" height="400"></canvas>
|
<canvas id="sexe" width="400" height="400"></canvas>
|
||||||
|
<canvas id="age" width="400" height="400"></canvas>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -25,13 +26,15 @@
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
Chart.defaults.global.responsive = false;
|
Chart.defaults.global.responsive = false;
|
||||||
|
|
||||||
|
subject = 273;
|
||||||
|
|
||||||
|
|
||||||
/* [1] On récupére les données SEXE
|
/* [1] On récupére les données SEXE
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
/* (1) On rédige la requête */
|
/* (1) On rédige la requête */
|
||||||
var request = {
|
var request = {
|
||||||
path: 'chart/sexe',
|
path: 'chart/sexe',
|
||||||
subject: 273
|
subject: subject
|
||||||
}
|
}
|
||||||
|
|
||||||
/* (2) On lance la requête */
|
/* (2) On lance la requête */
|
||||||
|
@ -46,8 +49,8 @@
|
||||||
labels: response.labels,
|
labels: response.labels,
|
||||||
datasets: [{
|
datasets: [{
|
||||||
data: response.data,
|
data: response.data,
|
||||||
backgroundColor: [ "#FF6384", "#36A2EB" ],
|
backgroundColor: response.colors.default,
|
||||||
hoverBackgroundColor: [ "#E65977", "#3090D1" ]
|
hoverBackgroundColor: response.colors.hover
|
||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -67,7 +70,7 @@
|
||||||
/* (1) On rédige la requête */
|
/* (1) On rédige la requête */
|
||||||
var request = {
|
var request = {
|
||||||
path: 'chart/direction',
|
path: 'chart/direction',
|
||||||
subject: 273
|
subject: subject
|
||||||
}
|
}
|
||||||
|
|
||||||
/* (2) On lance la requête */
|
/* (2) On lance la requête */
|
||||||
|
@ -82,8 +85,8 @@
|
||||||
labels: response.labels,
|
labels: response.labels,
|
||||||
datasets: [{
|
datasets: [{
|
||||||
data: response.data,
|
data: response.data,
|
||||||
backgroundColor: [ "#FF6384", "#36A2EB", "#FFCE56" ],
|
backgroundColor: response.colors.default,
|
||||||
hoverBackgroundColor: [ "#E65977", "#3090D1", "#E6B94D" ]
|
hoverBackgroundColor: response.colors.hover
|
||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -98,12 +101,12 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
/* [1] On récupére les données TYPE
|
/* [3] On récupére les données TYPE
|
||||||
=========================================================*/
|
=========================================================*/
|
||||||
/* (1) On rédige la requête */
|
/* (1) On rédige la requête */
|
||||||
var request = {
|
var request = {
|
||||||
path: 'chart/type',
|
path: 'chart/type',
|
||||||
subject: 273
|
subject: subject
|
||||||
}
|
}
|
||||||
|
|
||||||
/* (2) On lance la requête */
|
/* (2) On lance la requête */
|
||||||
|
@ -118,8 +121,8 @@
|
||||||
labels: response.labels,
|
labels: response.labels,
|
||||||
datasets: [{
|
datasets: [{
|
||||||
data: response.data,
|
data: response.data,
|
||||||
backgroundColor: [ "#FF6384", "#36A2EB" ],
|
backgroundColor: response.colors.default,
|
||||||
hoverBackgroundColor: [ "#E65977", "#3090D1" ]
|
hoverBackgroundColor: response.colors.hover
|
||||||
}]
|
}]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -132,6 +135,47 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* [4] On récupére les données AGES
|
||||||
|
=========================================================*/
|
||||||
|
/* (1) On rédige la requête */
|
||||||
|
var request = {
|
||||||
|
path: 'chart/ages',
|
||||||
|
subject: subject
|
||||||
|
}
|
||||||
|
|
||||||
|
/* (2) On lance la requête */
|
||||||
|
api.send(request, function(response){
|
||||||
|
/* (3) Si erreur, on quitte */
|
||||||
|
if( response.ModuleError != 0 )
|
||||||
|
return false;
|
||||||
|
|
||||||
|
/* [2] On construit les données
|
||||||
|
=========================================================*/
|
||||||
|
var data = {
|
||||||
|
labels: response.labels,
|
||||||
|
datasets: [{
|
||||||
|
data: response.data,
|
||||||
|
backgroundColor: response.colors.default,
|
||||||
|
hoverBackgroundColor: response.colors.hover
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
/* [3] On construit notre graphique
|
||||||
|
=========================================================*/
|
||||||
|
var myDoughnutChart = new Chart(age, {
|
||||||
|
type: 'doughnut',
|
||||||
|
animation: { animateScale: true },
|
||||||
|
data: data
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -1,57 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<title>Chart sens de communication (MANQUE/ENTRANT/SORTANT)</title>
|
|
||||||
<script type='text/javascript' src='/f/js/api-min/js/lib'></script> <!-- Gestion des transactions avec le serveur -->
|
|
||||||
<script type='text/javascript' src='/f/js/_charts-min/js/lib'></script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<canvas id="container" width="400" height="400"></canvas>
|
|
||||||
|
|
||||||
|
|
||||||
<script type='text/javascript'>
|
|
||||||
var api = new APIClass('/api/');
|
|
||||||
var ctx = document.getElementById('container').getContext('2d');
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* [1] On récupére les données
|
|
||||||
=========================================================*/
|
|
||||||
/* (1) On rédige la requête */
|
|
||||||
var request = {
|
|
||||||
path: 'chart/direction',
|
|
||||||
subject: 273
|
|
||||||
}
|
|
||||||
|
|
||||||
/* (2) On lance la requête */
|
|
||||||
api.send(request, function(response){
|
|
||||||
/* (3) Si erreur, on quitte */
|
|
||||||
if( response.ModuleError != 0 )
|
|
||||||
return false;
|
|
||||||
|
|
||||||
/* [2] On construit les données
|
|
||||||
=========================================================*/
|
|
||||||
var data = {
|
|
||||||
labels: response.labels,
|
|
||||||
datasets: [{
|
|
||||||
data: response.data,
|
|
||||||
backgroundColor: [ "#FF6384", "#36A2EB", "#FFCE56" ],
|
|
||||||
hoverBackgroundColor: [ "#E65977", "#3090D1", "#E6B94D" ]
|
|
||||||
}]
|
|
||||||
}
|
|
||||||
|
|
||||||
/* [3] On construit notre graphique
|
|
||||||
=========================================================*/
|
|
||||||
var myDoughnutChart = new Chart(ctx, {
|
|
||||||
type: 'doughnut',
|
|
||||||
animation: { animateScale: true },
|
|
||||||
data: data
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,57 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<title>Chart du sexe (HOMME/FEMME)</title>
|
|
||||||
<script type='text/javascript' src='/f/js/api-min/js/lib'></script> <!-- Gestion des transactions avec le serveur -->
|
|
||||||
<script type='text/javascript' src='/f/js/_charts-min/js/lib'></script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<canvas id="container" width="400" height="400"></canvas>
|
|
||||||
|
|
||||||
|
|
||||||
<script type='text/javascript'>
|
|
||||||
var api = new APIClass('/api/');
|
|
||||||
var ctx = document.getElementById('container').getContext('2d');
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* [1] On récupére les données
|
|
||||||
=========================================================*/
|
|
||||||
/* (1) On rédige la requête */
|
|
||||||
var request = {
|
|
||||||
path: 'chart/sexe',
|
|
||||||
subject: 273
|
|
||||||
}
|
|
||||||
|
|
||||||
/* (2) On lance la requête */
|
|
||||||
api.send(request, function(response){
|
|
||||||
/* (3) Si erreur, on quitte */
|
|
||||||
if( response.ModuleError != 0 )
|
|
||||||
return false;
|
|
||||||
|
|
||||||
/* [2] On construit les données
|
|
||||||
=========================================================*/
|
|
||||||
var data = {
|
|
||||||
labels: response.labels,
|
|
||||||
datasets: [{
|
|
||||||
data: response.data,
|
|
||||||
backgroundColor: [ "#FF6384", "#36A2EB" ],
|
|
||||||
hoverBackgroundColor: [ "#E65977", "#3090D1" ]
|
|
||||||
}]
|
|
||||||
}
|
|
||||||
|
|
||||||
/* [3] On construit notre graphique
|
|
||||||
=========================================================*/
|
|
||||||
var myDoughnutChart = new Chart(ctx, {
|
|
||||||
type: 'doughnut',
|
|
||||||
animation: { animateScale: true },
|
|
||||||
data: data
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
|
@ -1,57 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<title>Chart type de communication (APPEL/SMS)</title>
|
|
||||||
<script type='text/javascript' src='/f/js/api-min/js/lib'></script> <!-- Gestion des transactions avec le serveur -->
|
|
||||||
<script type='text/javascript' src='/f/js/_charts-min/js/lib'></script>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<canvas id="container" width="400" height="400"></canvas>
|
|
||||||
|
|
||||||
|
|
||||||
<script type='text/javascript'>
|
|
||||||
var api = new APIClass('/api/');
|
|
||||||
var ctx = document.getElementById('container').getContext('2d');
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* [1] On récupére les données
|
|
||||||
=========================================================*/
|
|
||||||
/* (1) On rédige la requête */
|
|
||||||
var request = {
|
|
||||||
path: 'chart/type',
|
|
||||||
subject: 273
|
|
||||||
}
|
|
||||||
|
|
||||||
/* (2) On lance la requête */
|
|
||||||
api.send(request, function(response){
|
|
||||||
/* (3) Si erreur, on quitte */
|
|
||||||
if( response.ModuleError != 0 )
|
|
||||||
return false;
|
|
||||||
|
|
||||||
/* [2] On construit les données
|
|
||||||
=========================================================*/
|
|
||||||
var data = {
|
|
||||||
labels: response.labels,
|
|
||||||
datasets: [{
|
|
||||||
data: response.data,
|
|
||||||
backgroundColor: [ "#FF6384", "#36A2EB" ],
|
|
||||||
hoverBackgroundColor: [ "#E65977", "#3090D1" ]
|
|
||||||
}]
|
|
||||||
}
|
|
||||||
|
|
||||||
/* [3] On construit notre graphique
|
|
||||||
=========================================================*/
|
|
||||||
var myDoughnutChart = new Chart(ctx, {
|
|
||||||
type: 'doughnut',
|
|
||||||
animation: { animateScale: true },
|
|
||||||
data: data
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
Loading…
Reference in New Issue