Travaillant sur un gros projet pour l’un de nos client depuis le mois de décembre, il m’a été demandé, pendant le développement de trouver le moyen de représenter visuellement un parcours de formation. Mon client possédait déjà un prototype mais il n’était pas très parlant. Il avait également vu plusieurs types de graphiques qui l’intéressaient, dont ceux en réseau. Et c’est comme ça que j’ai essayé d’en réaliser un avec Tableau !
Source : *Tips&Viz*: Network Chart
Notre data analyst, expert et Zen Master Tableau, Jonathan Trajkovic explique dans son dernier article comment réaliser un graphe réseau dans Tableau.
Premier essai
Il a d’abord essayé de construire un dataset dans Excel basé sur un export MySQL. Essai réussi, certes, mais toutefois problématique car il fallait rafraîchir le fichier à chaque fois qu’une formation était ajoutée à la base. Néanmoins, il a ajouté une image de fond pour obtenir des lignes – parce qu’il était question que cette analyse soit un one shot. « Notez que j’ai construit ce premier graphique à partir d’une base de développement », précise Jonathan dans son article, « l’intégration n’était pas terminée ni validée par les utilisateurs quand j’ai commencé à travailler sur ce dashboard ».
Bien que très content d’être parvenu à construire un graphique relationnel, Jonathan était tout de même inquiet au sujet de la maintenance…voire pessimiste ! En effet, pour un Zen Master, expert sur Tableau, il aurait été facile de mettre à jour le workbook et le dashboard mais pour le client, rien n’était moins sûr…notamment faute de temps à y consacrer. Alors, une fois rentré chez lui, Jonathan a réfléchit à une autre solution pour construire un graphe réseau. « J’ai remonté mes manches et je me suis lancé dans du bon vieux SQL ! », annonce Jonathan.
Construire un dataset convenable
Jonathan a donc écrit une requête qui lui permet de créer des lignes. Les formations étaient classées de manière très particulière et hiérarchisées : le premier package est le « père » des deux autres. Il a donc essayé de structurer sa requête pour faire apparaître cette hiérarchie dans les lignes. Il a donc utilisé un UNION (pas directement dans Tableau, car il travaillait depuis une version 9.0) pour créer des liens entre les différents packs de formation, tout comme l’expliquait Joshua Milligan du blog VizPainter dans l’un de ses articles.
select
'reseau' as `type`,
null AS `ID`,
tt.code AS `CODE_FORMATION`,
null AS `DATE_OBTENTION`,
null AS `duree_formation`,
null AS `code (network_dim)`,
tt.categorie AS `categorie`,
tt.line as `line`,
tt.orderpoint as `orderpoint`
from (
select
t.categorie,
t.code,
t.line,
t.orderpoint as orderpoint
from (
select
c1.categorie,
trim(c1.code) as code,
concat(c1.categorie,"-",c1.code) as line,
2 as orderpoint
from network_dim c1
union all
select
c2.categorie,
null as code,
concat(c2.categorie,"-",c2.code) as line,
1 as orderpoint
from network_dim c2
union all
select distinct
c4.categorie,
null as code,
if(c4.categorie='A',concat(c4.categorie,"-",c3.categorie),
if(c3.categorie=c4.categorie,concat('A',"-",c3.categorie),null)
) as line,
if(c4.categorie='A',1,2) as orderpoint
from network_dim c3
join (select cc.categorie from network_dim cc) c4
where if(c4.categorie='A',concat(c4.categorie,"-",c3.categorie),
if(c3.categorie=c4.categorie,concat('A',"-",c3.categorie),null)
) is not null
and if(c4.categorie='A',concat(c4.categorie,"-",c3.categorie),
if(c3.categorie=c4.categorie,concat('A',"-",c3.categorie),null)
)!='A-A'
) t
order by t.categorie, t.code) tt
Cette requête crée aussi un [orderpoint] (numéro de point) et une dimension [line] (ligne) qui sont essentiels pour construire les lignes.
Avec cette requête, Jonathan n’était cependant pas encore pleinement satisfait car des variables restaient codées en dur… mais il a continué à réfléchir à une solution plus dynamique ! En tout cas, les données pouvaient être rafraîchies pour avoir des informations à propos des employés et sur leur parcours de formation. Pour avoir d’autres informations sur les employés, un second UNION a également été ajouté à la requête afin d’obtenir toutes les informations à leur sujet : nom, âge, poste, date de diplôme…
Et maintenant passons au graphique !
Une fois le dataset créé, il restait encore la partie la plus importante du travail : construire le graphique ! Et une fois encore, Jonathan a fait appel à la trigonométrie ! « Oui, ça a été difficile… cette fois encore », reconnait Jonathan, « mais j’ai été tellement content quand j’ai vu apparaître mon graphique ! »
Pour que le rendu soit correct, deux champs calculés ont été créés dans Tableau. Ces deux champs (X et Y) donnent les coordonnées pour chaque formation et catégorie.
if isnull([categorie])=false and isnull([Corr])=true then
case [categorie]
when 'A1' then 2
when 'A' then 0
when 'A2' then -2
end
else
case [categorie]
when 'A' then
case [Corr]
when 'Notions de base' then cos(pi()/([nb_formation_cat]-1))
when 'Construire un graphique' then cos(2*pi()/([nb_formation_cat]-1))
when 'Tableau de bord' then cos(3*pi()/([nb_formation_cat]-1))
when 'Source de données' then cos(4*pi()/([nb_formation_cat]-1))
when 'Actions' then cos(0)
end
when 'A1' then
case [Corr]
when 'LoD Calcul' then cos(0+pi()/4)+2
when 'Trucs et astuces' then cos(2*pi()/([nb_formation_cat]-1)+pi()/4)+2
when 'Géocodage' then cos(3*pi()/([nb_formation_cat]-1)+pi()/4)+2
end
when 'A2' then
case trim([Corr])
when 'Administration' then cos(6*2*pi()/([nb_formation_cat]+1)+pi()/4)-2
when 'Web Authoring' then cos(2*pi()/([nb_formation_cat]+1)+pi()/4)-2
when 'Monitoring' then cos(2*2*pi()/([nb_formation_cat]+1)+pi()/4)-2
when 'Autorisations' then cos(3*2*pi()/([nb_formation_cat]+1)+pi()/4)-2
when 'Conffiguration' then cos(4*2*pi()/([nb_formation_cat]+1)+pi()/4)-2
when 'Installation' then cos(5*2*pi()/([nb_formation_cat]+1)+pi()/4)-2
end
end
end
Chaque champs calcule les coordonnées avec des formules trigonométriques.
Plus précisément, [Corr] correspond à « training-code » dans le dataset. Donc le calcul (ici, le champs X) a deux parties : la première teste une categorie avec une fonction case et en donne les coordonnées. C’est la même chose pour chaque categorie.
D’un autre côté, la deuxième partie du calcule teste chaque [Corr] pour chaque categorie et donne des coordonnées également, une partie que Jonathan qualifie volontiers d’ennuyeuse car elle comporte beaucoup de code en dur.
La meilleure partie du boulot !
Pour construire le graphe réseau, il a fallu mettre le champ X dans les colonnes et le champ Y dans les lignes (ces champs doivent être agrégés avec une moyenne). Il est aussi indispensable de mettre [line] dans les détails et [orderpoint] dans le path, puis [categorie] en ATTRIBUT dans les couleurs :
Pour cacher le point en forme d’étoile (du fait de ATTR([categorie])) il suffit de faire un clic droit sur la légende des couleurs et de sélectionner « Masquer ». Grâce à cela, la première partie du graphique est faite. Pour construire la seconde, il faudra dupliquer le champ X ou Y (X dans l’exemple ci-dessous). Le second champ ne sera pas une ligne mais une forme (dans le panneau « Repères« ).
Pour un effet optimal, il faut créer des champs calculés :
Le premier champ compare un paramètre [ID] et le champ [ID]. Ce champ est essentiel.
Field [FILTRE_ID]
[Paramètres].[ID]=[ID]
A partir de ce modèle, il faut créer plusieurs champs. Le premier champs créé renvoie un [ID], sélectionné à partir des paramètres, que la formation ait été faite ou non. En effet, comme le montre la formule ci-dessous, il est demandé à Tableau d’effectuer un compte distinct sur le [FILTRE_ID]. Si le compte distinct est égal à 1, je retourne 1, sinon, 2.
Field [formation_shape]
if countd([Paramètres].[ID]=[ID])=1 then '1' else '2' end
Ce champ dupliqué est essentiel pour la date d’obtention du diplôme. Il faut donc utiliser le [FILTRE_ID] pour faire apparaître la date correspondant à un certain ID.
Field [formation_date] if
[FILTRE_ID]=true then [DATE_OPTENTION] end
Ces trois champs constituent la base du graphique réseau. Après leur création, il faut les faire apparaître dans le panneau Repère. Le champ [formation_shape] va dans la partie couleur et [formation_date] dans le label comme un attribut.
Pour obtenir un meilleur rendu, Jonathan a créé trois autres champs, tous les trois dans le but de formater le graphique. Ils permettent de faire apparaître la bonne catégorie et la bonne formation pour chaque cercle.
La dernière étape est de mettre tout ça en forme, en effaçant la grille et les lignes, en cachant les axes, en changeant la couleur et la police… et voilà !
Quand utiliser ce genre de graphique ?
Pour l’exemple, notre Zen Master choisit d’utiliser le graphique réseau pour afficher un suivi de formations. « Mon idée ici était d’avoir un tableau de bord permettant de suivre chaque employé et son parcours de formation. On sélectionne n’importe quel employé et les données qui lui correspondent apparaissent ! »
Cliquez sur l’image pour voir le dashboard
Sections commentaires non disponible.