<commit_before><!DOCTYPE html>
<html>
  <head>
    <title>Le monde vu par le PAP</title>
    <meta charset="utf-8">
    <meta property="og:image" content="placeholder.png">
    <script src="lib/d3.v3.js"></script>
    <script src="lib/colorbrewer.js"></script>
    <script src="lib/topojson.js"></script>
    <script src="cartogram.js"></script>
    <style type="text/css">

      body {
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
        font-size: 14px;
        line-height: 1.4em;
        padding: 0;
        margin: 0;
      }

      #container {
        width: 800px;
        margin: 20px auto;
      }

      h1 {
        font-size: 200%;
        margin: 0 0 15px 0;
      }

      h2 {
        font-size: 160%;
        margin: 0 0 10px 0;
      }

      p {
        margin: 0 0 10px;
      }

      form, form > * {
        margin: 0;
      }

      #status {
        color: #999;
      }

      #map-container {
        height: 500px;
        text-align: center;
        position: relative;
        margin: 20px 0;
      }

      #map {
        display: block;
        position: absolute;
        background: #fff;
        width: 100%;
        height: 100%;
        margin: 0;
      }

      path.state {
        stroke: #666;
        stroke-width: .5;
      }

      path.state:hover {
        stroke: #000;
      }

      form {
        font-size: 120%;
      }

      select {
        font-size: inherit;
      }

      #placeholder {
        position: absolute;
        z-index: -1;
        display: block;
        left: 0;
        top: 0;
      }
      
      .nodisplay {
        display:none;
      }

    </style>
  </head>
  <body>
    <div id="container">
      <h1>Le monde vu par le PAP</h1>
      <p>Distribution géographique des 2 624 449 € du Plan d'Aide à la Publication attribués entre 2008 et 2013.</p>
      <form>
        <p>
          <label>Déformation <select id="field"></select></label>
          <span id="status"></span><br>
        </p>
      </form>
      <div id="map-container">
        <img id="placeholder" alt="placeholder image for old browsers" src="placeholder.png">
        <svg id="map"></svg>
      </div>
    
    
    <div id="about">
        <h2>A propos</h2>
        <p>Ce cartogramme présente la répartition géographique des subventions d'aide à la traduction et
        la publication de livres d'auteurs français ou édités par des éditeurs français chez des éditeurs
        non français. L'échelle de chaque pays est modifiée selon la somme attribuée à l'ensemble des 
        éditeurs de ce pays entre 2008 et 2013. Plus la couleur est rouge, plus la somme reçue par les éditeurs
        du pays concerné est importante.</p>
        <h2>Crédit</h2>
        <p>Ce cartogramme est une réalisation de <a href="http://www.regardscitoyens.org/"><NAME></a>
        pour le <a href="http://www.institutfrancais.com/fr/livre-et-promotion-des-savoirs-0">département du livre</a>
        de l'<a href="http://www.institutfrancais.com/">Intitut Français</a>. Ce travail est librement réutilisable
        sous licence Afero GPL pour les logiciels et ODBL pour les données. L'anamorphie est une adpatation des travaux
        de <a href="http://th-mayer.de/cartogram/"><NAME></a> et 
        <a href="http://prag.ma/code/d3-cartogram/" target="_blank"><NAME></a>, auteur de 
        <a href="https://github.com/shawnbot/d3-cartogram/" target="_blank">cartogram.js</a>, l'implémentation 
        javascript/d3 de <a href="http://chrisman.scg.ulaval.ca/G360/dougenik.pdf" target="_blank">l'algorithme
        de <NAME>, <NAME> et <NAME></a>.</p>
        <p>Ont été utilisé : <a href="http://github.com/mbostock/topojson" target="_blank">TopoJSON</a>, 
        <a href="http://www.geonames.org" target="_blank">geonames.org</a>, <a href="http://d3js.org">d3.js</a>
        et <a href="http://colorbrewer2.org" target="_blank">colorbrewer</a>.</p>
      </div>

      </div>
    <script>
      if (!document.createElementNS) {
        document.getElementsByTagName("form")[0].style.display = "none";
      }

      var percent = (function() {
            var fmt = d3.format('{: }');
            return function(n) { return fmt(n) + "%"; };
          })(),
          fields = [
            {name: "Aucune", id: "none"},
            {name: "Aides accordées (en €)", id: "aide", key: "AIDESACCORDEES", unit: " €"},
            ],
          fieldsById = d3.nest()
            .key(function(d) { return d.id; })
            .rollup(function(d) { return d[0]; })
            .map(fields),
          field = fields[0],
          colors = colorbrewer.YlOrRd[3]
            .map(function(rgb) { return d3.hsl(rgb); });

      var body = d3.select("body"),
          stat = d3.select("#status");

      var fieldSelect = d3.select("#field")
        .on("change", function(e) {
          field = fields[this.selectedIndex];
          location.hash = "#" + [field.id].join("/");
        });
        
      fieldSelect.selectAll("option")
        .data(fields)
        .enter()
        .append("option")
          .attr("value", function(d) { return d.id; })
          .text(function(d) { return d.name; });

      var map = d3.select("#map"),
          zoom = d3.behavior.zoom()
            .translate([-260,-25])
            .scale(1.29)
            //.scaleExtent([0.5, 10.0])
            .on("zoom", updateZoom),
          layer = map.append("g")
            .attr("id", "layer"),
          worldcountries = layer.append("g")
            .attr("id", "worldcountries")
            .selectAll("path");
          layer2 = map.append("g")
            .attr("id","layer2"),
          languages = layer.append("g")
            .attr("id","languages")
            .selectAll("circle");

      // map.call(zoom);
      updateZoom();

      function updateZoom() {
        var scale = zoom.scale();
        layer.attr("transform",
          "translate(" + zoom.translate() + ") " +
          "scale(" + [scale, scale] + ")");
      }

      var proj = d3.geo.mercator(),
          topology,
          geometries,
          rawData,
          dataById = {},
          carto = d3.cartogram()
            .projection(proj)
            .properties(function(d) {
              return dataById[d.id];
            })
            .value(function(d) {
              return +d.properties[field];
            });

      window.onhashchange = function() {
        parseHash();
      };

      var url = ["data",
            "worldcountries.topojson"
          ].join("/");
      d3.json(url, function(topo) {
        topology = topo;
        geometries = topology.objects.worldcountries.geometries;
        //geometries = features.properties.geometry;
        
        
        d3.csv("data/par_pays.csv", function(data) {
          rawData = data;
          dataById = d3.nest()
            .key(function(d) { try { return d.NAME; } catch(e) {return "UNKNOWN"; }})
            .rollup(function(d) {  return d[0]; })
            .map(data);
            init();
        });
      });

      function init() {
        var features = carto.features(topology, geometries),
            path = d3.geo.path()
              .projection(proj);
        worldcountries = worldcountries.data(features)
          .enter()
          .append("path")
            .attr("class", "state")
            .attr("id", function(d) {
              try {
              	return d.properties.NAME;
              }catch(e) {return "UNKNOWN";}
            })
            .attr("fill", "#fafafa")
            .attr("d", path)
            .attr("cursor","pointer");
        worldcountries.append("title");
        languages = languages.data(languagedata)
            .enter()
            .append("circle")
            .attr("class","lg")
            .attr("id",function(d){
                return d.NAME;
            })
            .attr("fill","steelblue")
            .attr("cx", function(d) {
                return proj([d.LON, d.LAT])[0];
            })
            .attr("cy", function(d) {
                return proj([d.LON, d.LAT])[1];
            })
            .attr("r", 0.5)
            .attr("pointer-events","none");
        parseHash();
      }

      function reset() {
        stat.text("");
        body.classed("updating", false);
        
        var features = carto.features(topology, geometries),
            path = d3.geo.path()
              .projection(proj);

        worldcountries.data(features)
          .transition()
            .duration(750)
            .ease("linear")
            .attr("fill", "#fafafa")
            .attr("d", path);

        worldcountries.select("title")
          .text(function(d) {
            try{
            return d.properties['FULLNAME'];
	    }catch(e){
		return "no data";
	    }
          });
          
      }

      function update() {
        var start = Date.now();
        body.classed("updating", true);
        
        d3.select("#languages").classed("nodisplay",true)

        var key = field.key,
            fmt = (typeof field.format === "function")
              ? field.format
              : d3.format(field.format || ","),
            value = function(d) {
              try {
              return +d.properties[key];
	      }catch(e) {return 0;}
            },
            values = worldcountries.data()
              .map(value)
              .filter(function(n) {
                return !isNaN(n);
              })
              .sort(d3.ascending),
            lo = values[0],
            hi = values[values.length - 1];

        var color = d3.scale.linear()
          .range(colors)
          .domain(lo < 0
            ? [lo, 0, hi]
            : [lo, d3.mean(values), hi]);

        // normalize the scale to positive numbers
        var scale = d3.scale.linear()
          .domain([lo, hi])
          .range([10, 1000]);

        // tell the cartogram to use the scaled values
        carto.value(function(d) {
          return scale(value(d));
        });

        // generate the new features, pre-projected
        var features = carto(topology, geometries).features;

        // update the data
        worldcountries.data(features)
          .select("title")
            .text(function(d) {
              try{
              return [d.properties.FULLNAME, value(d)].join(" : ") + field.unit;
              }catch(e){return "No data";}
            });

        worldcountries.transition()
          .duration(2750)
          .ease("linear")
          .attr("fill", function(d) {
            return color(value(d));
          })
          .attr("d", carto.path);

        var delta = (Date.now() - start) / 1000;
        stat.text(["calculé en", delta.toFixed(1), "secondes"].join(" "));
        body.classed("updating", false);
      }

      var deferredUpdate = (function() {
        var timeout;
        return function() {
          var args = arguments;
          clearTimeout(timeout);
          stat.text("Calcul en cours...");
          return timeout = setTimeout(function() {
            update.apply(null, arguments);
          }, 10);
        };
      })();

      var hashish = d3.selectAll("a.hashish")
        .datum(function() {
          return this.href;
        });

      function parseHash() {
        var parts = location.hash.substr(1).split("/"),
            desiredFieldId = parts[0],
            desiredYear = +parts[1];

        field = fieldsById[desiredFieldId] || fields[0];

        fieldSelect.property("selectedIndex", fields.indexOf(field));

        if (field.id === "none") {
          reset();
        } else {
          deferredUpdate();
          location.replace("#" + field.id);
          hashish.attr("href", function(href) {
            return href + location.hash;
          });
        }
      }

    </script>
  </body>
