Jonathan Petitcolas

Full-Stack Web Developer, Open-Source Contributor, Seasoned Speaker

Create a clickable SVG map

Published on 18 July 2013

In my career, I often faced customers wanting a clickable France regions or departments map. Several years ago, I was used to implementing a Flash map. It was functional, even if it had several disadvantages:

  • It requires a plug-in. Even if it was widely installed, it is not native.
  • Flash components have really poor performances on Linux.
  • You have to learn a specific language to develop with Flash: Actionscript.
  • Forget the mobile devices: as iOS, some of them would simply not display your map.

Then, I discovered SVG technology allowing to draw vectorial images and/or animations. With a framework like Raphaël.js, it was really simple to achieve a Flash-less map.

What about compatibility with oldest browsers? Well, no problem here, as this framework is Internet Explorer 6 compliant, falling back to VML if SVG is not available. And as it is currently reasonable to forget IE before the 8th version, you can consider using SVG is safe.

In this post, we will focus on creating a France regions map. Yet, the process is exactly the same for all maps you may imagine.

First of all, let’s create our page, containing our map container: a simple div.

<!DOCTYPE html5>
<html>
  <head>
    <meta charset="utf-8" />
    <title>France regions map in SVG with Raphaël.js</title>
  </head>
  <body>
    <div id="map"></div>
    <script src="js/raphael-min.js"></script>
    <script src="js/map.js"></script>
  </body>
</html>

We just declare our container and include Raphaël.js library, and our map drawing script. Let’s initialize Raphaël:

var MAP_WIDTH  = 620;
var MAP_HEIGHT = 600;

var mapContainer = document.getElementById("map");
var map = new Raphael(mapContainer, MAP_WIDTH, MAP_HEIGHT);

This way, Raphaël.js is able to draw into our map div, in an area of MAP_WIDTHxMAP_HEIGHT. If you refresh the page, you should not see anything, as we drew nothing yet. Let’s fix it by creating our first region.

var style = {
  fill: "#ddd",
  stroke: "#aaa",
  "stroke-width": 1,
  "stroke-linejoin": "round",
  cursor: "pointer"
};

map
  .path("m 69.78125,123.21875 -1.78125,1.375 -4.46875,0.5625 -1,1.375 -3.125,-2.34375 -4.09375,2.75 1.5625,2.125 -2.71875,3.71875 -3.34375,-1.9375 -5.46875,0.1875 0,3.90625 -1.5625,0 -0.375,-1.75 -2.34375,0.375 -0.40625,-4.5 -2.125,2.34375 -2.34375,-0.96875 -4.3125,0.40625 -0.78125,1.9375 -2.53125,0.59375 -0.40625,-2.15625 -4.46875,0.59375 0,1.375 -3.125,0.1875 -1.375,-0.96875 -1.5625,0.78125 -0.40625,2.34375 -5.25,0.1875 -2.75,3.3125 2.34375,1.75 -3.125,2.5625 0.96875,1.75 -0.78125,4.28125 3.125,0.40625 1.1875,-1.1875 0.59375,0.78125 7.40625,-0.96875 4.875,-3.5 -4.28125,4.09375 0.375,1.9375 3.90625,-1.75 -0.78125,2.75 4.3125,0.1875 -0.1875,1.15625 -4.6875,-0.1875 -3.71875,-0.96875 -4.5,-2.15625 -2.71875,3.125 3.5,1.1875 -0.1875,5.25 0.96875,-0.78125 2.15625,-3.3125 4.09375,2.34375 1.96875,0.40625 0.78125,3.125 -1.1875,2.125 -2.53125,-0.1875 -2.34375,0 -3.90625,0.59375 -6.65625,0.375 L 8.84375,166 l 1.9375,1.15625 2.15625,-0.1875 1.75,1.5625 2.53125,-0.1875 4.125,4.6875 0.96875,5.0625 -1.375,2.75 4.09375,0.78125 4.5,-0.21875 0.96875,-1.75 -1.75,-2.34375 1.75,0.78125 1.78125,-0.1875 3.125,1.75 1.9375,-0.375 0,-3.34375 0.78125,3.34375 2.53125,4.09375 5.46875,0.375 0.21875,-1.15625 1.34375,1.9375 3.34375,0.59375 2.53125,0 2.34375,3.71875 3.125,0.78125 1.15625,-1.75 -0.5625,2.125 2.71875,1.1875 3.53125,3.5 1.15625,2.15625 -0.375,2.53125 -0.40625,2.5625 2.34375,1.75 1.1875,-1.375 -1.1875,-1.5625 0,-3.5 2.34375,0.5625 0.78125,-2.34375 0.59375,1.375 2.53125,2.15625 1.1875,-1.96875 -1.1875,-2.71875 L 77,197.25 l 2.71875,-0.40625 -0.5625,-1.375 2.53125,0.59375 1.9375,2.34375 -0.96875,1.5625 -2.53125,-0.78125 -2.9375,-1.375 -1.5625,1.96875 2.34375,0.78125 1.75,2.71875 10.5625,-0.96875 2.71875,0.59375 -1.34375,1.15625 0.1875,1.78125 0.375,0.28125 0.84375,-0.15625 1.75,-1.75 1.15625,1.34375 3.125,0 3.71875,-1.9375 5.46875,-2.15625 0.1875,-5.46875 5.09375,-2.71875 12.09375,-0.59375 0.78125,-2.15625 1.96875,-1.9375 4.28125,-0.59375 0.1875,-2.15625 2.9375,0.40625 1.75,2.34375 3.9375,0.96875 0.75,-1.5625 1,-3.53125 2.53125,-6.25 1.375,-0.78125 3.3125,0.40625 0,-5.28125 -1.375,-1.375 0,-5.65625 -0.59375,-1.9375 0,-3.125 1.96875,-1.96875 0,-3.90625 -0.96875,-0.78125 0.1875,-5.46875 -1.5625,-0.78125 -2.34375,0 -1.96875,-1.5625 -2.125,2.53125 -1.75,0.21875 -1.5625,2.125 -1.5625,-0.375 -3.34375,-2.9375 -1.15625,-3.71875 -0.59375,-2.46875 -9.59375,0 -3.53125,-2.15625 2.34375,-3.125 -4.6875,-0.1875 -3.125,3.53125 -3.71875,-0.40625 -0.375,2.15625 -2.34375,0.1875 -0.1875,-2.71875 -1.96875,-0.59375 -1.375,1.5625 0,-3.90625 -2.34375,1.75 -3.5,-0.59375 -1.1875,2.34375 -7.21875,3.90625 0,1.96875 -1.5625,0 0,-3.53125 -4.09375,-1.9375 0.375,-3.53125 -3.6875,-2.71875 0,-3.3125 -2.75,-0.59375 0.1875,-3.125 -2.125,-0.1875 0.1875,-2.15625 -3.90625,0 -0.59375,1.9375 -1.15625,-2.71875 z")
  .attr(style);

We first define a style for our map: we want to draw a gray map, with darker borders (stroke) of 1px. All segments composing our region are softly linked, by rounded line joins. Several types of joins are available, as shown on the W3C normalization page:

SVG linejoins

Then, we draw our region with path function, before setting it corresponding style, which produces the following (I just moved the region with translate method to avoid a big blank in this article):

The code is not really difficult to understand, but the region path is rather enigmatic, isn’t it?

The theory is simple. The m stands for MoveTo. Then, we specify a set of coordinates, corresponding to each vertice of our region. At the end, the z letter means ClosePath: it links the last point to the first one. Yet, in practice, there is a very simple way. For the France map, I just opened the SVG picture of French regions on Wikipedia with a text editor. Then, I looked for all French region. For the previous case, I found the following:

    <path
       style="fill:#00ff03;fill-opacity:0.21000001;fill-rule:evenodd;stroke:#7f7f7f;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;display:inline"
       d="m 69.78125,123.21875 -1.78125,1.375 -4.46875,0.5625 -1,1.375 -3.125,-2.34375 -4.09375,2.75 1.5625,2.125 -2.71875,3.71875 -3.34375,-1.9375 -5.46875,0.1875 0,3.90625 -1.5625,0 -0.375,-1.75 -2.34375,0.375 -0.40625,-4.5 -2.125,2.34375 -2.34375,-0.96875 -4.3125,0.40625 -0.78125,1.9375 -2.53125,0.59375 -0.40625,-2.15625 -4.46875,0.59375 0,1.375 -3.125,0.1875 -1.375,-0.96875 -1.5625,0.78125 -0.40625,2.34375 -5.25,0.1875 -2.75,3.3125 2.34375,1.75 -3.125,2.5625 0.96875,1.75 -0.78125,4.28125 3.125,0.40625 1.1875,-1.1875 0.59375,0.78125 7.40625,-0.96875 4.875,-3.5 -4.28125,4.09375 0.375,1.9375 3.90625,-1.75 -0.78125,2.75 4.3125,0.1875 -0.1875,1.15625 -4.6875,-0.1875 -3.71875,-0.96875 -4.5,-2.15625 -2.71875,3.125 3.5,1.1875 -0.1875,5.25 0.96875,-0.78125 2.15625,-3.3125 4.09375,2.34375 1.96875,0.40625 0.78125,3.125 -1.1875,2.125 -2.53125,-0.1875 -2.34375,0 -3.90625,0.59375 -6.65625,0.375 L 8.84375,166 l 1.9375,1.15625 2.15625,-0.1875 1.75,1.5625 2.53125,-0.1875 4.125,4.6875 0.96875,5.0625 -1.375,2.75 4.09375,0.78125 4.5,-0.21875 0.96875,-1.75 -1.75,-2.34375 1.75,0.78125 1.78125,-0.1875 3.125,1.75 1.9375,-0.375 0,-3.34375 0.78125,3.34375 2.53125,4.09375 5.46875,0.375 0.21875,-1.15625 1.34375,1.9375 3.34375,0.59375 2.53125,0 2.34375,3.71875 3.125,0.78125 1.15625,-1.75 -0.5625,2.125 2.71875,1.1875 3.53125,3.5 1.15625,2.15625 -0.375,2.53125 -0.40625,2.5625 2.34375,1.75 1.1875,-1.375 -1.1875,-1.5625 0,-3.5 2.34375,0.5625 0.78125,-2.34375 0.59375,1.375 2.53125,2.15625 1.1875,-1.96875 -1.1875,-2.71875 L 77,197.25 l 2.71875,-0.40625 -0.5625,-1.375 2.53125,0.59375 1.9375,2.34375 -0.96875,1.5625 -2.53125,-0.78125 -2.9375,-1.375 -1.5625,1.96875 2.34375,0.78125 1.75,2.71875 10.5625,-0.96875 2.71875,0.59375 -1.34375,1.15625 0.1875,1.78125 0.375,0.28125 0.84375,-0.15625 1.75,-1.75 1.15625,1.34375 3.125,0 3.71875,-1.9375 5.46875,-2.15625 0.1875,-5.46875 5.09375,-2.71875 12.09375,-0.59375 0.78125,-2.15625 1.96875,-1.9375 4.28125,-0.59375 0.1875,-2.15625 2.9375,0.40625 1.75,2.34375 3.9375,0.96875 0.75,-1.5625 1,-3.53125 2.53125,-6.25 1.375,-0.78125 3.3125,0.40625 0,-5.28125 -1.375,-1.375 0,-5.65625 -0.59375,-1.9375 0,-3.125 1.96875,-1.96875 0,-3.90625 -0.96875,-0.78125 0.1875,-5.46875 -1.5625,-0.78125 -2.34375,0 -1.96875,-1.5625 -2.125,2.53125 -1.75,0.21875 -1.5625,2.125 -1.5625,-0.375 -3.34375,-2.9375 -1.15625,-3.71875 -0.59375,-2.46875 -9.59375,0 -3.53125,-2.15625 2.34375,-3.125 -4.6875,-0.1875 -3.125,3.53125 -3.71875,-0.40625 -0.375,2.15625 -2.34375,0.1875 -0.1875,-2.71875 -1.96875,-0.59375 -1.375,1.5625 0,-3.90625 -2.34375,1.75 -3.5,-0.59375 -1.1875,2.34375 -7.21875,3.90625 0,1.96875 -1.5625,0 0,-3.53125 -4.09375,-1.9375 0.375,-3.53125 -3.6875,-2.71875 0,-3.3125 -2.75,-0.59375 0.1875,-3.125 -2.125,-0.1875 0.1875,-2.15625 -3.90625,0 -0.59375,1.9375 -1.15625,-2.71875 z"
       id="FRA2"
       inkscape:label="Bretagne" />

