Publish your MBTiles map with Mapcache

I recently tested a feature of MapCache that can let you publish an MBTiles map build with TileMill but without TileStream Server.   So all you have to do is to install Apache module Mapcache from Mapserver web site, add your mbtiles map in your config file and publish your map with OpenLayers.  I use this tutorial to install MapCache it from trunk.

My Mapcache config for my hexagonal GHS map is here.
<cache name="mbtiles" type="mbtiles">
    <dbname_template>/my/path/mbtiles/GasEmission-v5.mbtiles</dbname_template>
</cache>
<tileset name="gazemi">
    <cache>mbtiles</cache>
    <format>PNG</format>
    <grid>g</grid>
</tileset>

I specified a predefined grid "g" as the default "GoogleMapsCompatible" grid. You don't have to specified this gridset it in your mapcache.xml config file.  Look in the mapcache.xml.sample to find out the complete specification of this predefined grid.

In OpenLayers, I use a WMTS Layer for my MBTiles map.
var wmts = new OpenLayers.Layer.WMTS({
 name: "Gas emission (MBTile)",
 url: "http://simonmercier.net/mapcache/wmts/",
 layer: "gazemi",
 matrixSet: 'g',
 format: 'image/png',
 style: 'default',
 gutter:0,buffer:0,isBaseLayer:true,transitionEffect:'resize',
 resolutions:[156543.03392804099712520838,78271.51696402048401068896,39135.75848201022745342925,19567.87924100512100267224,9783.93962050256050133612,4891.96981025128025066806,2445.98490512564012533403,1222.99245256282006266702,611.49622628141003133351,305.74811314070478829308,152.87405657035250783338,76.43702828517623970583,38.21851414258812695834,19.10925707129405992646,9.55462853564703173959,4.77731426782351586979,2.38865713391175793490,1.19432856695587897633,0.59716428347793950593],
 zoomOffset:0,
 units:"m",
 maxExtent: new OpenLayers.Bounds(-20037508.342789,-20037508.342789,20037508.342789,20037508.342789),
 projection: new OpenLayers.Projection("EPSG:900913".toUpperCase()),
 sphericalMercator: true

 });
This is the same mbtiles file but publish with TileStream server.

Greenhouse Gas Emissions Hexagbin Heatmap from MapBox to CartoDB

Version Française

In my last post (Données ouvertes et les émissions de Gaz à effet de serre au Canada) I explained how I convert a CSV data file (from opendata.gc.ca) on greenhouse gases emissions in Canada to build a map. So I produced a tiled map of this project with TileMill deployed on my own server with Wax API.  You can try it now !

I tried to show two things 1) the density of facilities producing those emissions 2) the distribution of GHG emissions in Canada. of course I could used a "Heatmap" to show the density of those value.  But, I tried to produce this density map using a hexagonal grid.

The idea of ​​presenting the amount of GHGs produced in Canada in a points clustered grid came wit this example (Point Clustering) made ​​by the CartoDB developers. More recently, @elcep also proposed a similar approach in his blog. This concept was perfect to illustrate the distribution of greenhouse gases in a 300km x 300km virtual grid.  I builded my layer with this SQL in PostGIS:

SELECT max(install_ges_p.gid) AS gid, sum(install_ges_p.emis_ges) AS gazemis,     st_snaptogrid(install_ges_p.the_geom, 0::double precision, 0::double precision, 300000::double precision, 300000::double precision) AS the_geom_gr FROM install_ges_p GROUP BY st_snaptogrid(install_ges_p.the_geom, 0::double precision, 0::double precision, 300000::double precision, 300000::double precision); I loaded the data from my local "PostgreSQL / PostGIS" into my CartoDB account.  This tool is cool because it's faster to deploy and doesn't require a tiled map production as everything is dynamic.  All we must do is load the table and carto style into your CartoDB account.
@opac_grid:0.1;
@color_gris: #4F1891;
@opac_marker:0.3;
#gridemisgestot[gazemi_nb>0][zoom>=3]{
 marker-fill:@color_gris;
 marker-opacity:@opac_grid;
 marker-line-color:@color_gris;
 marker-line-opacity:@opac_marker;
 marker-allow-overlap:true;
 text-name:"[gazemis]";
 text-face-name:"DejaVu Sans Book";
 text-allow-overlap:true;
 text-halo-radius:1.5;
 text-halo-fill:rgba(255,255,255,0.50);
 text-placement:point;
 [zoom=3]{marker-width:7.5;text-size:4;}
 [zoom=4]{marker-width:15;text-size:9;}
 [zoom=5]{marker-width:30;text-size:18;}
 [zoom=6]{marker-width:60;text-size:36;}
 [zoom=7]{marker-width:120;text-size:36;}
}
Then you can 1) use this API

