Visualisation Interactive de Graphes de Connaissances pour la Prévention SST
Propulsé par D3.js, Neo4j et Cypher
Cette visualisation représente les résultats d'une requête Cypher complexe identifiant les corrélations entre risques critiques, incidents survenus et procédures de mitigation. Survolez les nœuds pour voir les détails, cliquez pour épingler, et glissez pour réorganiser.
MATCH (r:Risque {niveau: 'Critique'})<-[:CONCERNE]-(inc:Incident)
MATCH (r)<-[:MITIGUE]-(proc:Procedure)
WHERE inc.date >= date('2024-01-01')
RETURN r, inc, proc,
COUNT(inc) as nb_incidents
ORDER BY nb_incidents DESC
LIMIT 20
Mapping des compétences requises par rôle professionnel et leur couverture des risques identifiés. Les arêtes épaisses indiquent des relations fortes, tandis que la taille des nœuds représente le degré de connectivité.
MATCH (role:Role)-[:REQUIERT]->(comp:Competence)
MATCH (role)-[:EXPOSE_A]->(r:Risque)
OPTIONAL MATCH (comp)-[:PERMET_GERER]->(r)
WITH role, comp, r,
COUNT(DISTINCT r) as total_risques,
COUNT(DISTINCT CASE WHEN (comp)-[:PERMET_GERER]->(r) THEN r END) as risques_couverts
RETURN role, comp, r, total_risques, risques_couverts,
ROUND(100.0 * risques_couverts / total_risques, 2) as taux_couverture
ORDER BY taux_couverture DESC
Visualisation des patterns d'incidents dans différentes zones géographiques du projet, avec agrégation temporelle pour identifier les zones critiques nécessitant une intervention prioritaire.
MATCH (z:Zone)<-[:SITUE_DANS]-(eq:Equipement)-[:IMPLIQUE_DANS]->(inc:Incident)
WHERE inc.date >= date('2024-01-01')
WITH z,
COUNT(DISTINCT inc) as nb_incidents,
AVG(inc.gravite_score) as gravite_moy,
COLLECT(DISTINCT inc.type) as types_incidents
RETURN z.id AS zone_id,
z.nom_anonyme AS zone,
nb_incidents,
ROUND(gravite_moy, 2) as gravite,
types_incidents,
CASE
WHEN nb_incidents >= 10 AND gravite_moy >= 7 THEN 'Critique'
WHEN nb_incidents >= 5 THEN 'Attention'
ELSE 'Normal'
END as classification
ORDER BY nb_incidents DESC, gravite DESC
Exécution des requêtes Cypher sur la base Neo4j pour extraire les sous-graphes pertinents. Utilisation de l'API REST Neo4j ou du driver JavaScript officiel.
// Driver Neo4j
const driver = neo4j.driver(
'neo4j://localhost',
neo4j.auth.basic('user', 'pass')
);
const session = driver.session();
const result = await session.run(cypherQuery);
Conversion des résultats Neo4j en format JSON compatible avec D3.js (nodes/links structure). Application des règles d'anonymisation.
const graphData = {
nodes: records.map(r => ({
id: r.get('id'),
label: anonymize(r.get('label')),
type: r.get('type')
})),
links: relationships.map(rel => ({
source: rel.start,
target: rel.end,
type: rel.type
}))
};
Rendu interactif avec force simulation, zoom/pan, tooltips enrichis, et personnalisation des couleurs/formes selon les types d'entités.
const simulation = d3.forceSimulation(nodes)
.force("link", d3.forceLink(links))
.force("charge", d3.forceManyBody())
.force("center", d3.forceCenter());
svg.selectAll("circle")
.data(nodes)
.enter().append("circle")
.attr("r", d => d.size)
.attr("fill", d => colorScale(d.type));
Ajout d'interactions (hover, click, drag), filtres dynamiques, et options d'export (SVG, PNG, JSON) pour partage et reporting.
node.on("mouseover", showTooltip)
.on("mouseout", hideTooltip)
.on("click", highlightConnections)
.call(d3.drag()
.on("start", dragstarted)
.on("drag", dragged));
┌─────────────────────────────────────────────────────────────────────┐ │ STACK SAFETYGRAPH │ ├─────────────────────────────────────────────────────────────────────┤ │ │ │ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │ │ │ NEO4J │ │ CYPHER │ │ ETL PIPELINE│ │ │ │ Database │─────▶│ Queries │─────▶│ + Anonymiz. │ │ │ │ (Graphe) │ │ (Extraction)│ │ (Transform) │ │ │ └──────────────┘ └──────────────┘ └───────┬──────┘ │ │ │ │ │ ┌──────────▼──────────┐ │ │ │ JSON API │ │ │ │ (REST/GraphQL) │ │ │ └──────────┬──────────┘ │ │ │ │ │ ┌────────────────────────────────────────────────────▼──────────┐│ │ │ FRONTEND VISUALISATION ││ │ │ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ ││ │ │ │ D3.js │ │ Controls │ │ Tooltips │ │ Legends │ ││ │ │ │ Force │ │ Filters │ │ Info-Box │ │ Stats │ ││ │ │ │ Layout │ │ Zoom/Pan │ │ Highlight│ │ Export │ ││ │ │ └──────────┘ └──────────┘ └──────────┘ └──────────┘ ││ │ └────────────────────────────────────────────────────────────────┘│ │ │ │ │ ┌─────────▼─────────┐ │ │ │ USER BROWSER │ │ │ │ (Interactive UI) │ │ │ └───────────────────┘ │ │ │ │ OUTILS COMPLÉMENTAIRES: │ │ • Neo4j Bloom (exploration native) │ │ • Gephi (analyse statistique avancée) │ │ • Vis.js (alternative à D3.js) │ │ │ └─────────────────────────────────────────────────────────────────────┘
Points Forts:
• Interface native Neo4j intuitive
• Navigation dynamique par perspective
• Filtres contextuels en temps réel
• Partage de vues avec équipes
Use Case SafetyGraph: Exploration ad-hoc des corrélations
par coordinateurs SST sans compétences techniques.
Points Forts:
• Personnalisation complète du rendu
• Animations fluides et transitions
• Intégration web seamless
• Large écosystème de layouts
Use Case SafetyGraph: Dashboards interactifs temps réel
pour analyses prédictives et reporting exécutif.
Points Forts:
• Analyse statistique poussée (centralité, clustering)
• Gestion de très grands graphes (millions de nœuds)
• Algorithmes de détection de communautés
• Export haute résolution pour publications
Use Case SafetyGraph: Analyses académiques approfondies
et recherche de patterns cachés dans historique incidents.
Points Forts:
• Simplicité d'implémentation
• Performance optimale petits/moyens graphes
• Options de clustering automatiques
• Documentation exhaustive
Use Case SafetyGraph: Prototypage rapide et vues
simplifiées pour présentations clients.
Représentent les entités du domaine SST:
• Cercles: Entités standard (Compagnie, Projet, Zone)
• Carrés: Événements (Incidents, Quasi-accidents)
• Diamants: Processus (Procédures, Audits)
• Triangles: Acteurs (Rôles, Compétences)
Taille: Proportionnelle au degré de connectivité
Couleur: Code selon type ou niveau de criticité
Représentent les relations sémantiques:
• Épaisseur: Force de la relation (nb interactions)
• Couleur: Type de relation (EXPOSE_À, MITIGUE, etc.)
• Direction: Flèches pour relations orientées
• Style: Pointillés pour relations inférées
Labels: Type de relation affiché au survol
Animation: Flux pour relations actives/récentes
Métadonnées affichées interactivement:
• Tooltip au survol: Infos essentielles (ID, type, statut)
• Panel latéral au clic: Détails complets + historique
• Info-box flottante: Contexte additionnel
• Badges visuels: Indicateurs de priorité/alerte
Toutes les propriétés respectent l'anonymisation
Algorithmes de positionnement selon use case:
• Force-Directed: Vue générale équilibrée
• Hierarchical: Structures organisationnelles
• Circular: Cycles et dépendances
• Radial: Focus sur nœud central
Zoom/Pan standard, mini-map pour navigation grands graphes
La structure et la logique des résultats Cypher deviennent immédiatement compréhensibles visuellement, facilitant l'identification de patterns complexes et corrélations non évidentes dans les données tabulaires.
Permet de justifier et tracer le raisonnement issu du graphe pour rendre le système transparent et validable par toutes les parties prenantes (CNESST, IRSST, auditeurs, gestionnaires).
Identification visuelle instantanée des nœuds isolés, clusters inhabituels, ou chemins critiques nécessitant une investigation approfondie ou action préventive urgente.
Transforme les insights complexes du graphe en visualisations actionnables pour supporter les décisions stratégiques en prévention et allocation de ressources SST.
Les visualisations servent de langage commun entre experts techniques (data scientists), praticiens SST (coordonnateurs), et décideurs (direction), éliminant les barrières de compréhension.
Les exports SVG/PNG des visualisations constituent une documentation visuelle traçable pour audits réglementaires, démontrant la rigueur des analyses SST et la conformité C-25.
Avant d'autoriser des travaux en hauteur, le coordinateur SST lance une requête Cypher pour extraire tous les incidents historiques similaires, les procédures applicables, et les compétences requises. La visualisation D3.js révèle instantanément:
Résultat: Décision d'autorisation documentée et traçable en 15 minutes au lieu de 2+ heures d'analyse manuelle de documents.
Suite à un incident, l'analyste SST exécute une requête Cypher traversant 3-4 niveaux de relations pour identifier la chaîne causale complète. La visualisation Gephi permet de:
Résultat: Rapport d'enquête enrichi avec visualisations explicatives conformes aux exigences CNESST, réduisant les délais d'investigation de 40%.
La direction doit allouer un budget préventif limité. Une requête Cypher agrège incidents, coûts, gravités et équipements impliqués. La visualisation Neo4j Bloom permet aux gestionnaires non-techniques de:
Résultat: Décisions d'allocation budgétaire data-driven et justifiées, réduisant les incidents de 25% l'année suivante dans zones ciblées.