We note our path in the eponymous tag. In this case, pathes are labelled correctly, helping us to find pathes really easily. Now, we just have to finalize our whole France map:

var regions = {};
regions["alsace"] = map.path("M 480.71875,112.28125 477,113.3125 l -1.71875,3 0,2.9375 -1.5625,1.375 -1.375,0 -2.53125,-1.78125 -1.96875,1.375 -2.34375,0 -1.9375,-1.9375 -3.71875,-0.59375 -2.15625,-0.96875 -0.78125,-2.9375 -1.75,1.9375 -0.96875,4.5 -2.5625,0.78125 0,2.53125 2.5625,1.1875 1.9375,1.375 -0.78125,1.75 1.78125,1.15625 3.125,-2.34375 5.4375,3.125 -2.3125,4.3125 0.1875,1.375 1.5625,1.5625 -1.1875,4.09375 -3.90625,3.90625 -2.15625,-0.1875 1.375,1.34375 -0.78125,3.53125 L 459.25,155 l 3.71875,0.96875 -2.15625,4.875 -2.34375,4.6875 0.59375,2.9375 -1.9375,4.5 -3.34375,2.90625 -0.1875,7.625 -2.4375,2.09375 0.0937,0.0625 0.78125,1.5625 3.125,0.1875 3.53125,2.75 0.5625,1.34375 -0.1875,2.34375 -0.96875,1.78125 0.375,2.34375 2.75,-0.40625 0.59375,2.15625 0.96875,4.15625 2.3125,-0.375 -0.40625,2.125 1.375,1.1875 7.21875,-0.1875 3.71875,-2.9375 0.1875,-4.3125 1.96875,-2.53125 -2.5625,-2.9375 -1.34375,-3.125 1.5625,-2.125 0,-4.90625 0.96875,-2.34375 0,-3.90625 1.75,-2.53125 -1.9375,-2.71875 -0.21875,-6.25 5.09375,-9.96875 -0.59375,-5.65625 2.34375,-7.625 0.59375,-6.65625 5.0625,-3.6875 0,-2.34375 1.96875,-2.5625 1.5625,0 1.75,-1.75 -0.375,-3.3125 1.75,-4.6875 2.71875,-0.59375 L 496.5312,115 l -4.875,-0.5625 -4.3125,-2.15625 -2.9375,1.75 -1.5625,-1.75 -2.125,0 z");
regions["nord-pas-de-calais"] = map.path("m 285.78125,4.0625 -6.25,2.9375 -9.75,1.5625 -11.34375,2.15625 -8.59375,6.625 0,26.375 -0.0625,0.78125 3.03125,0.71875 0.96875,2.15625 2.34375,-0.59375 1.375,-1.75 1.75,0.59375 3.71875,2.90625 1.375,-0.5625 0.96875,2.34375 3.5,1.5625 0,1.9375 2.5625,0.96875 2.53125,-0.96875 4.875,-0.59375 1.1875,1 2.34375,-1 1.15625,1.96875 -2.90625,1.9375 0,2.75 0.96875,0.96875 0.78125,-0.1875 0.5625,-1.5625 1.78125,-1.1875 1.75,1.375 4.09375,1.375 1.75,0 0,-1.96875 2.5625,1.78125 0.1875,1.5625 -1.1875,1.75 2.15625,-1.1875 1.78125,-0.78125 0.75,1.375 0,1.375 2.9375,-1.5625 4.6875,0 1.75,1.75 1.5625,0.40625 1.5625,-1 2.15625,0 0.59375,1.1875 0.78125,-0.1875 2.34375,-1.375 2.34375,1.375 3.125,-2.15625 1.375,0 1.5625,1.375 3.125,-2.15625 1.34375,0.1875 1.1875,0.96875 4.3125,0.40625 0.375,1.75 2.15625,-1.9375 1.15625,0 0.78125,2.53125 3.71875,0.96875 1.0625,-0.71875 -0.3125,0 -0.1875,-1.9375 3.90625,-2.34375 -0.59375,-3.71875 -3.71875,-0.96875 0.96875,-1 0,-2.71875 2.9375,-2.15625 -0.78125,-1.5625 -6.25,-4.875 -10.9375,0.59375 -1.15625,1.9375 -1.375,0 0.1875,-6.84375 -3.125,-3.6875 -2.34375,0.375 -1.375,-1.5625 -3.90625,1.75 -1.34375,-1.34375 -2.75,-0.40625 -0.78125,-2.53125 -0.1875,-7.8125 -1.75,-0.78125 -0.21875,-1.1875 -1.15625,0 -0.40625,-2.34375 -2.53125,0.21875 -4.875,1.5625 -2.34375,2.90625 -2.34375,0 -1.5625,-1.9375 -0.59375,-2.15625 -1.9375,-2.15625 -2.75,0 -1.15625,-2.125 0,-3.34375 1.34375,-2.125 -0.78125,-2.9375 -2.53125,-5.09375 z");
regions["corse"] = map.path("m 568.92104,452.72493 -2.92969,1.95313 0.39062,1.95312 1.5625,1.95313 -1.75781,1.36719 0.78125,1.5625 -1.17187,1.36718 0,1.75782 1.95312,1.75781 0,2.73437 -1.17187,2.53907 -1.36719,0.58593 -1.5625,-2.14843 -2.73438,0.19531 -0.58593,-0.39063 -2.34375,0 -2.14844,1.95313 -0.78125,3.32031 -5.07813,0.97656 -3.90625,3.32032 -0.78125,2.14843 -1.95312,-0.19531 -0.97656,-1.17187 -0.58594,3.32031 -1.36719,0.58594 -0.39062,3.125 0.58593,1.36718 -2.14843,1.5625 -0.58594,1.5625 -1.5625,0 0,2.14844 1.95312,1.36719 3.32032,1.95312 0.19531,1.56251 -1.95313,0.58593 -3.125,0.58594 0,1.36719 1.17188,1.17187 0.19531,3.90625 4.29688,1.36719 1.5625,0.39063 1.36718,2.14843 -0.97656,1.36719 -1.5625,0.58594 -1.17187,2.14844 -1.17188,1.36718 0.58594,3.51563 2.92969,-0.19531 0.78125,0.58593 2.73437,-1.36718 0.78125,0.78125 -1.36719,2.92968 1.36719,1.36719 -2.34375,1.75781 -1.5625,3.51563 4.29688,0.97656 6.05468,0.58594 -2.53906,2.92969 c 0,0 -1.95312,-0.78125 -1.95312,0.19531 0,0.97656 -1.36719,3.32031 -1.36719,3.32031 l 1.95312,2.14844 3.51563,2.14844 6.64062,1.75781 1.95313,0.78125 1.75781,0.78125 -1.17187,2.14844 3.125,-0.19532 0.58593,1.36719 3.125,0 0.78125,-3.71094 -1.95312,-0.39062 2.73437,-2.92969 -0.97656,-0.97656 0.19531,-1.75781 3.51563,-1.95313 0.19531,-2.14844 -2.34375,-0.19531 -1.5625,1.36719 0,-1.95313 3.125,-0.19531 0.97656,-2.34375 0.78125,-6.83594 -0.58593,-2.92968 -0.19532,-8.59375 4.6875,-6.64063 0,-10.9375 -1.95312,-3.71094 -0.58594,-11.71875 -1.36719,-2.14844 -2.53906,-1.95312 -0.39062,-7.22656 1.17187,-3.32032 -1.5625,-5.27343 -0.97656,-4.29688 -0.78125,-1.17187 -1.75781,-0.97657 z");
regions["rhone-alpes"] = map.path("m 383.28125,262.59375 -2.15625,0.21875 -1.375,2.53125 -3.6875,14.4375 -1.1875,2.75 -1.375,-0.1875 -0.75,-3.90625 -1,-3.125 -2.125,0.1875 -1.78125,1.75 -1.15625,-1.5625 -1.75,1.5625 -2.375,-1.5625 -1.9375,0 -0.78125,0.59375 -1.15625,6.25 -2.15625,0 -1.5625,1.5625 -1.1875,-1.1875 -6.25,-0.96875 -2.34375,1.375 -1.5625,0 -0.375,-1.375 -2.9375,-0.59375 -0.1875,-3.125 -0.59375,-0.1875 L 336,278.625 l -0.5625,2.15625 1.375,2.71875 0.375,11.125 -4.6875,0.21875 -0.1875,1.75 3.125,2.53125 -1.75,1.75 -0.59375,4.3125 2.34375,3.125 2.125,5.0625 5.09375,3.34375 1.75,6.4375 -3.71875,3.5 0.59375,2.34375 5.46875,1.78125 4.3125,-3.53125 2.125,-0.1875 6.25,2.71875 -0.375,3.71875 3.125,-0.1875 2.53125,2.9375 -1.15625,4.6875 -2.75,1.15625 -1.15625,1.96875 0.78125,2.53125 0.5625,1.375 -2.90625,0 -0.21875,3.6875 -3.125,0.21875 -1.5625,4.875 -4.6875,0 -5.0625,3.71875 -2.8125,4.46875 0.46875,0.59375 1.375,7.1875 3.3125,3.59375 -0.5625,4.125 4.15625,2.5 0,5.53125 2.21875,-1.125 4.6875,3.0625 2.21875,0.8125 0.53125,-3.875 2.78125,-0.53125 0.8125,3.03125 2.78125,-0.28125 0.53125,-3.03125 6.34375,3.5625 1.03125,-2.09375 5.28125,-0.78125 1.15625,1.375 -0.5625,3.90625 0.78125,0.96875 2.90625,-2.9375 2.5625,-0.1875 0.5625,-1.5625 -3.3125,-0.40625 -0.5625,-3.5 2.125,-3.3125 2.75,-0.21875 2.71875,2.5625 -2.71875,3.6875 0.78125,1.375 3.90625,0.40625 2.53125,-2.15625 -1.375,2.9375 0.40625,2.34375 4.09375,0.375 5.46875,0.40625 0.78125,2.53125 2.9375,2.15625 2.53125,0.1875 1.75,-1.5625 1,-2.9375 1.5625,1.375 1.15625,1.375 0.78125,-7.25 -1.9375,-0.375 -1.1875,-2.53125 -6.625,-1.78125 -0.8125,-3.3125 2.375,-1.5625 -1.96875,-1.375 0.40625,-1.75 3.125,0.1875 2.71875,1.375 2.15625,-2.53125 -2.15625,-1.75 0.1875,-2.34375 1.1875,-3.71875 4.09375,-0.40625 3.3125,-1.34375 0.59375,-1.375 -1.5625,-0.78125 0,-2.34375 4.875,0 1.5625,-1.5625 -0.96875,-1.75 2.53125,-1.96875 1.78125,0.78125 2.53125,-2.15625 4.46875,0.78125 1.5625,-1.75 3.71875,0.1875 0,-4.28125 -1.5625,-0.78125 -0.78125,-2.53125 L 434.84375,346 434.25,345.03125 l 0.78125,-4.09375 1.375,-1.1875 3.53125,-0.375 1.15625,1.15625 0.59375,2.75 3.5,-0.40625 0.40625,-2.9375 1.75,-0.78125 3.75,0.1875 -0.0625,-0.125 5.84375,-2.34375 2.15625,1.375 2.15625,0 0.1875,-2.34375 2.53125,-1.375 0.96875,-1.15625 5.09375,-1.96875 0.59375,-3.3125 -1,-1.5625 2.75,-4.6875 L 469.78125,320.875 469,318.125 463.71875,315 c 0,0 0.31502,-5.98725 -0.1875,-7.0625 -0.0158,-0.0269 -0.0497,-0.0773 -0.0625,-0.0937 -0.005,-0.005 -0.0261,-0.0266 -0.0313,-0.0313 -0.004,2.2e-4 -0.0284,-7e-5 -0.0313,0 -5e-5,-0.007 -1.7e-4,-0.0294 0,-0.0313 -0.004,1.2e-4 -0.0284,-4e-5 -0.0313,0 -0.003,-1.5e-4 -0.0283,-7e-5 -0.0313,0 -0.004,-8e-5 -0.0284,10e-6 -0.0313,0 -0.78125,0.19532 -3.6875,0.40625 -3.6875,0.40625 l -2.9375,-3.34375 0.1875,-6.625 6.65625,-2.75 0.78125,-1.9375 -0.40625,-4.3125 -4.28125,-4.46875 -1.375,0.78125 0,-1.78125 0,-2.90625 -3.71875,-1.78125 -0.1875,-1.5625 2.15625,-2.34375 0,-2.71875 -3.53125,-3.71875 -0.1875,-2.53125 -6.65625,0 -4.46875,0.78125 -4.3125,3.5 -1.15625,-1.75 -2.15625,0.1875 -1.96875,4.3125 0.21875,1.75 2.125,1.75 -3.90625,2.5625 -2.53125,2.34375 -6.4375,0 0,-3.71875 2.34375,-1.375 3.5,-0.375 0.21875,-1.96875 -1.1875,-0.78125 2.9375,-3.71875 -0.40625,-1.15625 -3.34375,-1.78125 -8.125,8.9375 -5.65625,0 0,-2.34375 -3.125,-1.5625 -3.71875,4.09375 -2.9375,0.40625 0,-2.75 -2.53125,-1.15625 -3.90625,-5.46875 -3.53125,-1.375 -1.15625,-2.53125 -1.96875,-0.40625 -1.9375,1.375 -1.5625,0.40625 -2.15625,-1.78125 z");
regions["franche-comte"] = map.path("m 423.5,175.5 -3.6875,0.59375 -0.59375,1.9375 -1.96875,1.375 -1.34375,-1.5625 -0.96875,0.59375 0.75,1.15625 -1.9375,1.1875 0.59375,1.5625 -2.15625,0.78125 0,2.53125 -2.75,0 -0.1875,1.5625 -2.71875,0.59375 0.1875,2.34375 1.75,0.1875 L 407.5,191.5 l -0.59375,3.90625 -1.75,0 -2.9375,1.1875 -3.125,-1.1875 -2.71875,1.1875 0,1.96875 2.125,0.375 1.5625,3.125 0.21875,1.5625 -2.53125,2.9375 -1.1875,0.375 -0.78125,0.96875 2.15625,1 0.375,3.125 1.75,0.1875 0.21875,3.90625 0.78125,0.78125 0.1875,1.15625 -0.78125,0 -0.40625,3.125 -0.5625,2.15625 0.375,1.375 -1.15625,1.5625 -1.1875,1.5625 0,1.5625 -3.3125,1.5625 -0.96875,1.5625 0.375,1.15625 0.1875,1 -1.34375,0.78125 L 392.25,238 l 1.5625,0.1875 1.78125,2.9375 2.15625,0 1.15625,1.375 1.375,0 -0.40625,1.5625 -4.5,0.5625 0.40625,1.5625 1.5625,1 0,1.9375 -0.59375,0.59375 1.1875,1.5625 1.75,3.125 -0.78125,3.3125 -1.96875,1.375 0.21875,2.71875 2.34375,0.78125 0.78125,1.1875 -1.96875,1.5625 -5.125,0.625 2.40625,0.9375 3.90625,5.46875 2.53125,1.15625 0,2.75 2.9375,-0.40625 3.71875,-4.09375 3.125,1.5625 0,2.34375 5.65625,0 8.125,-8.9375 -0.34375,-0.1875 0.375,-4.09375 2.9375,-3.5 -1.96875,-0.78125 0.21875,-1.375 12.09375,-11.34375 -0.375,-9.375 4.28125,-2.125 2.9375,-1.375 2.71875,-2.53125 0.21875,-3.71875 2.71875,-1.375 6.25,-7.21875 -0.96875,-2.34375 2.15625,-0.96875 2.53125,-3.125 -1.375,-1.375 -4.6875,0.96875 -0.1875,-0.78125 5.0625,-5.84375 2.59375,-0.40625 -0.96875,-4.15625 -0.59375,-2.15625 -2.75,0.40625 -0.375,-2.34375 0.96875,-1.78125 0.1875,-2.34375 -0.5625,-1.34375 -3.53125,-2.75 -3.125,-0.1875 -0.78125,-1.5625 -6.25,-3.3125 -1.75,-1.96875 -1.75,-1.15625 -1.5625,0.78125 -0.21875,1.15625 -1.5625,0.96875 -0.96875,0 -2.9375,-3.3125 -4.09375,0 -1.75,1.375 -1.5625,0.1875 -2.53125,-1.9375 0.1875,-2.15625 -1,-0.78125 z");
regions["lorraine"] = map.path("m 390.125,86.53125 -1.375,2.25 -1.75,1.15625 -1.375,-1.34375 -2.9375,0 -0.5625,-0.78125 -1.96875,3.6875 -0.78125,1.375 2.34375,2.9375 -0.78125,3.90625 -2.15625,1.75 0.21875,1.375 0.75,1.9375 -1.15625,1.1875 -2.34375,1.15625 0.375,2.15625 1,0.1875 -1.75,1.5625 1.34375,2.9375 1.375,4.3125 -1.75,1.9375 3.125,-0.1875 -1.5625,4.875 -2.15625,0.96875 -1.1875,2.9375 1.1875,0.96875 -1.375,2.34375 0.40625,1.5625 3.71875,2.9375 0.1875,6.84375 4.09375,0.59375 2.53125,2.71875 4.6875,2.34375 1.75,0.59375 4.125,4.5 -1.75,1.75 1.34375,1.9375 3.125,0.21875 2.75,3.6875 2.34375,0 0.5625,2.5625 2.5625,0.375 0.5625,1.75 -1.75,1.1875 -1.15625,5.28125 5.46875,2.71875 0,4.09375 2.125,-0.78125 1.78125,1.40625 1.34375,-0.8125 -0.75,-1.15625 0.96875,-0.59375 1.34375,1.5625 1.96875,-1.375 0.59375,-1.9375 3.6875,-0.59375 1,0.78125 -0.1875,2.15625 2.53125,1.9375 1.5625,-0.1875 1.75,-1.375 4.09375,0 2.9375,3.3125 0.96875,0 1.5625,-0.96875 0.21875,-1.15625 1.5625,-0.78125 1.75,1.15625 1.75,1.96875 6.15625,3.25 2.4375,-2.09375 0.1875,-7.625 3.34375,-2.90625 1.9375,-4.5 -0.59375,-2.9375 2.34375,-4.6875 2.15625,-4.875 L 459.25,155 l -0.78125,-5.28125 0.78125,-3.53125 -1.375,-1.34375 2.15625,0.1875 3.90625,-3.90625 1.1875,-4.09375 -1.5625,-1.5625 -0.1875,-1.375 2.3125,-4.3125 -5.4375,-3.125 -3.125,2.34375 -1.78125,-1.15625 0.78125,-1.75 -1.9375,-1.375 -2.5625,-1.1875 0,-2.53125 2.5625,-0.78125 0.96875,-4.5 1.75,-1.9375 0.78125,2.9375 2.15625,0.96875 3.71875,0.59375 1.9375,1.9375 2.34375,0 1.96875,-1.375 2.53125,1.78125 1.375,0 1.5625,-1.375 0,-2.9375 1.71875,-3 -0.40625,0.125 -1.34375,-1.9375 -3.90625,-2.34375 -1.375,-2.15625 -4.6875,0.40625 -2.75,2.53125 -6.625,0.1875 -1.96875,-1.375 c -0.13199,-0.23943 -1.09313,-1.93562 -1.9375,-2.40625 -0.0327,-0.0174 -0.0865,-0.0457 -0.125,-0.0625 -0.0285,-0.0117 -0.0699,-0.0243 -0.0937,-0.0313 -0.0107,-0.005 -0.0512,-0.0255 -0.0625,-0.0313 -0.003,1e-5 -0.0278,-1.4e-4 -0.0313,0 -0.025,-10e-4 -0.0737,0 -0.0937,0 -0.91552,1e-5 -2.6881,-1.0275 -2.90625,-1.15625 l -2.75,1.15625 -0.1875,2.34375 -3.3125,0.40625 -1.96875,-3.71875 -1.15625,-0.40625 0,-2.71875 -2.75,-1.1875 -0.1875,-4.6875 -1.96875,-1.9375 -4.09375,-1.96875 -1.9375,0 -0.59375,0.40625 -1.96875,0 -2.71875,-2.34375 -2.9375,0.1875 -2.34375,1.96875 -0.59375,0.96875 -3.3125,0 -1.15625,-1.1875 -3.125,0 -3.53125,-3.90625 -4.5,0 -2.34375,2.15625 -3.3125,0.1875 -1.15625,1.1875 -1.1875,0 -0.7813,-3.71865 -1.5625,-1.5625 -1.125,-0.15625 z");
regions["champagne-ardenne"] = map.path("m 367.625,55.84375 -1.96875,2.90625 -1.75,1.78125 0,1.75 0,2.34375 -2.34375,1.5625 -4.28125,1.375 -2.34375,0.96875 -2.75,-2.15625 -3.71875,0 -0.53125,3.46875 1.75,3.3125 -1.75,1.5625 -0.1875,2.9375 0.96875,1.5625 -0.78125,2.34375 -2.9375,1.5625 0,2.53125 -3.71875,0.78125 -0.59375,1.5625 2.5625,1.375 -0.78125,2.71875 -0.59375,2.34375 0.1875,6.65625 -1.375,0.375 -3.3125,-2.15625 -2.34375,1 0.40625,1.9375 -4.125,0 -3.6875,2.75 0,5.25 2.71875,1.78125 0.78125,1.75 -4.5,0.375 -0.5625,1.78125 1.75,1.15625 -0.78125,1.1875 -1.75,0.78125 0.375,1.34375 2.53125,0 1,1.375 -1.75,1.1875 -1.5625,4.09375 -2.9375,1.375 -1,2.125 -0.96875,1.1875 0.21875,1.15625 -1.5625,1 -0.40625,2.71875 1.5625,0.96875 0.78125,2.9375 -0.96875,1.75 0.59375,1.375 2.90625,-0.1875 0,1.5625 -2.71875,1.15625 -0.1875,2.34375 -1.375,1.78125 -0.78125,3.90625 -0.4375,3.28125 1.21875,1 2.34375,0 5.0625,5.28125 -0.59375,5.28125 3.53125,2.71875 1.96875,-1.375 3.125,3.71875 0.375,3.53125 2.15625,2.90625 0.96875,2.15625 7.8125,0.40625 3.90625,-1.96875 1.15625,2.15625 1.375,0.1875 1,-2.15625 6.4375,-0.1875 2.53125,-1.375 0.40625,-2.53125 5.65625,0 3.125,1.75 3.5,3.71875 4.5,6.0625 -2.53125,2.71875 1.75,1.1875 0.1875,3.3125 3.125,-0.1875 0.78125,1.5625 2.34375,0.1875 1.75,-0.96875 3.125,3.90625 0.40625,0.96875 4.28125,-0.96875 0.8125,-1.96875 0.1875,0.0313 0,-1.96875 2.71875,-1.1875 3.125,1.1875 2.9375,-1.1875 1.75,0 0.59375,-3.9063 0.96875,-1.15625 -1.75,-0.1875 -0.1875,-2.34375 2.71875,-0.59375 0.1875,-1.5625 2.75,0 0,-2.53125 2.15625,-0.78125 -0.59375,-1.5625 0.59375,-0.375 L 412.5625,179 l -2.125,0.78125 0,-4.09375 -5.46875,-2.71875 1.15625,-5.28125 1.75,-1.1875 -0.5625,-1.75 -2.5625,-0.375 -0.5625,-2.5625 -2.34375,0 -2.75,-3.6875 -3.125,-0.21875 -1.34375,-1.9375 1.75,-1.75 -4.125,-4.5 -1.75,-0.59375 -4.6875,-2.34375 -2.53125,-2.71875 -4.09375,-0.59375 L 379,136.625 l -3.71875,-2.9375 -0.40625,-1.5625 1.375,-2.34375 -1.1875,-0.96875 1.1875,-2.9375 2.15625,-0.96875 1.5625,-4.875 -3.125,0.1875 1.75,-1.9375 -1.375,-4.3125 -1.34375,-2.9375 1.75,-1.5625 -1,-0.1875 -0.375,-2.15625 2.34375,-1.15625 1.15625,-1.1875 -0.75,-1.9375 -0.21875,-1.375 2.15625,-1.75 0.78125,-3.90625 -2.34375,-2.9375 0.78125,-1.375 1.96875,-3.6875 0.5625,0.78125 2.9375,0 1.375,1.34375 1.75,-1.15625 1.375,-2.25 -1.40625,-0.21875 -0.78125,-3.90625 -1.5625,-1.1875 -5.46875,-0.59375 -0.96875,-2.53125 -1.78125,-1.15625 -6.25,-0.78125 -0.375,-4.5 0.78125,-0.78125 0,-1.75 -3.125,-1.96875 0.59375,-2.15625 0.78125,-1.9375 -1.375,-1.1875 2.15625,-1.9375 0,-3.53125 -0.78125,-0.5625 -2.9375,0 z");
regions["picardie"] = map.path("m 249.78125,44.5 -0.53125,6.4375 4.3125,3.90625 0,1.96875 -5.28125,-3.125 -6.34375,7.8125 1.6875,0.71875 2.15625,-0.1875 0.96875,1.9375 8.59375,8.40625 0.59375,3.5 1.9375,3.53125 -1.9375,2.34375 -0.78125,1.9375 1.5625,0 -0.78125,1.96875 -0.78125,3.90625 1.15625,1.9375 0,3.34375 1.96875,0 -0.78125,1.34375 -1.375,2.5625 -0.5625,1.75 1.75,1.5625 0.5625,4.5 1,1.5625 -1.375,0.375 -1.75,-0.96875 -0.3125,2.3125 0.125,-0.15625 0.75,1.75 1.1875,1.9375 5.28125,0.40625 3.71875,-0.40625 2.53125,-1.9375 3.125,1.9375 1.5625,1.1875 2.34375,-0.59375 2.125,-0.96875 4.125,2.15625 4.28125,2.53125 1.375,1.375 2.34375,-1.5625 1.9375,1.15625 1.1875,0.96875 1.75,-0.1875 1.1875,-1.5625 2.71875,1.5625 3.34375,-1.375 1.9375,0.59375 1.9375,-1.5625 1.1875,-0.59375 2.15625,1.5625 0.59375,4.3125 5.25,5.0625 1.75,0.59375 1,2.34375 3.28125,0.6875 0.40625,-0.5 1,-2.125 2.9375,-1.375 1.5625,-4.09375 1.75,-1.1875 -1,-1.375 -2.53125,0 -0.375,-1.34375 1.75,-0.78125 0.78125,-1.1875 -1.75,-1.15625 0.5625,-1.78125 4.5,-0.375 -0.78125,-1.75 -2.71875,-1.78125 0,-5.25 3.6875,-2.75 4.125,0 -0.40625,-1.9375 2.34375,-1 3.3125,2.15625 1.375,-0.375 -0.1875,-6.65625 0.59375,-2.34375 L 343.25,89.375 340.6875,88 341.28125,86.4375 345,85.65625 l 0,-2.53125 2.9375,-1.5625 0.78125,-2.34375 -0.96875,-1.5625 0.1875,-2.9375 1.75,-1.5625 -1.75,-3.3125 0.53125,-3.46875 -3.96875,0 -1.0625,0.71875 -3.71875,-0.96875 -0.78125,-2.53125 -1.15625,0 -2.15625,1.9375 -0.375,-1.75 -4.3125,-0.40625 -1.1875,-0.96875 -1.34375,-0.1875 -3.125,2.15625 -1.5625,-1.375 -1.375,0 -3.125,2.15625 -2.34375,-1.375 -2.34375,1.375 -0.78125,0.1875 -0.59375,-1.1875 -2.15625,0 -1.5625,1 -1.5625,-0.40625 -1.75,-1.75 -4.6875,0 -2.9375,1.5625 0,-1.375 -0.75,-1.375 -1.78125,0.78125 -2.15625,1.1875 1.1875,-1.75 -0.1875,-1.5625 -2.5625,-1.78125 0,1.96875 -1.75,0 -4.09375,-1.375 -1.75,-1.375 -1.78125,1.1875 -0.5625,1.5625 -0.78125,0.1875 -0.96875,-0.96875 0,-2.75 2.90625,-1.9375 -1.15625,-1.96875 -2.34375,1 -1.1875,-1 -4.875,0.59375 -2.53125,0.96875 -2.5625,-0.96875 0,-1.9375 -3.5,-1.5625 -0.96875,-2.34375 -1.375,0.5625 -3.71875,-2.90625 -1.75,-0.59375 -1.375,1.75 L 253.78125,47.375 252.8125,45.21875 249.78125,44.5 z");
regions["haute-normandie"] = map.path("m 241.9375,61.5 -1.28125,1.5625 -8.375,6.4375 -14.84375,3.71875 -9.78125,3.5 -8,4.3125 -4.6875,7.03125 -0.96875,5.46875 3.90625,2.9375 5.65625,1.15625 -0.90625,0.15625 0.9375,7.40625 1.96875,0.59375 0,0.78125 -1.96875,1.15625 2.34375,3.3125 1.1875,4.6875 -0.21875,1.96875 -1.75,1.15625 0.1875,1.375 1.96875,0.78125 0.1875,1.75 -1.5625,4.5 1.5625,1.96875 5.46875,0.1875 1.15625,2.71875 1.96875,1.96875 2.71875,0.96875 0.8125,2.9375 -1.375,1.9375 2.84375,1.90625 2.8125,-2.6875 2.71875,0 7.0625,-3.6875 2.3125,0.96875 4.90625,0 1.15625,-1.375 0,-2.9375 3.90625,-1.9375 0,-3.125 1.0625,-0.875 -0.0937,-0.875 1,-1 -1.75,-0.375 0,-1.5625 -1,-1.5625 0.78125,-0.96875 5.46875,-1.5625 1.375,-2.34375 1.1875,-4.3125 1.4375,-1.78125 0.3125,-2.3125 1.75,0.96875 1.375,-0.375 -1,-1.5625 -0.5625,-4.5 -1.75,-1.5625 0.5625,-1.75 1.375,-2.5625 0.78125,-1.34375 -1.96875,0 0,-3.34375 -1.15625,-1.9375 0.78125,-3.90625 0.78125,-1.96875 -1.5625,0 0.78125,-1.9375 1.9375,-2.34375 -1.9375,-3.53125 -0.59375,-3.5 -8.59375,-8.40625 -0.96875,-1.9375 -2.15625,0.1875 L 241.9375,61.5 z");
regions["basse-normandie"] = map.path("m 119.5625,77.5 -0.78125,1.96875 4.125,3.3125 0,4.3125 -1.5625,1.9375 L 122.3125,90 122.90625,90.40625 122.5,94.125 l 1.375,3.125 4.5,5.0625 0.96875,4.5 0.96875,1.375 0,7.03125 2.34375,4.6875 0,5.46875 -2.53125,5.0625 2.71875,7.03125 4.3125,0.96875 0.375,1.96875 -2.125,0.96875 -3.6875,0 0.59375,2.46875 1.15625,3.71875 3.34375,2.9375 1.5625,0.375 1.5625,-2.125 1.75,-0.21875 2.125,-2.53125 1.96875,1.5625 2.34375,0 1.5625,0.78125 0,0.375 3.3125,0.40625 1.96875,-1.5625 2.90625,1.1875 1.375,2.34375 2.15625,1.5625 2.9375,-1.96875 1.9375,1.375 5.28125,-3.125 5.28125,0.78125 2.90625,-1.1875 0.8125,-1.9375 1.9375,-0.1875 1.75,1.5625 0.78125,4.28125 2.53125,0.96875 1,3.53125 3.3125,0.1875 5.28125,-4.875 5.28125,-0.1875 L 204,154 l 0.96875,7.03125 3.3125,1.1875 1.96875,2.9375 4.09375,0 0.1875,1.34375 0.1875,-1.9375 0.78125,0 2.75,4.09375 2.125,0.34375 0,-4.625 -1.34375,-1.78125 -0.40625,-1.5625 2.9375,-1.75 2.9375,-0.59375 1.9375,-2.34375 -0.375,-7.21875 -4.125,-3.5 -0.1875,-3.34375 -3.5,-2.34375 1.375,-1.9375 -0.8125,-2.9375 -2.71875,-0.96875 -1.96875,-1.96875 -1.15625,-2.71875 -5.46875,-0.1875 -1.5625,-1.96875 1.5625,-4.5 -0.1875,-1.75 -1.96875,-0.78125 -0.1875,-1.375 1.75,-1.15625 0.21875,-1.96875 -1.1875,-4.6875 -2.34375,-3.3125 1.96875,-1.15625 0,-0.78125 -1.96875,-0.59375 -0.9375,-7.40625 -4.5625,0.8125 -7.4375,4.3125 -8.375,3.3125 -6.65625,-3.71875 -16,-2.34375 -3.71875,-1.9375 -7.625,1.9375 -0.1875,-4.6875 L 143,89.4375 l 1.5625,-3.90625 2.15625,0 -1.9375,-5.28125 -8.40625,-0.40625 -4.5,3.125 -5.0625,-3.3125 -7.25,-2.15625 z");
regions["bretagne"] = map.path("m 69.78125,123.21875 -1.78125,1.375 -4.46875,0.5625 -1,1.375 -3.125,-2.34375 -4.09375,2.75 1.5625,2.125 -2.71875,3.71875 -3.34375,-1.9375 -5.46875,0.1875 0,3.90625 -1.5625,0 -0.375,-1.75 -2.34375,0.375 -0.40625,-4.5 -2.125,2.34375 -2.34375,-0.96875 -4.3125,0.40625 -0.78125,1.9375 -2.53125,0.59375 -0.40625,-2.15625 -4.46875,0.59375 0,1.375 -3.125,0.1875 -1.375,-0.96875 -1.5625,0.78125 -0.40625,2.34375 -5.25,0.1875 -2.75,3.3125 2.34375,1.75 -3.125,2.5625 0.96875,1.75 -0.78125,4.28125 3.125,0.40625 1.1875,-1.1875 0.59375,0.78125 7.40625,-0.96875 4.875,-3.5 -4.28125,4.09375 0.375,1.9375 3.90625,-1.75 -0.78125,2.75 4.3125,0.1875 -0.1875,1.15625 -4.6875,-0.1875 -3.71875,-0.96875 -4.5,-2.15625 -2.71875,3.125 3.5,1.1875 -0.1875,5.25 0.96875,-0.78125 2.15625,-3.3125 4.09375,2.34375 1.96875,0.40625 0.78125,3.125 -1.1875,2.125 -2.53125,-0.1875 -2.34375,0 -3.90625,0.59375 -6.65625,0.375 L 8.84375,166 l 1.9375,1.15625 2.15625,-0.1875 1.75,1.5625 2.53125,-0.1875 4.125,4.6875 0.96875,5.0625 -1.375,2.75 4.09375,0.78125 4.5,-0.21875 0.96875,-1.75 -1.75,-2.34375 1.75,0.78125 1.78125,-0.1875 3.125,1.75 1.9375,-0.375 0,-3.34375 0.78125,3.34375 2.53125,4.09375 5.46875,0.375 0.21875,-1.15625 1.34375,1.9375 3.34375,0.59375 2.53125,0 2.34375,3.71875 3.125,0.78125 1.15625,-1.75 -0.5625,2.125 2.71875,1.1875 3.53125,3.5 1.15625,2.15625 -0.375,2.53125 -0.40625,2.5625 2.34375,1.75 1.1875,-1.375 -1.1875,-1.5625 0,-3.5 2.34375,0.5625 0.78125,-2.34375 0.59375,1.375 2.53125,2.15625 1.1875,-1.96875 -1.1875,-2.71875 L 77,197.25 l 2.71875,-0.40625 -0.5625,-1.375 2.53125,0.59375 1.9375,2.34375 -0.96875,1.5625 -2.53125,-0.78125 -2.9375,-1.375 -1.5625,1.96875 2.34375,0.78125 1.75,2.71875 10.5625,-0.96875 2.71875,0.59375 -1.34375,1.15625 0.1875,1.78125 0.375,0.28125 0.84375,-0.15625 1.75,-1.75 1.15625,1.34375 3.125,0 3.71875,-1.9375 5.46875,-2.15625 0.1875,-5.46875 5.09375,-2.71875 12.09375,-0.59375 0.78125,-2.15625 1.96875,-1.9375 4.28125,-0.59375 0.1875,-2.15625 2.9375,0.40625 1.75,2.34375 3.9375,0.96875 0.75,-1.5625 1,-3.53125 2.53125,-6.25 1.375,-0.78125 3.3125,0.40625 0,-5.28125 -1.375,-1.375 0,-5.65625 -0.59375,-1.9375 0,-3.125 1.96875,-1.96875 0,-3.90625 -0.96875,-0.78125 0.1875,-5.46875 -1.5625,-0.78125 -2.34375,0 -1.96875,-1.5625 -2.125,2.53125 -1.75,0.21875 -1.5625,2.125 -1.5625,-0.375 -3.34375,-2.9375 -1.15625,-3.71875 -0.59375,-2.46875 -9.59375,0 -3.53125,-2.15625 2.34375,-3.125 -4.6875,-0.1875 -3.125,3.53125 -3.71875,-0.40625 -0.375,2.15625 -2.34375,0.1875 -0.1875,-2.71875 -1.96875,-0.59375 -1.375,1.5625 0,-3.90625 -2.34375,1.75 -3.5,-0.59375 -1.1875,2.34375 -7.21875,3.90625 0,1.96875 -1.5625,0 0,-3.53125 -4.09375,-1.9375 0.375,-3.53125 -3.6875,-2.71875 0,-3.3125 -2.75,-0.59375 0.1875,-3.125 -2.125,-0.1875 0.1875,-2.15625 -3.90625,0 -0.59375,1.9375 -1.15625,-2.71875 z");
regions["auvergne"] = map.path("m 301.625,247.96875 -2.71875,3.5 -1.5625,0.1875 -1.75,1.78125 -1.96875,-2.15625 -5.25,5.28125 0,3.125 0.96875,0.78125 0.1875,1.5625 -2.71875,2.125 -2.5625,-0.78125 -4.875,1 -2.53125,2.90625 -0.9375,2 0.15625,-0.0313 2.34375,3.3125 0,2.34375 1.34375,1.75 1.375,-1.75 1.5625,2.75 2.15625,0.78125 L 287,283.5 l 0.375,6.0625 1.5625,1.9375 0.78125,3.71875 -2.34375,1.75 -0.5625,2.75 -2.15625,1.15625 -3.71875,2.15625 0.375,1.75 4.5,4.5 0.40625,2.75 -1.78125,2.90625 0,2.75 1.1875,1.375 0.59375,3.3125 -0.96875,3.5 0.96875,2.34375 -1.1875,1.375 -1.9375,0 -1.96875,-2.15625 -1.75,-0.96875 -0.1875,5.46875 -3.53125,2.15625 -2.53125,3.5 0.59375,3.53125 -0.78125,1.5625 -1,3.125 -1.5625,0 -1.5625,1.9375 1.1875,1.1875 0.78125,1.9375 -2.53125,1.78125 1.03125,6.53125 3.3125,2.46875 -2.5,5.8125 2.5,1.09375 -1.09375,3.3125 2.1875,0.28125 1.65625,-2.75 2.78125,0 0.53125,0.8125 6.09375,0 1.09375,-2.46875 1.375,-0.5625 0.5625,-4.40625 1.375,0 0,-4.6875 5.53125,-4.71875 0.5625,0.84375 0.53125,3.59375 3.875,-0.5625 0.84375,5.53125 1.90625,0 0.5625,5.53125 1.71875,2.125 2.8125,-6.46875 2.75,-8.59375 3.5,2.34375 1.5625,-3.5 5.46875,-1.96875 3.53125,9 5.0625,-1.5625 0.375,-2.34375 1.96875,0 0.78125,2.71875 3.625,-0.875 4.5,5.75 2.8125,-4.46875 5.0625,-3.71875 4.6875,0 1.5625,-4.875 3.125,-0.21875 0.21875,-3.6875 2.90625,0 -0.5625,-1.375 -0.78125,-2.53125 1.15625,-1.96875 2.75,-1.15625 1.15625,-4.6875 -2.53125,-2.9375 -3.125,0.1875 0.375,-3.71875 -6.25,-2.71875 -2.125,0.1875 -4.3125,3.53125 -5.46875,-1.78125 -0.59375,-2.34375 3.71875,-3.5 -1.75,-6.4375 -5.09375,-3.34375 -2.125,-5.0625 -2.34375,-3.125 0.59375,-4.3125 1.75,-1.75 -3.125,-2.53125 0.1875,-1.75 4.6875,-0.21875 -0.375,-11.125 -1.375,-2.71875 0.5625,-2.15625 3.25,-0.5625 0.0937,-0.21875 4.09375,-3.125 0.1875,-7.625 -1.375,-1.9375 -3.125,0 -1.15625,-1.5625 -3.3125,0 -0.96875,-1.1875 0,-2.9375 -3.9375,-7.40625 -1.9375,-1.375 -3.71875,5.09375 -1.5625,0.375 -0.59375,-2.53125 -1.75,-0.78125 -0.78125,1.5625 -2.90625,0 -0.40625,-1.75 -1.9687,1.15625 L 312,255 l -2.34375,-2.5625 -3.34375,-1.5625 -0.1875,-2.53125 -4.5,-0.375 z");
regions["pays-de-la-loire"] = map.path("m 182.5,146.40625 -1.9375,0.1875 -0.8125,1.9375 -2.90625,1.1875 -5.28125,-0.78125 -5.28125,3.125 -1.9375,-1.375 -2.9375,1.96875 -2.15625,-1.5625 -1.375,-2.34375 -2.90625,-1.1875 -1.96875,1.5625 -3.3125,-0.40625 -0.1875,5.09375 0.96875,0.78125 0,3.90625 -1.96875,1.96875 0,3.125 0.59375,1.9375 0,5.65625 1.375,1.375 0,5.28125 -3.3125,-0.40625 -1.375,0.78125 -2.53125,6.25 -1,3.53125 -0.75,1.5625 -3.9375,-0.96875 -1.75,-2.34375 -2.9375,-0.40625 -0.1875,2.15625 -4.28125,0.59375 -1.96875,1.9375 -0.78125,2.15625 -12.09375,0.59375 -5.09375,2.71875 -0.1875,5.46875 -5.46875,2.15625 -3.71875,1.9375 -3.125,0 -1.15625,-1.34375 -1.75,1.75 -0.84375,0.15625 1,0.6875 -3.71875,3.3125 0.78125,0.78125 0.78125,1.5625 -1.96875,2.75 2.15625,1.15625 3.71875,0.78125 0.375,-1.5625 2.15625,2.75 3.53125,0 2.53125,-2.75 3.3125,0 -3.5,1.75 0.1875,1.96875 0.78125,1.75 -2.15625,2.15625 -2.34375,0 0.40625,2.9375 4.28125,-0.78125 5.09375,4.6875 -6.0625,7.8125 -0.1875,4.6875 6.03125,5.84375 -0.1875,1.75 1.75,0 3.71875,11.15625 3.90625,1.9375 3.90625,3.90625 4.5,0 1.75,3.90625 4.3125,0 L 135,274 l 4.3125,2.15625 0.1875,-2.75 1.09375,1.03125 5.96875,-3.625 2.75,-0.1875 1.15625,3.125 3.71875,-1.5625 3.125,2.34375 2.53125,-1.1875 L 162,272.75 l 0.96875,-1.15625 2.71875,-1.75 -1.9375,-1.96875 -1.5625,1.1875 L 162,267.5 l 1.375,-2.5625 -1.375,-2.34375 1.15625,-1.5625 -0.59375,-5.46875 -1.9375,-2.90625 1.375,-1.78125 -3.125,-3.5 1.15625,-2.53125 -4.6875,-3.90625 0,-2.34375 -1.9375,-2.75 4.09375,-1.75 6.0625,1.375 2.71875,-1.78125 0,-2.71875 5.28125,-0.40625 4.875,-0.96875 5.28125,-0.1875 0.59375,1.375 1.375,1.15625 1.34375,-2.34375 3.71875,-3.90625 1.5,0 2.21875,-8 3.125,-3.71875 -0.21875,-4.28125 1.96875,-2.5625 0,-1.15625 -0.96875,-1.1875 1.9375,-3.90625 3.90625,2.75 2.15625,0 -1.1875,-3.90625 2.375,1.5625 1.34375,-1.96875 5.65625,-1.5625 -0.96875,-2.34375 1.375,-1.75 2.9375,-1.15625 2.71875,-3.53125 0,-3.71875 1.96875,0 0.78125,-2.71875 0.1875,-4.09375 -1.9375,-1.78125 1.5625,-2.71875 L 223.5,171 l -2.71875,-1.9375 -2.53125,-0.40625 -2.75,-4.09375 -0.78125,0 -0.1875,1.9375 -0.1875,-1.34375 -4.09375,0 -1.96875,-2.9375 -3.3125,-1.1875 L 204,154 l -1.5625,-2.125 -5.28125,0.1875 -5.28125,4.875 -3.3125,-0.1875 -1,-3.53125 -2.53125,-0.96875 -0.78125,-4.28125 -1.75,-1.5625 z");
regions["ile-de-france"] = map.path("M 255.5625,109.6875 254,111.625 l -1.1875,4.3125 -1.375,2.34375 -5.46875,1.5625 -0.78125,0.96875 1,1.5625 0,1.5625 1.75,0.375 -1,1 0.0937,0.875 0.125,-0.0937 1.9375,1.9375 0.59375,2.34375 1.5625,1.5625 -0.78125,2.15625 0,1.9375 1.375,1.5625 -1.375,2.34375 1.375,3.34375 2.71875,1.9375 0.40625,2.15625 2.34375,0.375 0.5625,4.3125 1.78125,2.15625 4.0938,0.7812 0.375,2.53125 0.40625,0.59375 0.40625,5.25 6.25,-0.5625 2.53125,-2.34375 2.15625,1.75 5.25,0.375 1.96875,2.9375 2.34375,1.1875 0.1875,3.3125 -3.125,2.15625 1.75,1.5625 2.15625,-1.375 5.28125,0.1875 1.9375,-0.375 0.59375,-1.5625 2.15625,0.1875 0.375,1.5625 4.875,-2.75 1.78125,-2.125 2.34375,-2.75 -1.5625,-1.75 1.375,-2.9375 3.5,-1.75 7.625,0.375 1.75,-1.34375 0.15625,0.15625 0.4375,-3.28125 0.78125,-3.90625 1.375,-1.78125 0.1875,-2.34375 2.71875,-1.15625 0,-1.5625 -2.90625,0.1875 -0.59375,-1.375 0.96875,-1.75 -0.78125,-2.9375 -1.5625,-0.96875 0.40625,-2.71875 1.5625,-1 -0.21875,-1.15625 0.5625,-0.6875 -3.28125,-0.6875 -1,-2.34375 -1.75,-0.59375 -5.25,-5.0625 -0.59375,-4.3125 L 307.5,116.5 l -1.1875,0.59375 -1.9375,1.5625 -1.9375,-0.59375 -3.34375,1.375 -2.71875,-1.5625 -1.1875,1.5625 -1.75,0.1875 -1.1875,-0.96875 -1.9375,-1.15625 -2.34375,1.5625 -1.375,-1.375 -4.28125,-2.53125 -4.125,-2.15625 -2.125,0.96875 -2.34375,0.59375 -1.5625,-1.1875 -3.125,-1.9375 -2.53125,1.9375 -3.71875,0.40625 -5.28125,-0.40625 -1.1875,-1.9375 -0.75,-1.75 z");
regions["centre"] = map.path("m 247.15625,126.09375 -1.1875,0.96875 0,3.125 -3.90625,1.9375 0,2.9375 -1.15625,1.375 -4.90625,0 -2.3125,-0.96875 -7.0625,3.6875 -2.71875,0 -2.8125,2.6875 0.65625,0.4375 0.1875,3.34375 4.125,3.5 0.375,7.21875 -1.9375,2.34375 -2.9375,0.59375 -2.9375,1.75 0.40625,1.5625 1.34375,1.78125 0,4.625 0.40625,0.0625 L 223.5,171 l -2.3125,2.9375 -1.5625,2.71875 1.9375,1.78125 -0.1875,4.09375 -0.78125,2.71875 -1.96875,0 0,3.71875 -2.71875,3.53125 -2.9375,1.15625 -1.375,1.75 0.96875,2.34375 -5.65625,1.5625 -1.34375,1.96875 -2.375,-1.5625 1.1875,3.90625 -2.15625,0 -3.90625,-2.75 -1.9375,3.90625 0.96875,1.1875 0,1.15625 -1.96875,2.5625 0.21875,4.28125 -3.125,3.71875 -2.21875,8 0.25,0 0.78125,3.125 3.71875,0.78125 0,2.34375 4.6875,1.375 0,3.71875 -0.1875,2.34375 5.84375,0 5.09375,-1.1875 -0.40625,-2.15625 1.5625,-0.96875 1.5625,2.15625 1.375,0.59375 1.15625,4.6875 3.34375,3.5 0.375,2.75 3.53125,3.5 0,3.71875 -0.78125,2.34375 3.71875,2.9375 1.9375,1.9375 3.125,0.40625 1.1875,4.09375 2.125,1.15625 -0.375,2.9375 -1.5625,0.28125 0.5625,0.125 4.90625,0.375 1.75,-1.75 3.125,3.125 3.90625,-4.5 1.75,1.1875 2.34375,-0.21875 0.78125,0.40625 3.53125,0.1875 1.15625,-3.125 9.78125,1.1875 3.71875,0.96875 6.28125,-0.75 0.9375,-2 2.53125,-2.90625 4.875,-1 2.5625,0.78125 2.71875,-2.125 -0.1875,-1.5625 -0.96875,-0.78125 0,-3.125 5.25,-5.28125 1.96875,2.15625 1.75,-1.78125 1.5625,-0.1875 2.71875,-3.5 4.5,0.375 0.0625,1.0625 1.5,-4.78125 -0.96875,-1.75 0.1875,-2.53125 0.59375,-5.09375 -2.15625,-2.125 0.40625,-4.6875 -1.96875,-4.125 -0.1875,-2.71875 -3.53125,-2.75 L 299.5,216.5 l 1.75,-2.53125 0,-3.71875 -2.34375,-2.71875 -0.1875,-1.96875 3.90625,-1.15625 -0.59375,-2.15625 -0.59375,-3.125 -2.53125,-3.5 -0.59375,-2.15625 3.90625,0 2.75,-1.96875 0.375,-2.90625 -1.75,-1.96875 5.09375,-4.28125 0,-3.53125 -2.5625,-2.71875 -0.96875,-3.125 -3.53125,-3.34375 -4.875,2.75 -0.375,-1.5625 -2.15625,-0.1875 -0.59375,1.5625 -1.9375,0.375 -5.28125,-0.1875 -2.15625,1.375 -1.75,-1.5625 3.125,-2.15625 -0.1875,-3.3125 -2.34375,-1.1875 -1.96875,-2.9375 -5.25,-0.375 -2.15625,-1.75 -2.53125,2.34375 -6.25,0.5625 -0.40625,-5.25 L 264.125,157.53125 263.75,155 l -4.09375,-0.78125 -1.78125,-2.15625 -0.5625,-4.3125 -2.34375,-0.375 -0.40625,-2.15625 -2.71875,-1.9375 -1.375,-3.34375 1.375,-2.34375 -1.375,-1.5625 0,-1.9375 0.78125,-2.15625 -1.5625,-1.5625 -0.59375,-2.34375 -1.9375,-1.9375 z");
regions["bourgogne"] = map.path("m 318.4375,157.34375 -1.75,1.34375 -7.625,-0.375 -3.5,1.75 -1.375,2.9375 1.5625,1.75 -2.34375,2.75 -1.78125,2.125 3.53125,3.34375 0.96875,3.125 2.5625,2.71875 0,3.53125 -5.09375,4.28125 1.75,1.96875 -0.375,2.90625 -2.75,1.96875 -3.90625,0 0.59375,2.15625 2.53125,3.5 0.59375,3.125 0.59375,2.15625 -3.90625,1.15625 0.1875,1.96875 2.34375,2.71875 0,3.71875 -1.75,2.53125 0.5625,2.34375 3.53125,2.75 0.1875,2.71875 1.96875,4.125 -0.40625,4.6875 2.15625,2.125 -0.59375,5.09375 -0.1875,2.53125 0.96875,1.75 -1.5,4.78125 0.125,1.46875 3.34375,1.5625 L 312,255 l 2.125,-1.1875 1.96875,-1.15625 0.40625,1.75 2.90625,0 0.78125,-1.5625 1.75,0.78125 0.59375,2.53125 1.5625,-0.375 3.71875,-5.09375 1.9375,1.375 3.9375,7.40625 0,2.9375 0.96875,1.1875 3.3125,0 1.15625,1.5625 3.125,0 1.375,1.9375 -0.1875,7.625 -4.09375,3.125 -0.0937,0.21875 0.28125,-0.0313 0.59375,0.1875 0.1875,3.125 2.9375,0.59375 0.375,1.375 1.5625,0 2.34375,-1.375 6.25,0.96875 1.1875,1.1875 1.5625,-1.5625 2.15625,0 1.15625,-6.25 0.78125,-0.59375 1.9375,0 2.375,1.5625 1.75,-1.5625 1.15625,1.5625 1.78125,-1.75 2.125,-0.1875 1,3.125 0.75,3.90625 1.375,0.1875 1.1875,-2.75 3.6875,-14.4375 1.375,-2.53125 2.15625,-0.21875 2.15625,1.78125 1.5625,-0.40625 1.9375,-1.375 1.96875,0.40625 1.15625,2.53125 1.125,0.4375 5.125,-0.625 1.96875,-1.5625 -0.78125,-1.1875 -2.34375,-0.78125 -0.21875,-2.71875 1.96875,-1.375 0.78125,-3.3125 -1.75,-3.125 -1.1875,-1.5625 0.59375,-0.59375 0,-1.9375 -1.5625,-1 -0.40625,-1.5625 4.5,-0.5625 0.40625,-1.5625 -1.375,0 -1.15625,-1.375 -2.15625,0 -1.78125,-2.9375 L 392.25,238 l 0.21875,-2.53125 1.34375,-0.78125 -0.1875,-1 -0.375,-1.15625 0.96875,-1.5625 3.3125,-1.5625 0,-1.5625 1.1875,-1.5625 1.15625,-1.5625 -0.375,-1.375 0.5625,-2.15625 0.40625,-3.125 0.78125,0 -0.1875,-1.15625 -0.78125,-0.78125 -0.21875,-3.90625 -1.75,-0.1875 -0.375,-3.125 -2.15625,-1 0.78125,-0.96875 1.1875,-0.375 2.53125,-2.9375 -0.21875,-1.5625 -1.5625,-3.125 -2.3125,-0.40625 -0.8125,1.96875 -4.28125,0.96875 -0.40625,-0.96875 -3.125,-3.90625 -1.75,0.96875 -2.34375,-0.1875 -0.78125,-1.5625 -3.125,0.1875 -0.1875,-3.3125 -1.75,-1.1875 2.53125,-2.71875 -4.5,-6.0625 -3.5,-3.71875 -3.125,-1.75 -5.65625,0 -0.40625,2.53125 -2.53125,1.375 -6.4375,0.1875 -1,2.15625 -1.375,-0.1875 -1.15625,-2.15625 -3.90625,1.96875 -7.8125,-0.40625 -0.96875,-2.15625 -2.15625,-2.90625 -0.375,-3.53125 -3.125,-3.71875 -1.96875,1.375 -3.53125,-2.71875 0.59375,-5.28125 -5.0625,-5.28125 -2.34375,0 -1.375,-1.15625 z");
regions["poitou-charentes"] = map.path("m 188.75,225.6875 -3.71875,3.90625 -1.34375,2.34375 -1.375,-1.15625 -0.59375,-1.375 -5.28125,0.1875 -4.875,0.96875 -5.28125,0.40625 0,2.71875 -2.71875,1.78125 -6.0625,-1.375 -4.09375,1.75 1.9375,2.75 0,2.34375 4.6875,3.90625 -1.15625,2.53125 3.125,3.5 -1.375,1.78125 1.9375,2.90625 0.59375,5.46875 -1.15625,1.5625 1.375,2.34375 -1.375,2.5625 0.1875,1.5625 1.5625,-1.1875 1.9375,1.96875 -2.71875,1.75 L 162,272.75 l -2.15625,0.59375 -2.53125,1.1875 -3.125,-2.34375 -3.71875,1.5625 -1.15625,-3.125 -2.75,0.1875 -5.96875,3.625 1.4375,1.3125 -3.125,2.53125 -0.375,1.96875 -2.9375,0.375 -1.5625,-1.75 -3.90625,-0.375 -0.40625,-1.96875 -2.34375,-1.5625 -3.3125,1.1875 2.15625,3.125 2.71875,0 2.75,1.75 2.15625,1.75 4.09375,-0.1875 0.78125,1.75 2.71875,0.59375 1,2.71875 1.75,0.78125 -0.1875,2.15625 -2.34375,-0.375 -0.78125,1.15625 1.75,2.53125 -0.96875,4.3125 -2.34375,-0.1875 0.1875,2.71875 0.59375,0.96875 -2.75,0 -0.375,-1.5625 1.75,-2.34375 -0.59375,-1.34375 -0.96875,-0.78125 L 136.75,291 l -3.3125,-0.40625 -2.71875,-3.3125 -0.40625,6.84375 4.5,3.3125 0.375,3.71875 0.78125,4.28125 0.40625,4.3125 2.34375,-0.21875 4.09375,3.34375 2.75,1.5625 0.1875,1.9375 2.15625,0.40625 6.25,6.25 1.46875,6.75 5.78125,0 0.96875,-0.96875 0.1875,2.9375 5.09375,0.59375 0.78125,6.25 2.75,0.1875 4.46875,4.5 2.34375,0.375 2.75,-1.375 1.9375,1.375 1.5625,-3.3125 2.15625,-3.71875 3.90625,0.40625 1.9375,-1.78125 3.53125,-3.5 0.1875,-6.84375 9.1875,-6.25 0.1875,-4.6875 2.75,-0.375 1.75,-3.125 1.09375,0.0313 0.65625,-2.96875 1.5625,-0.1875 0.96875,-2.75 1.96875,-0.59375 2.34375,-1.5625 -0.375,-4.875 1.75,-0.59375 3.5,-0.78125 -0.1875,-1.75 -0.59375,-2.71875 -2.71875,-0.21875 -1.5625,-1.75 0.96875,-1.75 0.1875,-5.28125 -1.34375,-1.5625 1.5625,-1.15625 2.53125,-2.9375 4.28125,-0.1875 0,-2.34375 2.15625,-1.78125 5.28125,-0.96875 0.375,-2.9375 -2.125,-1.15625 -1.1875,-4.09375 -3.125,-0.40625 -1.9375,-1.9375 -3.71875,-2.9375 0.78125,-2.34375 0,-3.71875 -3.53125,-3.5 -0.375,-2.75 -3.34375,-3.5 -1.15625,-4.6875 -1.375,-0.59375 -1.5625,-2.15625 -1.5625,0.96875 0.40625,2.15625 -5.09375,1.1875 -5.84375,0 0.1875,-2.34375 0,-3.71875 -4.6875,-1.375 0,-2.34375 -3.71875,-0.78125 -0.78125,-3.125 -1.75,0 z");
regions["limousin"] = map.path("m 256.125,267.875 -1.15625,3.125 -3.53125,-0.1875 -0.78125,-0.40625 -2.34375,0.21875 -1.75,-1.1875 -3.90625,4.5 -3.125,-3.125 -1.75,1.75 -4.90625,-0.375 -0.5625,-0.125 -3.71875,0.6875 -2.15625,1.78125 0,2.34375 -4.28125,0.1875 -2.53125,2.9375 -1.5625,1.15625 1.34375,1.5625 -0.1875,5.28125 -0.96875,1.75 1.5625,1.75 2.71875,0.21875 0.59375,2.71875 0.1875,1.75 -3.5,0.78125 -1.75,0.59375 0.375,4.875 -2.34375,1.5625 -1.96875,0.59375 -0.96875,2.75 -1.5625,0.1875 -0.65625,2.96875 4.5625,0.15625 1,1.9375 -0.8125,2.15625 1.78125,2.34375 1.34375,-0.375 1.375,-1.96875 6.25,0.59375 1,3.90625 4.28125,0.59375 0.96875,1.34375 -2.9375,1.375 1.375,0.96875 4.125,0.59375 1.15625,2.9375 2.15625,1.75 -3.90625,3.53125 0,2.71875 1.5625,0.78125 -1.5625,1.96875 2.15625,1.75 -1.5625,1.9375 1.75,1.1875 4.28125,-0.1875 -0.1875,4.28125 1.625,2.5625 0.59375,-0.0937 4.15625,-1.9375 4.96875,2.21875 3.84375,5.5 2.21875,-0.28125 3.3125,-3.3125 1.09375,1.9375 2.21875,-2.1875 3.03125,0.8125 0.0937,0.65625 2.53125,-1.78125 -0.78125,-1.9375 -1.1875,-1.1875 1.5625,-1.9375 1.5625,0 1,-3.125 0.78125,-1.5625 -0.59375,-3.53125 2.53125,-3.5 3.53125,-2.15625 0.1875,-5.46875 1.75,0.96875 1.96875,2.15625 1.9375,0 1.1875,-1.375 -0.96875,-2.34375 0.96875,-3.5 -0.59375,-3.3125 -1.1875,-1.375 0,-2.75 1.78125,-2.90625 -0.40625,-2.75 -4.5,-4.5 -0.375,-1.75 3.71875,-2.15625 2.15625,-1.15625 0.5625,-2.75 2.34375,-1.75 L 288.9375,291.5 287.375,289.5625 287,283.5 l -2.15625,-5.0625 -2.15625,-0.78125 -1.5625,-2.75 -1.375,1.75 -1.34375,-1.75 0,-2.34375 -2.34375,-3.3125 -6.4375,0.78125 -3.71875,-0.96875 -9.78125,-1.1875 z");
regions["aquitaine"] = map.path("m 209.84375,310.46875 -1.75,3.125 -2.75,0.375 -0.1875,4.6875 -9.1875,6.25 -0.1875,6.84375 -3.53125,3.5 -1.9375,1.78125 -3.90625,-0.40625 -2.15625,3.71875 -1.5625,3.3125 -1.9375,-1.375 -2.75,1.375 -2.34375,-0.375 -4.46875,-4.5 -2.75,-0.1875 -0.78125,-6.25 -5.09375,-0.59375 -0.1875,-2.9375 -0.96875,0.96875 -5.78125,0 0.28125,1.25 1.375,5.65625 0.375,5.65625 -0.96875,1.5625 -0.96875,-4.6875 -2.75,-10.71875 -9.96875,-9 0.21875,-4.09375 -1.96875,-0.1875 -3.125,4.6875 -0.96875,16.40625 -2.53125,16.59375 -1.78125,12.875 -0.1875,3.34375 1.375,-4.5 2.71875,-3.53125 3.90625,3.53125 0.40625,1.15625 1.15625,1.5625 -4.875,0.21875 -0.78125,-1.1875 -1.9375,0.78125 -0.40625,2.9375 -2.15625,2.9375 0,4.46875 -3.5,18.75 -4.5,17.1875 -1.375,6.65625 -1.15625,4.6875 -3.71875,6.4375 -4.5,5.46875 -3.5,1.375 -2.53125,0.375 0,2.15625 2.34375,2.15625 3.5,0.1875 0.1875,2.53125 2.75,0.21875 0.78125,-1.78125 3.71875,1.5625 2.34375,0.59375 0.5625,2.34375 -1.34375,1.1875 0,3.6875 -2.75,1.375 -0.1875,1.75 1.75,1.96875 3.125,0.96875 0.59375,-2.9375 1.75,-1.9375 -0.1875,2.53125 1.375,1.96875 3.5,0 1.5625,2.125 4.6875,0.78125 4.5,2.75 7.40625,0 0.40625,4.09375 5.0625,3.90625 1.96875,2.34375 2.15625,-1.15625 1.9375,-0.40625 0.96875,0.96875 1.78125,-0.96875 3.40625,-1.875 0.3125,-4.03125 1.5625,-1.1875 0.8125,-6.4375 2.90625,0.59375 1.1875,-0.78125 -1.375,-2.75 5.28125,-4.5 3.125,-7.03125 1.9375,-2.53125 -2.34375,-3.5 -1.5625,-2.34375 2.15625,-1.96875 -3.3125,-5.46875 -5.28125,-0.375 -1.5625,-2.75 1.375,-3.71875 1.9375,-2.53125 -0.59375,-3.3125 1.5625,-1.5625 -2.3125,-3.90625 1.9375,-2.34375 2.15625,-0.40625 1.9375,0.78125 2.75,-2.34375 0.96875,2.9375 0.96875,1.375 2.15625,-0.59375 -0.1875,-2.53125 1.375,-2.9375 2.3125,1.96875 3.125,-3.125 1.375,1.9375 3.3125,-0.59375 3.53125,-0.375 1.5625,-2.75 5.84375,-0.5625 2.9375,2.90625 1,-0.96875 1.9375,-0.59375 -0.78125,-2.71875 2.9375,-0.78125 3.71875,-0.78125 -0.8125,-2.34375 1.1875,-1.375 0.96875,-3.71875 -2.15625,-2.34375 1.375,-4.46875 2.9375,1.75 4.3125,-0.78125 -1.96875,-4.3125 -1.5625,-5.84375 3.90625,-0.1875 0.96875,-2.5625 1.78125,-1.75 0.1875,-2.9375 4.28125,-0.375 2.75,-3.90625 -1.1875,-0.40625 -0.1875,-2.125 3.3125,-0.40625 0.21875,-1.9375 1.5625,-1 1.75,-3.125 -1.75,-1.9375 0,-2.15625 1.34375,-1.15625 -1.75,-2.75 0.1875,-4.28125 -4.28125,0.1875 -1.75,-1.1875 1.5625,-1.9375 -2.15625,-1.75 1.5625,-1.96875 -1.5625,-0.78125 0,-2.71875 3.90625,-3.53125 -2.15625,-1.75 -1.15625,-2.9375 -4.125,-0.59375 -1.375,-0.96875 2.9375,-1.375 -0.96875,-1.34375 -4.28125,-0.59375 -1,-3.90625 -6.25,-0.59375 -1.375,1.96875 -1.34375,0.375 -1.78125,-2.34375 0.8125,-2.15625 -1,-1.9375 -5.65625,-0.1875 z");
regions["midi-pyrenees"] = map.path("m 247.46875,347.3125 -4.15625,1.9375 -0.59375,0.0937 0.125,0.1875 -1.34375,1.15625 0,2.15625 1.75,1.9375 -1.75,3.125 -1.5625,1 -0.21875,1.9375 -3.3125,0.40625 0.1875,2.125 1.1875,0.40625 -2.75,3.90625 -4.28125,0.375 -0.1875,2.9375 -1.78125,1.75 -0.96875,2.5625 -3.90625,0.1875 1.5625,5.84375 1.96875,4.3125 -4.3125,0.78125 -2.9375,-1.75 -1.375,4.46875 2.15625,2.34375 -0.96875,3.71875 -1.1875,1.375 0.8125,2.34375 -3.71875,0.78125 -2.9375,0.78125 0.78125,2.71875 -1.9375,0.59375 -1,0.96875 -2.9375,-2.90625 -5.84375,0.5625 -1.5625,2.75 -3.53125,0.375 -3.3125,0.59375 -1.375,-1.9375 -3.125,3.125 -2.3125,-1.96875 -1.375,2.9375 0.1875,2.53125 -2.15625,0.59375 -0.96875,-1.375 -0.96875,-2.9375 -2.75,2.34375 -1.9375,-0.78125 -2.15625,0.40625 -1.9375,2.34375 2.3125,3.90625 -1.5625,1.5625 0.59375,3.3125 -1.9375,2.53125 -1.375,3.71875 1.5625,2.75 5.28125,0.375 3.3125,5.46875 -2.15625,1.96875 1.5625,2.34375 2.34375,3.5 -1.9375,2.53125 -3.125,7.03125 -5.28125,4.5 1.375,2.75 -1.1875,0.78125 -2.90625,-0.59375 -0.8125,6.4375 -1.5625,1.1875 -0.3125,4.03125 0.5,-0.28125 3.3125,1.96875 3.90625,2.9375 0.375,2.34375 3.125,2.53125 2.5625,0 6.4375,-2.75 2.71875,3.125 3.71875,1 1.375,-2.34375 1.75,0.78125 11.71875,0.78125 0.40625,-9.59375 2.71875,0.40625 5.09375,2.9375 6.03125,1.15625 2.5625,0 3.3125,4.3125 8.40625,-0.40625 3.3125,5.28125 2.9375,-1.1875 8.59375,1.1875 0.625,3.59375 6.0625,-1.40625 2.21875,-1.9375 3.3125,-0.84375 0.8125,-1.65625 7.1875,-0.53125 -4.40625,-5.25 -3.59375,1.9375 -6.34375,-5.25 1.375,-1.9375 4.96875,0 -0.5625,-4.6875 0,-3.59375 -0.8125,-6.65625 -9.6875,-4.6875 0.5625,-1.65625 -2.21875,-2.46875 2.5,-1.125 0.53125,-3.03125 3.0625,-1.375 -0.84375,-1.9375 2.78125,-2.5 1.375,2.5 4.125,-1.375 1.9375,-0.28125 -0.28125,1.375 3.875,0 3.59375,1.125 0.28125,-3.59375 1.65625,0 6.0625,1.09375 5.8125,0 4.40625,-1.375 1.125,-3.59375 -3.03125,-2.78125 0.8125,-2.75 1.65625,-2.46875 2.75,1.90625 7.1875,-2.46875 1.125,-2.21875 1.65625,0 3.3125,0 -0.28125,-5.78125 0,-1.9375 1.65625,0 3.03125,1.65625 3.03125,0 -0.53125,-3.3125 1.65625,-1.40625 3.3125,-0.53125 0,-2.78125 3.59375,-1.65625 -0.84375,-3.84375 -3.03125,0 -2.75,-0.5625 -0.5625,-2.21875 2.21875,-0.53125 0,-2.78125 2.1875,-1.9375 -1.65625,-0.8125 -4.6875,0.8125 0.28125,-2.1875 -3.3125,-1.40625 -0.84375,-6.625 0,-4.6875 -2.75,-1.9375 0.28125,-3.875 -5.8125,-7.15625 -0.5625,-5.53125 -1.90625,0 -0.84375,-5.53125 -3.875,0.5625 -0.53125,-3.59375 -0.5625,-0.84375 -5.53125,4.71875 0,4.6875 -1.375,0 -0.5625,4.40625 -1.375,0.5625 -1.09375,2.46875 -6.09375,0 -0.53125,-0.8125 -2.78125,0 -1.65625,2.75 -2.1875,-0.28125 1.09375,-3.3125 -2.5,-1.09375 2.5,-5.8125 -3.3125,-2.46875 -1.125,-7.1875 -3.03125,-0.8125 -2.21875,2.1875 -1.09375,-1.9375 -3.3125,3.3125 -2.21875,0.28125 -3.84375,-5.5 -4.96875,-2.21875 z");
regions["languedoc-roussillon"] = map.path("m 320.78125,352.25 -5.46875,1.96875 -1.5625,3.5 -3.5,-2.34375 -2.75,8.59375 -2.8125,6.46875 4.09375,5.03125 -0.28125,3.875 2.75,1.9375 0,4.6875 0.84375,6.625 3.3125,1.40625 -0.28125,2.1875 4.6875,-0.8125 1.65625,0.8125 -2.1875,1.9375 0,2.78125 -2.21875,0.53125 0.5625,2.21875 2.75,0.5625 3.03125,0 0.84375,3.84375 -3.59375,1.65625 0,2.78125 -3.3125,0.53125 -1.65625,1.40625 0.53125,3.3125 -3.03125,0 -3.03125,-1.65625 -1.65625,0 0,1.9375 0.28125,5.78125 -3.3125,0 -1.65625,0 -1.125,2.21875 -7.1875,2.46875 -2.75,-1.90625 -1.65625,2.46875 -0.8125,2.75 3.03125,2.78125 -1.125,3.59375 -4.40625,1.375 -5.8125,0 -6.0625,-1.09375 -1.65625,0 -0.28125,3.59375 -3.59375,-1.125 -3.875,0 0.28125,-1.375 -1.9375,0.28125 -4.125,1.375 -1.375,-2.5 -2.78125,2.5 0.84375,1.9375 -3.0625,1.375 -0.53125,3.03125 -2.5,1.125 2.21875,2.46875 -0.5625,1.65625 9.6875,4.6875 0.8125,6.65625 0,3.59375 0.5625,4.6875 -4.96875,0 -1.375,1.9375 6.34375,5.25 3.59375,-1.9375 4.40625,5.25 -7.1875,0.53125 -0.8125,1.65625 -3.3125,0.84375 -2.21875,1.9375 -6.0625,1.40625 0.34375,2.0625 2.9375,2.75 5.84375,1.5625 0.1875,3.5 3.125,2.75 2.34375,-0.40625 3.34375,-4.09375 4.09375,-0.78125 6.4375,2.15625 5.46875,4.6875 1.5625,-1.96875 1.375,0 1.375,0.96875 1.15625,-0.5625 0.1875,-2.75 5.875,-1.375 1.9375,-2.53125 2.9375,-0.96875 4.09375,0 2.5625,2.71875 3.125,0.21875 0,-3.125 -1.5625,-2.15625 -2.75,-1.1875 -0.59375,-22.65625 0.21875,-6.4375 -2.34375,0.1875 -1.96875,-2.90625 1.5625,-2.5625 3.3125,3.125 2.9375,-2.34375 1.96875,-1.9375 0.375,-3.125 7.03125,-2.15625 0.78125,-1.75 5.46875,-0.1875 1.75,-2.15625 10.5625,-8.40625 6.625,-4.6875 5.6875,0.40625 0,3.90625 4.46875,-0.21875 2.40625,0.125 1.75,-4.0625 6.34375,-3.875 -1.375,-1.9375 1.65625,-4.40625 5.78125,0.8125 1.40625,-10.5 7.71875,-4.40625 0,-2.5 -5.8125,-5.78125 0,-4.4375 -3.3125,-5.5 -6.90625,-3.875 -0.53125,3.03125 -2.78125,0.28125 -0.8125,-3.03125 -2.78125,0.53125 -0.53125,3.875 -2.21875,-0.8125 -4.6875,-3.0625 -2.21875,1.125 0,-5.53125 -4.15625,-2.5 0.5625,-4.125 -3.3125,-3.59375 -1.375,-7.1875 -4.96875,-6.34375 -3.625,0.875 -0.78125,-2.71875 -1.96875,0 -0.375,2.34375 -5.0625,1.5625 -3.53125,-9 z");
regions["provence-alpes-cote-dazur"] = map.path("m 447.34375,339.15625 -1.75,0.78125 -0.40625,2.9375 -3.5,0.40625 -0.59375,-2.75 -1.15625,-1.15625 -3.53125,0.375 -1.375,1.1875 -0.78125,4.09375 0.59375,0.96875 4.09375,0.40625 0.78125,2.53125 1.5625,0.78125 0,4.28125 -3.71875,-0.1875 -1.5625,1.75 -4.46875,-0.78125 -2.53125,2.15625 -1.78125,-0.78125 -2.53125,1.96875 0.96875,1.75 -1.5625,1.5625 -4.875,0 0,2.34375 1.5625,0.78125 -0.59375,1.375 -3.3125,1.34375 -4.09375,0.40625 -1.1875,3.71875 -0.1875,2.34375 2.15625,1.75 -2.15625,2.53125 -2.71875,-1.375 -3.125,-0.1875 -0.40625,1.75 1.96875,1.375 -2.375,1.5625 0.8125,3.3125 6.625,1.78125 1.1875,2.53125 1.9375,0.375 -0.78125,7.25 -1.15625,-1.375 -1.5625,-1.375 -1,2.9375 -1.75,1.5625 -2.53125,-0.1875 -2.9375,-2.15625 -0.78125,-2.53125 -5.46875,-0.40625 -4.09375,-0.375 -0.40625,-2.34375 1.375,-2.9375 -2.53125,2.15625 -3.90625,-0.40625 -0.78125,-1.375 2.71875,-3.6875 -2.71875,-2.5625 -2.75,0.21875 -2.125,3.3125 0.5625,3.5 3.3125,0.40625 -0.5625,1.5625 -2.5625,0.1875 -2.90625,2.9375 -0.78125,-0.96875 0.5625,-3.90625 -1.15625,-1.375 -5.28125,0.78125 -1.03125,2.09375 0.5625,0.3125 3.3125,5.5 0,4.4375 5.8125,5.78125 0,2.5 -7.71875,4.40625 -1.40625,10.5 -5.78125,-0.8125 -1.65625,4.40625 1.375,1.9375 -6.34375,3.875 -1.75,4.0625 6.1875,0.28125 8.21875,0.59375 1.5625,1.5625 -2.9375,0 -1.9375,3.3125 8.375,1.75 6.65625,-1.15625 -3.53125,-3.34375 2.34375,-1.9375 3.71875,1.5625 1.75,3.71875 11.15625,0.1875 2.90625,-1.1875 0.59375,1.78125 -3.125,2.71875 4.3125,0.1875 -0.78125,1.96875 -1.1875,1.375 9.5625,0 4.6875,1.5625 1,1.34375 3.5,1.5625 0.96875,3.90625 2.15625,0.40625 1.96875,-1.375 3.5,-2.15625 6.0625,0.59375 -0.1875,1.5625 -1.96875,0.96875 4.6875,0.21875 -1.15625,-1.1875 -0.40625,-2.53125 2.53125,-1.75 2.9375,0.96875 1.1875,0.375 0.96875,1.1875 1.375,-0.96875 0.375,-2.5625 1.5625,-1.34375 4.09375,0 1.1875,-1.78125 2.71875,0.78125 3.125,-1.34375 0,-5.09375 -4.09375,0.1875 3.125,-1.9375 1.5625,-2.15625 0.40625,-3.125 5.65625,-0.78125 3.3125,-3.71875 0.1875,-4.46875 3.90625,0.78125 1.375,-1.78125 1.96875,0.40625 0.1875,-6.0625 4.5,-0.375 3.90625,-3.53125 3.5,0 0.1875,-2.15625 3.53125,-2.125 -1.96875,-4.5 2.9375,-2.53125 -0.59375,-2.9375 4.3125,-1.375 1.15625,-4.28125 -0.5625,-2.9375 -1,-1.75 L 496.125,390 l -2.90625,0.21875 -9.1875,3.3125 -2.9375,0 -5.0625,-4.09375 -5.09375,-1.375 -2.9375,0 0,-3.53125 -4.09375,-2.53125 0,-3.90625 2.75,-0.375 -1.5625,-1.375 -1.96875,-0.59375 -0.96875,-2.53125 0.78125,-1.75 3.5,-3.71875 -0.5625,-2.75 2.34375,-2.53125 2.125,0.1875 0,-1.75 -2.71875,-1.375 -0.59375,-5.65625 -2.15625,-0.78125 -2.71875,0.40625 -5.09375,-2.5625 -0.78125,-5.84375 -2.90625,-0.96875 -1,-1.96875 -1.28125,-2.8125 -3.75,-0.1875 z");