2) or use the small 'embed_map' provided by CartoDB layer by layer.

https://smercier.cartodb.com/tables/hex_gazemis_cnt/embed_map?sql=SELECT * FROM hex_gazemis_cnt' width='100%' height='480'

Données ouvertes et les émissions de Gaz à effet de serre au Canada

#cop17 ça vous dit quelque chose?  On dénombre pas moins de 60 000 tweets contenant cette mention depuis une trentaine de jours  sur twitter!  Je ne ferai pas ici de la petite propagande climatologique rassurez-vous, par contre c'était bien assez pour piquer ma curiosité ! Trouvant le sujet de cette conférence sur le changement climatique plutôt intéressant d'un point de vue professionnel et personnel, j'ai donc fouillé un peu le sujet pour visualiser la production de  Gaz à effet de serre (GES) au Canada.

En 2008 selon "The World Ressource Institute", le Canada se situait au 8e rang dans l'échelle des plus grands émetteurs de GES avec 561 MtCO2e soit 1.87 % de la production mondiale totale (toutes sources GES confondues).  Globalement c'est peu mais certains diront que c'est déjà trop alors pour voir plus précisément comment se distribuait la production de dioxyde de carbone au Canada j'ai fait quelques recherches sur le Portail de données ouvertes du gouvernement du Canada.  Ce site regorge de données et il suffit de se donner la peine de chercher un peu pour trouver tout plein de données à référence spatiale.  J'ai trouvé des données et une application de cartographie interactive assez rapidement en recherchant le mot clé "Gaz".

Avec ces données téléchargées (format CSV) sur le site d'Environnement Canada, ce que je voulais faire était assez simple: localiser un peu mieux sur une carte la production des GES au Canada.  J'ai géoréférencé les 578 installations émettrices de GES recensées au Canada dans QGis et j'ai ensuite créé des buffers autour des installations pour visualiser leur importance au Canada et un aussi produit grid qui pourra faciliter la représentation cartographique de ces installations.  Parce que je ne voulais faire autre chose qu'une "Heat map", après quelques tentatives,  j'arrive à quelque chose d'intéressant visuellement à l'échelle du Canada (point rouge étant une installation industrielle émettrice de GES et buffer de 100, 250 et 500 km de rayon).

 

Pour produire les valeurs permettant de créer une représentation thématique du sujet (et surtout me faciliter la vie dans mon cas) je transfère les installations et mon grid hexagonal dans Postgresql/Postgis.  J'ai fait quelques requêtes pour comptabiliser 'spatialement' les données.

