Une treemap (carte proportionnelle) est une visualisation permettant d'explorer des données hiérarchiques.

Dans notre exemple, nous allons représenter la répartition des bacheliers en 2017 pour obtenir un rendu tel que celui-ci :

Répartition des bacheliers en 2017

Pour réaliser cette visualisation, vous avez besoin des données, d’être connecté à votre compte Koumoul et de quelques minutes.

Sur la page des applications, cliquez à droite sur configurer une application, puis choisissez la visualisation treemap dans la liste des applications de type graphique.

Dans la section sources des données, choisissez le jeu de données que vous venez d'importer.

Dans cette visualisation, nous souhaitons obtenir plusieurs niveaux de représentation de treemap.

Dans la section rendu, sélectionnez les colonnes voie, catégorie, domaine et série, sur le paramètre des colonnes de regroupement.
Votre treemap aura ainsi 4 niveaux.

Modifiez ensuite le paramètre du type de calcul pour avoir la somme des valeurs d'un champ.
Le champ que nous souhaitons afficher est le nb élèves

Dans le calcul de la proportion, vous pouvez choisir entre linéaire ou racine carrée, selon votre préférence d'affichage.

Sur la couleur, vous pouvez choisir une couleur uniforme ou calculée selon un champ.

Dans notre exemple, nous avons choisi couleur uniforme et une palette primaire et blanc.

Voici les paramètres que nous avons sélectionnés pour notre graphique :

Cliquez sur valider pour sauvegarder votre visualisation.

Vous pouvez intégrer votre visualisation sur un autre site en copiant le code de votre visualisation à l'aide du bouton d'action intégrer dans un site, à droite. Votre code devrait ressembler à celui-ci :

<iframe src="https://opendata.koumoul.com/data-fair/app/repartition-des-bacheliers-en-2017?embed=true" width="100%" height="500px" style="background-color: transparent; border: none;"></iframe>

Pour que votre visualisation soit accessible à tous les visiteurs de votre site, activez l'accès au public dans la page d'édition de vos données et la page de configuration votre visualisation.

Lorsque vous l’intégrez sur votre site, vous obtenez ce rendu :

Vous avez maintenant toutes les informations pour créer une visualisation treemap sur la plateforme Koumoul, sans avoir besoin de compétences en programmation, et trouver le code pour pouvoir l’intégrer sur un site externe.

N'hésitez pas à nous contacter pour toute information supplémentaire. Si vous souhaitez aller plus loin, nous pouvons également réaliser des visualisations personnalisées.

Si vous avez des remarques sur ce cours, n'hésitez pas à nous contacter pour nous en faire part.