# HG changeset patch
# User nowmad@nowmads-macbook-pro.local
# Date 1453478973 -3600
# Node ID 30de363937ce8b8adb0345a1c4555dacdd307736
# Parent  63b9014bb58bd5c67f4edbdfbdf65e666b6afe1d
add doc about visualization

diff -r 63b9014bb58b -r 30de363937ce cms/app-client/README.md
--- a/cms/app-client/README.md	Fri Jan 22 16:17:52 2016 +0100
+++ b/cms/app-client/README.md	Fri Jan 22 17:09:33 2016 +0100
@@ -47,3 +47,46 @@
 **However** it doesn't allow the use of `this.store.findRecord(...)` function. In our case it won't trigger the api request for the full document information (therefore doesn't get the sound urls). --> **Only use for testing**
 
   * `RESTAdapter`: The Common way of plugging in Ember with a Rest server.
+
+## visualizations
+
+### "Langues"
+
+It use D3js and the implementation by [Mike Bostock](http://bost.ocks.org/mike/treemap/) customized to fit our needs.
+The json used to build the treemap follows this example (can be find in `public/langues.json`):
+```json
+{
+ "name": "Global",
+ "children": [
+  {
+    "id": "id de langue (code Lexvo de la langues)",
+    "name": "Français",
+    "color": "lightblue",
+    "value": 859
+  },
+  {
+    "name": "Wallis et Futuna",
+    "value": 43,
+    "children": [
+      {
+        "name": "LanEast Futuna (fud)",
+        "value": 23
+      },
+      {
+        "name": "Wallisian (wls)",
+        "value": 20
+      }
+    ]
+  }
+ ]
+}
+```
+A `color` attribute can be add to each node.
+
+### "Carthographie"
+
+It use the [Ammap](https://www.amcharts.com/javascript-maps/) library.
+
+It also uses a JSON to describe the areas. It is possible to get the bounding box of the country clicked, however it is a rectangle and isn't as precise as the SVG path.
+
+It seems to use the `ISO 3166-1` country naming convention ("US", "FR", "BZ", etc.)