Accueil / Blog / Métier / 2014 / Dessiner une ville à la main avec TileMill (3 – Occupation des sols et cours d'eau)

Dessiner une ville à la main avec TileMill (3 – Occupation des sols et cours d'eau)

Par Karl Azémar — publié 20/03/2014
Contributeurs : Eric Bréhault, Frédéric Bonifas, Mathieu Leplatre
Nous avons vu comment représenter les bâtiments. Je m'intéresse maintenant à la mise en forme des zones d'occupation des sols et des cours d'eau pour finaliser la représentation de Toulouse et des villes environnantes.
Dessiner une ville à la main avec TileMill (3 – Occupation des sols et cours d'eau)

Assemblage de textures pour l'affichage de zones d'occupation des sols

Cette carte de Toulouse a été créée à partir de données provenant de OpenStreetMap ; la zone affichée se situe à Toulouse et ses environs.

Affichage des zones d'occupation des sols

 Je choisis de simplifier la représentation de l'occupation des sols en grands groupes : residentiel, commercial, industriel, naturel :

SELECT ST_Simplify(way,50) as way,landuse,way_area,
CASE
WHEN landuse = 'residential' THEN 'residential'
WHEN landuse IN ('commercial','retail') THEN 'commercial'
WHEN landuse = 'industrial' THEN 'industrial'
WHEN landuse = 'cemetery' THEN 'cemetery'
WHEN landuse IN ('farm','farmland','farmyard','forest','grass','vineyard') THEN 'natural'
ELSE 'autres'
END AS type
FROM (SELECT * FROM planet_osm_polygon WHERE landuse IS NOT NULL) as zones

Je crée des textures sous GIMP que j'applique aux couches concernées.

Affichage des zones avec une texture

Les bords sont trop rectilignes, j'ajoute deux contours avec du line-smooth afin de casser cela :

#zones {
::outline1 {
line-smooth:2;
line-color:@crayon;
line-width:1;
[zoom>=15] {line-width:0.4;}
line-opacity:0.5;
}
::outline2 [zoom<15] {
line-smooth:3;
line-color:@crayon;
line-width:0.8;
line-opacity:0.3;
}
}

Application de contours aux zones

Affichage des cours d'eau

Sans intervention ces tracés sont très rectilignes. Ce sont sans doute les plus difficiles à « casser ». Etant donné que les cours d'eau ont tendance à traverser une carte entière, ils attirent davantage l'attention que des éléments plus ponctuels.

Affichage basique des cours d'eau

Plutôt qu'appliquer une couleur de fond, je crée une nouvelle texture de crayonnage, beaucoup moins dense :

Application d'une texture aux cours d'eau

Le résultat ne plaît pas encore : les bords sont trop lisses. Je crée donc une deuxième requête PostGIS, pour appeler les mêmes données avec un buffer :

SELECT ST_Buffer(way,50) as way, waterway AS type FROM planet_osm_polygon WHERE waterway='riverbank'

J'applique à cette couche une nouvelle texture basée sur la première, mais encore plus légère :

Deuxième couche de cours d'eau avec buffer

J'arrive ainsi au résultat que je cherche : la reproduction d'un crayonnage rapide, débordant des limites d'origine. Je n'ai ensuite plus qu'à appliquer un contour.

Application d'un contour aux cours d'eau

Je peux maintenant assembler toutes les données sélectionnées : types d'occupation des sols, cours d'eau, bâtiments...

Assemblage final

 

ABONNEZ-VOUS À LA NEWSLETTER !
Voir aussi
Deep clustering d'images aériennes Deep clustering d'images aériennes 31/12/2020

Cet article présente Deep Cluster, une méthode reposant sur l'utilisation conjointe d'un ...

Optimisation de la production de tuiles vectorielles de fond de carte OpenStreetMap pour un service à la demande : Makina Maps Optimisation de la production de tuiles vectorielles de fond de carte OpenStreetMap pour un service à la demande : Makina Maps 04/02/2020

Frédéric Rodrigo, expert OpenStreetMap, présente Makina Maps, une solution permettant de servir ...

Web mapping : comparaison des serveurs de tuiles vectorielles depuis Postgres / PostGIS Web mapping : comparaison des serveurs de tuiles vectorielles depuis Postgres / PostGIS 30/07/2020

Un ensemble de serveurs de tuiles vectorielles basés sur la fonction ST_AsMVT() de PostGIS sont ...

Paralléliser des requêtes avec PostgreSQL 31/03/2020

PostgreSQL permet de découper les requêtes pour en exécuter des parties en parallèle. Il faut ...

SIG : Préparation de données pour la création de tuiles vectorielles 30/01/2020

Pour servir des données sous forme des tuiles vectorielles une préparation est nécessaire comme ...