</html>
<commit_msg>Coquilles<commit_after><!DOCTYPE html>
<html>
  <head>
    <title>Le monde vu par le PAP</title>
    <meta charset="utf-8">
    <meta property="og:image" content="placeholder.png">
    <script src="lib/d3.v3.js"></script>
    <script src="lib/colorbrewer.js"></script>
    <script src="lib/topojson.js"></script>
    <script src="cartogram.js"></script>
    <style type="text/css">

      body {
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
        font-size: 14px;
        line-height: 1.4em;
        padding: 0;
        margin: 0;
      }

      #container {
        width: 800px;
        margin: 20px auto;
      }

      h1 {
        font-size: 200%;
        margin: 0 0 15px 0;
      }

      h2 {
        font-size: 160%;
        margin: 0 0 10px 0;
      }

      p {
        margin: 0 0 10px;
      }

      form, form > * {
        margin: 0;
      }

      #status {
        color: #999;
      }

      #map-container {
        height: 500px;
        text-align: center;
        position: relative;
        margin: 20px 0;
      }

      #map {
        display: block;
        position: absolute;
        background: #fff;
        width: 100%;
        height: 100%;
        margin: 0;
      }

      path.state {
        stroke: #666;
        stroke-width: .5;
      }

      path.state:hover {
        stroke: #000;
      }

      form {
        font-size: 120%;
      }

      select {
        font-size: inherit;
      }

      #placeholder {
        position: absolute;
        z-index: -1;
        display: block;
        left: 0;
        top: 0;
      }
      
      .nodisplay {
        display:none;
      }

    </style>
  </head>
  <body>
    <div id="container">
      <h1>Le monde vu par le PAP</h1>
      <p>Distribution géographique des 2 624 449 € du Plan d'Aide à la Publication attribués entre 2008 et 2013.</p>
      <form>
        <p>
          <label>Déformation <select id="field"></select></label>
          <span id="status"></span><br>
        </p>
      </form>
      <div id="map-container">
        <img id="placeholder" alt="placeholder image for old browsers" src="placeholder.png">
        <svg id="map"></svg>
      </div>
    
    
    <div id="about">
        <h2>A propos</h2>
        <p>Ce cartogramme présente la répartition géographique des subventions d'aide à la traduction et
        la publication de livres d'auteurs français ou édités par des éditeurs français chez des éditeurs
        non français. L'échelle de chaque pays est modifiée selon la somme attribuée à l'ensemble des 
        éditeurs de ce pays entre 2008 et 2013. Plus la couleur est rouge, plus la somme reçue par les éditeurs
        du pays concerné est importante.</p>
        <h2>Crédits</h2>
        <p>Ce cartogramme est une réalisation de <a href="http://www.regardscitoyens.org/"><NAME>itoyens</a>
        pour le <a href="http://www.institutfrancais.com/fr/livre-et-promotion-des-savoirs-0">département du livre</a>
        de l'<a href="http://www.institutfrancais.com/">Institut Français</a>. Ce travail est librement réutilisable
        sous licence Afero GPL pour les logiciels et ODBL pour les données. L'anamorphie est une adpatation des travaux
        de <a href="http://th-mayer.de/cartogram/"><NAME></a> et 
        <a href="http://prag.ma/code/d3-cartogram/" target="_blank"><NAME></a>, auteur de 
        <a href="https://github.com/shawnbot/d3-cartogram/" target="_blank">cartogram.js</a>, l'implémentation 
        javascript/d3 de <a href="http://chrisman.scg.ulaval.ca/G360/dougenik.pdf" target="_blank">l'algorithme
        de <NAME>, <NAME> et <NAME></a>.</p>
        <p>Ont été utilisé : <a href="http://github.com/mbostock/topojson" target="_blank">TopoJSON</a>, 
        <a href="http://www.geonames.org" target="_blank">geonames.org</a>, <a href="http://d3js.org">d3.js</a>
        et <a href="http://colorbrewer2.org" target="_blank">colorbrewer</a>.</p>
      </div>

      </div>
    <script>
      if (!document.createElementNS) {
        document.getElementsByTagName("form")[0].style.display = "none";
      }

      var percent = (function() {
            var fmt = d3.format('{: }');
            return function(n) { return fmt(n) + "%"; };
          })(),
          fields = [
            {name: "Aucune", id: "none"},
            {name: "Aides accordées (en €)", id: "aide", key: "AIDESACCORDEES", unit: " €"},
            ],
          fieldsById = d3.nest()
            .key(function(d) { return d.id; })
            .rollup(function(d) { return d[0]; })
            .map(fields),
          field = fields[0],
          colors = colorbrewer.YlOrRd[3]
            .map(function(rgb) { return d3.hsl(rgb); });

      var body = d3.select("body"),
          stat = d3.select("#status");

      var fieldSelect = d3.select("#field")
        .on("change", function(e) {
          field = fields[this.selectedIndex];
          location.hash = "#" + [field.id].join("/");
        });
        
      fieldSelect.selectAll("option")
        .data(fields)
        .enter()
        .append("option")
          .attr("value", function(d) { return d.id; })
          .text(function(d) { return d.name; });

      var map = d3.select("#map"),
          zoom = d3.behavior.zoom()
            .translate([-260,-25])
            .scale(1.29)
            //.scaleExtent([0.5, 10.0])
            .on("zoom", updateZoom),
          layer = map.append("g")
            .attr("id", "layer"),
          worldcountries = layer.append("g")
            .attr("id", "worldcountries")
            .selectAll("path");
          layer2 = map.append("g")
            .attr("id","layer2"),
          languages = layer.append("g")
            .attr("id","languages")
            .selectAll("circle");

      // map.call(zoom);
      updateZoom();

      function updateZoom() {
        var scale = zoom.scale();
        layer.attr("transform",
          "translate(" + zoom.translate() + ") " +
          "scale(" + [scale, scale] + ")");
      }

      var proj = d3.geo.mercator(),
          topology,
          geometries,
          rawData,
          dataById = {},
          carto = d3.cartogram()
            .projection(proj)
            .properties(function(d) {
              return dataById[d.id];
            })
            .value(function(d) {
              return +d.properties[field];
            });

      window.onhashchange = function() {
        parseHash();
      };

      var url = ["data",
            "worldcountries.topojson"
          ].join("/");
      d3.json(url, function(topo) {
        topology = topo;
        geometries = topology.objects.worldcountries.geometries;
        //geometries = features.properties.geometry;
        
        
        d3.csv("data/par_pays.csv", function(data) {
          rawData = data;
          dataById = d3.nest()
            .key(function(d) { try { return d.NAME; } catch(e) {return "UNKNOWN"; }})
            .rollup(function(d) {  return d[0]; })
            .map(data);
            init();
        });
      });

      function init() {
        var features = carto.features(topology, geometries),
            path = d3.geo.path()
              .projection(proj);
        worldcountries = worldcountries.data(features)
          .enter()
          .append("path")
            .attr("class", "state")
            .attr("id", function(d) {
              try {
              	return d.properties.NAME;
              }catch(e) {return "UNKNOWN";}
            })
            .attr("fill", "#fafafa")
            .attr("d", path)
            .attr("cursor","pointer");
        worldcountries.append("title");
        languages = languages.data(languagedata)
            .enter()
            .append("circle")
            .attr("class","lg")
            .attr("id",function(d){
                return d.NAME;
            })
            .attr("fill","steelblue")
            .attr("cx", function(d) {
                return proj([d.LON, d.LAT])[0];
            })
            .attr("cy", function(d) {
                return proj([d.LON, d.LAT])[1];
            })
            .attr("r", 0.5)
            .attr("pointer-events","none");
        parseHash();
      }

      function reset() {
        stat.text("");
        body.classed("updating", false);
        
        var features = carto.features(topology, geometries),
            path = d3.geo.path()
              .projection(proj);

        worldcountries.data(features)
          .transition()
            .duration(750)
            .ease("linear")
            .attr("fill", "#fafafa")
            .attr("d", path);

        worldcountries.select("title")
          .text(function(d) {
            try{
            return d.properties['FULLNAME'];
	    }catch(e){
		return "no data";
	    }
          });
          
      }

      function update() {
        var start = Date.now();
        body.classed("updating", true);
        
        d3.select("#languages").classed("nodisplay",true)

        var key = field.key,
            fmt = (typeof field.format === "function")
              ? field.format
              : d3.format(field.format || ","),
            value = function(d) {
              try {
              return +d.properties[key];
	      }catch(e) {return 0;}
            },
            values = worldcountries.data()
              .map(value)
              .filter(function(n) {
                return !isNaN(n);
              })
              .sort(d3.ascending),
            lo = values[0],
            hi = values[values.length - 1];

        var color = d3.scale.linear()
          .range(colors)
          .domain(lo < 0
            ? [lo, 0, hi]
            : [lo, d3.mean(values), hi]);

        // normalize the scale to positive numbers
        var scale = d3.scale.linear()
          .domain([lo, hi])
          .range([10, 1000]);

        // tell the cartogram to use the scaled values
        carto.value(function(d) {
          return scale(value(d));
        });

        // generate the new features, pre-projected
        var features = carto(topology, geometries).features;

        // update the data
        worldcountries.data(features)
          .select("title")
            .text(function(d) {
              try{
              return [d.properties.FULLNAME, value(d)].join(" : ") + field.unit;
              }catch(e){return "No data";}
            });

        worldcountries.transition()
          .duration(2750)
          .ease("linear")
          .attr("fill", function(d) {
            return color(value(d));
          })
          .attr("d", carto.path);

        var delta = (Date.now() - start) / 1000;
        stat.text(["calculé en", delta.toFixed(1), "secondes"].join(" "));
        body.classed("updating", false);
      }

      var deferredUpdate = (function() {
        var timeout;
        return function() {
          var args = arguments;
          clearTimeout(timeout);
          stat.text("Calcul en cours...");
          return timeout = setTimeout(function() {
            update.apply(null, arguments);
          }, 10);
        };
      })();

      var hashish = d3.selectAll("a.hashish")
        .datum(function() {
          return this.href;
        });

      function parseHash() {
        var parts = location.hash.substr(1).split("/"),
            desiredFieldId = parts[0],
            desiredYear = +parts[1];

        field = fieldsById[desiredFieldId] || fields[0];

        fieldSelect.property("selectedIndex", fields.indexOf(field));

        if (field.id === "none") {
          reset();
        } else {
          deferredUpdate();
          location.replace("#" + field.id);
          hashish.attr("href", function(href) {
            return href + location.hash;
          });
        }
      }

    </script>
  </body>
</html>

{'fraction_non_alphanumeric': 0.15416578333686665, 'fraction_numerical': 0.015263938944244222, 'mean_word_length': 1.6244575497941471, 'pattern_counts': {'":': 0, '<': 175, '<?xml version=': 0, '>': 175, 'https://': 2, 'lorem ipsum': 0, 'www.': 8, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4591685', 'n_tokens_mistral': 7507, 'n_tokens_neox': 7176, 'n_words': 1488}