Depuis un moment, j’avais envie de créer une version un peu animée des cartes R. Il y a bien la possibilité d’exporter les cartes au format gif, mais il manque le côté où on devient acteur…

En cherchant sur la toile, on tombe rapidement sur le tutoriel de Sylvain Prévost qui est plutôt bien expliqué. En parcourant les commentaires, un certain Romain propose son lien avec une petite amélioration : l’affichage de résultats.

Ce qui me plaît dans la méthode employée pour faire cette carte, c’est que ça se base sur un fichier SVG. Or, bien évidemment, R propose d’exporter les graphiques au format SVG… Aussi, je vous propose aujourd’hui, à partir de R et d’un peu de bidouille, de créer une visualisation interactive (un peu) de la carte de France. Mes compétences en JavaScript étant nulles, le résultat n’est pas exceptionnel, mais il est facilement reproductible. Merci à @YoruNoHikage pour ses conseils avisés en javascript et en css.

Voici ce que ça donne : http://egallic.fr//R/Blog/Cartes/carte_france.

Un aperçu statique est présenté ci-dessous (impossibilité d’insérer un script dans un billet…).

Ce dont on a besoin :

  • le logiciel R, avec les packages :
    • maps,
    • maptools,
    • RColorBrewer ;
La première chose à faire, est de créer un dossier dans lequel figurent :
Le fichier « creationJS.R », comme vous vous en doutez, va servir à créer le fichier JavaScript pour pouvoir afficher la carte. Il contient deux fonctions :
  1. creer.fichier.js, qui prend en entrée 6 paramètres. Le premier, 
    file, est le nom du fichier .js que l’on souhaite créer. Le second, valeurs, renseigne les valeurs que l’on souhaite assigner à chaque département. Le troisième, informations.sup, qui contient d’autres informations que l’on souhaite afficher en dehors de l’infobulle, dans la partie droite. Le quatrième, couleurs, indique les couleurs pour chaque département. Le cinquième, legende, renseigne les labels de la légende. Enfin, legende.lesCouleurs donne les couleurs des éléments de la légende ;
  2. creer.html, qui prend 3 arguments. Le premier, file.html, renseigne le nom du fichier HTML à créer. Le second, file.css indique le nom du fichier CSS qui contiendra les propriétés de styles. Le dernier, titre, est simplement pour donner un titre à la page.
Je ne rentre pas dans le détail de ces fonctions. Si vous avez des questions, n’hésitez pas. Je préfère m’attarder sur le deuxième fichier R, celui qu’il faut modifier pour obtenir une nouvelle carte.
Dans un premier temps, on se place dans le répertoire qui contient les deux fichiers R et le dossier js :
setwd("leDossierRacine")
source("creationJS.R")

Puis, on charge la carte de France

require(maps)
france <- map("france",fill=TRUE,plot=FALSE)

À présent, il faut récupérer les noms des départements. Ils vont servir à l’affichage, mais également comme nom de variable. C’est pourquoi je retire tout ce qui suit après les « : » dans les noms proposés par R.

lesDepartements.unique <- unique(sapply(strsplit(france$names,":"),function(x) x[1]))
lesDepartements <- sapply(strsplit(france$names,":"),function(x) x[1])

On note qu’il y a deux variables. En effet, on va avoir besoin de conserver les doublons, parce que derrière des noms similaires se cachent des polygones différents. Par exemple, pour toutes les îles.

Pour fournir un exemple facile à reproduire, tirons des valeurs pour chaque département selon une loi Uniforme de paramètres 0 et 30. Faisons de même pour les informations supplémentaire.

Dans la version présentée en introduction, je me suis amusé avec du texte généré à partir des poèmes de Baudelaire. On verra ça dans un prochain billet.

valeurs.temp <- round(runif(n=length(lesDepartements.unique),min=0,max=30))
informations.sup.temp <- round(runif(n=length(lesDepartements.unique),min=0,max=30))

On ordonne le tout dans une data frame :

df.departements.temp <- data.frame(dep.nom=lesDepartements.unique, valeur=valeurs.temp, informations.sup= informations.sup.temp,stringsAsFactors=FALSE)

Pour que les doublons aient droit, eux aussi, à leur valeur, ne les oublions pas :

valeurs <- df.departements.temp[match(lesDepartements, lesDepartements.unique),"valeur"]
informations.sup <- df.departements.temp[match(lesDepartements, lesDepartements.unique),"informations.sup"]

Maintenant, penchons-nous sur la légende. On choisit 5 couleurs et on scinde l’éventail des valeurs possibles en classes de même longueur.

nb.colors <- 5
require(RColorBrewer)
legende.lesCouleurs <- rev(brewer.pal(nb.colors,"YlOrRd"))
ratio <- (max(valeurs)-min(valeurs))/nb.colors
brks <- round(seq(min(valeurs),max(valeurs),by=ratio),digits=0)
couleurs <- legende.lesCouleurs[findInterval(valeurs,brks,all.inside=TRUE)]
require(maptools)
legende <- leglabs(brks,under="inférieur à",over="supérieur à")

Dans une dernière étape, on appelle les fonctions qui vont créer le script js, le fichier html et la feuille de style.

creer.fichier.js(file="js/script.js",valeurs, informations.sup,couleurs,legende, legende.lesCouleurs)
creer.html(file.html="index.html",file.css="style_carte.css",titre="Carte de la France")

Et voilà ! Il ne reste plus qu’à lancer le fichier « index.html ».

9 thoughts on “Carte R interactive

  1. Bonjour, je ne parviens pas à produire la carte.
    Je pense que je n’ai pas compris qqch le fichier « jquery.js. »
    J’ai téléchargé le fichier « jquery-2.0.3 » que j’ai renommé « jquery.js. », mis la carte ne s’affiche pas.
    Que dois-je faire ?

    Merci pour votre aide.

    B.

    1. Est-ce que votre navigateur vous permet de visualiser la carte de l’exemple contenu dans le fichier zip ? Les liens dans le fichier html sont ils bons dans votre projet ?

  2. J’ai remplacé « mon » « raphael-min.js » par celui de votre zip et ça fonctionne !
    Peut-être le fichier avait-il été corrompu lors du téléchargement ?
    Désolé pour le dérangement… et bravo pour la réalisation de ces scripts !

    B.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Time limit is exhausted. Please reload CAPTCHA.