for(var regionName in regions) {
    regions[regionName].attr(style);
}

Which produce:

A great advantage of using SVG instead of canvas element is the ability to manipulate drawn figures like a classic DOM element. This way, we are able to add some event listeners on them. Let’s add a hover effect to our regions:

var animationSpeed = 500;
var hoverStyle = {
  fill: "#A8BED5"
}

for(var regionName in regions) {
    (function (region) {
        region.attr(style);

        region[0].addEventListener("mouseover", function() {
            region.animate(hoverStyle, animationSpeed);
        }, true);

        region[0].addEventListener("mouseout", function() {
          region.animate(style, animationSpeed);
        }, true);

    })(regions[regionName]);
}

We iterate through all the regions to draw them and to attach a mouseover and a mouseout events to deal with the hover effect. These extra lines gives the following result:

You may have noticed the closure at line 7. This closure is essential to make this sample working. If you directly attach event inside the for loop, you will always hover the last region. To better understand why, let’s simplify the previous snippet:

// This code does not work
for(var regionName in regions) {
  var region = regions[regionName];
  region[0].addEventListener("mouseover", function() {
    region.animate(hoverStyle, animationSpeed);
  }, true);
}

The region variable is defined outside the event listener. So, its scope is the for loop. So, when the loop iterates, the variable region will be changed, even for the previous added event listeners. That’s why you should imperatively add a closure to avoid scoping issues. You may find a good explanation on the blog of Robert Nyman.

This map is, in its current state, probably useless as you may want to redirect user to another URL on a click on a region. To do so, just add a href attribute to your region. And it will behaves like a link.

Few lines of code and a nice look and feel. Why some people are still using Flash for this kind of stuff? :)

comments powered by Disqus