1) petit nettoyage des données
update hex_emis_ges set "Emissions"='0' where "Emissions"='-99.00000000' or "Emissions" is null
update hex_emis_ges set "Emission_2"='0' where "Emission_2"='-99.00000000' or "Emission_2" is null
update hex_emis_ges set "Emissio3"='0' where "Emissio3"='-99.00000000' or "Emissio3" is null
update hex_emis_ges set emis_ge3_3=to_number("Emissions",'999999') + to_number("Emission_2",'999999')+to_number("Emissio3",'999999');
2) J'ai ensuite simplement représenté l'importance du nombre d'installations émettrices en GES en créant des tables buffers de 100, 250 et 500 km autour des installations.
create table buf500km_install_ges as select "Emissions" as emissions,ST_Buffer(install_ges_p.the_geom,500000,'quad_segs=8') as the_geom from install_ges_p;
CREATE INDEX idx_buf500km_install_ges_geom_gist ON buf500km_install_ges USING gist(the_geom);
create table buf250km_install_ges as select "Emissions" as emissions,ST_Buffer(install_ges_p.the_geom,250000,'quad_segs=8') as the_geom from install_ges_p;
CREATE INDEX idx_buf250km_install_ges_geom_gist ON buf250km_install_ges USING gist(the_geom);
create table buf100km_install_ges as select "Emissions" as emissions,ST_Buffer(install_ges_p.the_geom,100000,'quad_segs=8') as the_geom from install_ges_p;
CREATE INDEX idx_buf100km_install_ges_geom_gist ON buf100km_install_ges USING gist(the_geom);
3) Enfin, j'ai comptabilisé le nombre d'intersections des buffers sur mon grid hexagonal
CREATE TABLE hex_emis_ges_cnt_install_tt as
      select hex_emis_ges.gid, "Latitude", "Longitude" ,"Emissions","Emission_2","Emissio3",
             (select count(*) from buf500km_install_ges where ST_Intersects (buf500km_install_ges.the_geom,
                      hex_emis_ges.the_geom) = true) as nb_buf500,
             (select count(*) from buf250km_install_ges where ST_Intersects(buf250km_install_ges.the_geom,
                      hex_emis_ges.the_geom)=true) as nb_buf250,
             (select count(*) from buf100km_install_ges where ST_Intersects(buf100km_install_ges.the_geom,
                      hex_emis_ges.the_geom)=true) as nb_buf100,the_geom from hex_emis_ges;
CREATE TABLE hex_emis_ges_cnt_install as
select hex_emis_ges_cnt_install_tt.*, (nb_buf500+nb_buf250)+nb_buf100 as nb_tot_install from hex_emis_ges_cnt_install_tt;
drop table hex_emis_ges_cnt_install_tt;
CREATE INDEX idx_hex_emis_ges_cnt_install_geom_gist ON hex_emis_ges_cnt_install USING gist(the_geom);

Le résultat n'est certes pas une révolution ni parfaite et encore moins scientifique, mais l'effet visuel me semble intéressant dans QGis.  La carte montre deux choses:

  • La quantité d'émission de GES par installations industrielles recensées au Canada
  • La concentration et la répartition spatial des installations industrielles au Canada
  Je n'aimais pas vraiment le résultat alors j'ai passé le projet dans la moulinette TileMill pour produire une carte un peu plus soignée.  Il ne me restera qu'à placer la carte tuilée (MBtiles) dans une page pour présenter l'ensemble du territoire et que j'aimerais bien faire avec MapCache cette fois... Prochain billet donc à suivre!  

Autres liens:

http://cait.wri.org/cait.php?page=background&from=yearly http://www.carbon-biodiversity.net/Interactive/CarbonCalculatorNotes http://maps-cartes.ec.gc.ca/indicators-indicateurs/TableView.aspx?ID=15 http://www.protectedplanet.net/  

Utiliser Google chart API dans TileMill: trop facile!

Suis à mes essais avec les produits MapBox, je voulais faire un démo très simple dans un contexte bien québécois pour échanger avec mes clients ici au Canada.  En tombant sur ce post(Building Google Charts for Interactivity in TillMile) sur le site de MapBox, j'ai eu l'envie de faire un peu la même chose mais avec un Pie Chart.

Pour y arriver, j'ai utilisé des données publiques sur les élections provinciales de 2008 trouvées sur le site du Directeur Général des élections du Québec.  J'ai du faire quelques manipulations avec les données Shapefiles trouvées sur ce même site, puisque que je n'avais que les sections de votes(plus petite unité). Je devais donc faire des regroupements pour pouvoir cartographier le niveau hiérarchique supérieur(circonscription électorale).   Je vous épargne les détails mais j'ai dû utiliser QuantumGIS,  Google Refine pour nettoyer les données de base,  et enfin une transformation GeoKettle pour lier, valider et comptabiliser un gagnant par section de votes.

Une fois la carte construite, j'ai monté une carte interactive avec TileMill et complété la présentation du démo avec l'API Wax qui me permet d'afficher la carte interactive sur le Web (installation de TileStream Server requise).  Quelques lignes de codes seulement sont requises.  Le gros du travail était de construire le URL pour faire l'appel de Google chart API.    Pour faire l'interaction et afficher le "pie chart" j'ai construit la chaîne de caractères URL à l'aide des données JSON encodées en parallèle à chaque tuile du cache MBTiles(adresse URL doit être spécifiée avec la valeur 'grids').

Les données sont transférées côté client à l'aide d'une spécification UTFGrid ingénieuse et sont très facilement récupérables.

var tilejson = {
  tilejson: '1.0.0',
  scheme: 'tms',
  legend:'Cette carte non officielle et incomplète, est un démo fait par Mgeospatial.  Elle a été construite à partir des données sur les résultats des élections générales 2008, téléchargées sur le site Web du <a href="http://www2.electionsquebec.qc.ca/corpo/francais/elections-generales-provincial.asp?section=resultats_gen&mode=n2&even=2008#n2" target="_blank">Directeur général des élections</a><br/><img src="http://mapcoop.org/www-demo/demo/dge.png" width="200" height="40"/>',
  attribution: '<a href="http://www.mgeospatial.com"><img src="http://www.mgeospatial.com/img/logo-300x80.png" alt="" width="100" height="20" /></a>',
  tiles: ['http://mapcoop.org/1.0.0/elect2008_171425/{z}/{x}/{y}.png'],
  grids: ['http://mapcoop.org/1.0.0/elect2008_171425/{z}/{x}/{y}.grid.json'],
  formatter: function(options, data) { 

  return "<img src='http://chart.apis.google.com/chart?chf=a,s,000000E6|bg,s,D5DBDB&chxs=0,676767,11.833&chxt=x&chs=275x148&cht=p3&chco=c35855|616580|638a63|fcad72&chds=0,100&chd=t:"+data.PLQ+","+data.PQ+","+data.ADQ+","+data.Q_SOL+"&chdl="+data.PLQ+"+votes|"+data.PQ+"+votes|"+data.ADQ+"+votes|"+data.Q_SOL+"votes&chdlp=t&chp=1.1&chl=PLQ|PQ|AQD|QS&chma=|21,15&chtt=Élection+2008+par+section+&chts=676767,12.167'/>"}

  };

Je me suis aussi amusé à tester des éléments cartographiques en 3D(fonctionnalité de Mapnik) simplement pour le plaisir.  Le résultat est à mon sens assez concluant.

Un essai sérieux avec TileMill

Le 16 février 2011 la firme de developmentseed (Washington, DC) très impliqué dans les projets développement international, a lancé TileMill un nouveau produit de conception de cartes interactives pour le Web.  Je classerais cette boîte très branchée dans la même lignée que la firme de design Web Stamen (San Francisco) avec son API Polymap .  Ces deux firmes sont très actives actuellement dans le développement de projets Open source en Web GIS.

Il est vrai qu'il s'agit d'une solution toute jeune qui devra faire ses preuves, mais à mon avis, elle révolutionne un peu nos façons de faire en Web mapping. Cette plate-forme s’adresse une nouvelle clientèle du Web mapping, celle des codeurs et designers Web puisqu'elle utilise un scripting de carte(Carto) basé sur les CSS ( Map CSS, juillet 2009, GeoServer et son module CSSGSS de Cartogen ).   Pour l'instant, peu de formats de données sources sont supportés (shapefiles, Postgis, SQLite) par contre depuis la version 0.4, on a accès à tous les systèmes de références EPSG.

L'outil TileMill permet donc à des habitués des CSS de construire une carte très rapidement, de la 'tuiler' dans un fichier SQLite( MBTiles)et de la diffuser avec TileStream Server et l'API Wax tool.

J’ai donc installé et testé TileMill et TileStream Server ( plate-forme node.js). Je dois avouer que beaucoup de plaisir à construire mes premières cartes.

Pour ceux qui seront du FOSS4g 2011 à Denver, il y aura un Workshop sur le sujet donné entre autre par @springmeyer.  J'y serai sans faute!

Projet à suivre...