Constitución Abierta - Encuentros locales versus participación en elecciones municipales de la Región Metropolitana

encuentros_participacion_metropolitana.json

[
  {
    "comuna": "Santiago",
    "poblacion": 139180,
    "encuentros_10000hab": 69.335,
    "indice_participacion": 68.6176,
    "color": "#717290"
  },
  {
    "comuna": "Cerrillos",
    "poblacion": 51997,
    "encuentros_10000hab": 10.962,
    "indice_participacion": 51.4703,
    "color": "#717290"
  },
  {
    "comuna": "Cerro Navia",
    "poblacion": 103064,
    "encuentros_10000hab": 4.657,
    "indice_participacion": 45.1292,
    "color": "#717290"
  },
  {
    "comuna": "Conchalí",
    "poblacion": 86984,
    "encuentros_10000hab": 11.037,
    "indice_participacion": 56.8633,
    "color": "#717290"
  },
  {
    "comuna": "El Bosque",
    "poblacion": 132573,
    "encuentros_10000hab": 8.75,
    "indice_participacion": 41.6299,
    "color": "#717290"
  },
  {
    "comuna": "Estación Central",
    "poblacion": 91416,
    "encuentros_10000hab": 11.048,
    "indice_participacion": 54.3231,
    "color": "#717290"
  },
  {
    "comuna": "Huechuraba",
    "poblacion": 64436,
    "encuentros_10000hab": 9.777,
    "indice_participacion": 42.7913,
    "color": "#717290"
  },
  {
    "comuna": "Independencia",
    "poblacion": 42814,
    "encuentros_10000hab": 22.423,
    "indice_participacion": 68.5593,
    "color": "#717290"
  },
  {
    "comuna": "La Cisterna",
    "poblacion": 58255,
    "encuentros_10000hab": 11.158,
    "indice_participacion": 59.2876,
    "color": "#717290"
  },
  {
    "comuna": "La Florida",
    "poblacion": 323562,
    "encuentros_10000hab": 8.932,
    "indice_participacion": 37.4942,
    "color": "#717290"
  },
  {
    "comuna": "La Granja",
    "poblacion": 97086,
    "encuentros_10000hab": 5.15,
    "indice_participacion": 40.1757,
    "color": "#717290"
  },
  {
    "comuna": "La Pintana",
    "poblacion": 152565,
    "encuentros_10000hab": 4.392,
    "indice_participacion": 28.2778,
    "color": "#717290"
  },
  {
    "comuna": "La Reina",
    "poblacion": 77244,
    "encuentros_10000hab": 35.472,
    "indice_participacion": 56.5843,
    "color": "#717290"
  },
  {
    "comuna": "Las Condes",
    "poblacion": 238274,
    "encuentros_10000hab": 19.851,
    "indice_participacion": 53.0658,
    "color": "#717290"
  },
  {
    "comuna": "Lo Barnechea",
    "poblacion": 83064,
    "encuentros_10000hab": 11.919,
    "indice_participacion": 41.5005,
    "color": "#717290"
  },
  {
    "comuna": "Lo Espejo",
    "poblacion": 77441,
    "encuentros_10000hab": 7.877,
    "indice_participacion": 47.7925,
    "color": "#717290"
  },
  {
    "comuna": "Lo Prado",
    "poblacion": 73017,
    "encuentros_10000hab": 15.75,
    "indice_participacion": 52.4933,
    "color": "#717290"
  },
  {
    "comuna": "Macul",
    "poblacion": 80607,
    "encuentros_10000hab": 18.485,
    "indice_participacion": 54.566,
    "color": "#717290"
  },
  {
    "comuna": "Maipú",
    "poblacion": 654544,
    "encuentros_10000hab": 3.376,
    "indice_participacion": 20.488,
    "color": "#717290"
  },
  {
    "comuna": "Ñuñoa",
    "poblacion": 123519,
    "encuentros_10000hab": 40.399,
    "indice_participacion": 71.7064,
    "color": "#717290"
  },
  {
    "comuna": "Pedro Aguirre Cerda",
    "poblacion": 75873,
    "encuentros_10000hab": 19.77,
    "indice_participacion": 56.5603,
    "color": "#717290"
  },
  {
    "comuna": "Peñalolén",
    "poblacion": 192217,
    "encuentros_10000hab": 9.416,
    "indice_participacion": 38.1891,
    "color": "#717290"
  },
  {
    "comuna": "Providencia",
    "poblacion": 108741,
    "encuentros_10000hab": 60.327,
    "indice_participacion": 64.2545,
    "color": "#717290"
  },
  {
    "comuna": "Pudahuel",
    "poblacion": 206973,
    "encuentros_10000hab": 3.141,
    "indice_participacion": 28.4467,
    "color": "#717290"
  },
  {
    "comuna": "Quilicura",
    "poblacion": 154585,
    "encuentros_10000hab": 4.464,
    "indice_participacion": 27.6637,
    "color": "#717290"
  },
  {
    "comuna": "Quinta Normal",
    "poblacion": 70949,
    "encuentros_10000hab": 26.075,
    "indice_participacion": 56.2305,
    "color": "#717290"
  },
  {
    "comuna": "Recoleta",
    "poblacion": 100228,
    "encuentros_10000hab": 27.837,
    "indice_participacion": 54.0867,
    "color": "#717290"
  },
  {
    "comuna": "Renca",
    "poblacion": 100676,
    "encuentros_10000hab": 4.668,
    "indice_participacion": 41.6266,
    "color": "#717290"
  },
  {
    "comuna": "San Joaquín",
    "poblacion": 64226,
    "encuentros_10000hab": 10.432,
    "indice_participacion": 54.4764,
    "color": "#717290"
  },
  {
    "comuna": "San Miguel",
    "poblacion": 58490,
    "encuentros_10000hab": 21.713,
    "indice_participacion": 66.6234,
    "color": "#717290"
  },
  {
    "comuna": "San Ramón",
    "poblacion": 65385,
    "encuentros_10000hab": 7.494,
    "indice_participacion": 53.4649,
    "color": "#717290"
  },
  {
    "comuna": "Vitacura",
    "poblacion": 65275,
    "encuentros_10000hab": 27.422,
    "indice_participacion": 75.0303,
    "color": "#717290"
  },
  {
    "comuna": "Puente Alto",
    "poblacion": 561464,
    "encuentros_10000hab": 7.605,
    "indice_participacion": 19.1647,
    "color": "#717290"
  },
  {
    "comuna": "Pirque",
    "poblacion": 17991,
    "encuentros_10000hab": 13.34,
    "indice_participacion": 47.3848,
    "color": "#717290"
  },
  {
    "comuna": "San José De Maipo",
    "poblacion": 11632,
    "encuentros_10000hab": 22.352,
    "indice_participacion": 56.4993,
    "color": "#717290"
  },
  {
    "comuna": "Colina",
    "poblacion": 84107,
    "encuentros_10000hab": 7.609,
    "indice_participacion": 33.9508,
    "color": "#717290"
  },
  {
    "comuna": "Lampa",
    "poblacion": 46979,
    "encuentros_10000hab": 6.173,
    "indice_participacion": 36.3567,
    "color": "#717290"
  },
  {
    "comuna": "Tiltil",
    "poblacion": 12156,
    "encuentros_10000hab": 13.985,
    "indice_participacion": 46.693,
    "color": "#717290"
  },
  {
    "comuna": "San Bernardo",
    "poblacion": 232557,
    "encuentros_10000hab": 4.472,
    "indice_participacion": 32.3955,
    "color": "#717290"
  },
  {
    "comuna": "Buin",
    "poblacion": 56534,
    "encuentros_10000hab": 4.953,
    "indice_participacion": 45.9829,
    "color": "#717290"
  },
  {
    "comuna": "Calera De Tango",
    "poblacion": 20746,
    "encuentros_10000hab": 3.374,
    "indice_participacion": 46.5777,
    "color": "#717290"
  },
  {
    "comuna": "Paine",
    "poblacion": 48929,
    "encuentros_10000hab": 3.883,
    "indice_participacion": 41.5337,
    "color": "#717290"
  },
  {
    "comuna": "Melipilla",
    "poblacion": 81778,
    "encuentros_10000hab": 6.236,
    "indice_participacion": 46.2092,
    "color": "#717290"
  },
  {
    "comuna": "Alhué",
    "poblacion": 3664,
    "encuentros_10000hab": 8.188,
    "indice_participacion": 58.0513,
    "color": "#717290"
  },
  {
    "comuna": "Curacaví",
    "poblacion": 23008,
    "encuentros_10000hab": 5.216,
    "indice_participacion": 47.0315,
    "color": "#717290"
  },
  {
    "comuna": "María Pinto",
    "poblacion": 9081,
    "encuentros_10000hab": 5.506,
    "indice_participacion": 50.3138,
    "color": "#717290"
  },
  {
    "comuna": "San Pedro",
    "poblacion": 6155,
    "encuentros_10000hab": 4.874,
    "indice_participacion": 58.2453,
    "color": "#717290"
  },
  {
    "comuna": "Talagante",
    "poblacion": 57975,
    "encuentros_10000hab": 5.52,
    "indice_participacion": 41.323,
    "color": "#717290"
  },
  {
    "comuna": "El Monte",
    "poblacion": 23389,
    "encuentros_10000hab": 5.558,
    "indice_participacion": 50.0321,
    "color": "#717290"
  },
  {
    "comuna": "Isla De Maipo",
    "poblacion": 24250,
    "encuentros_10000hab": 7.835,
    "indice_participacion": 44.7175,
    "color": "#717290"
  },
  {
    "comuna": "Padre Hurtado",
    "poblacion": 37634,
    "encuentros_10000hab": 3.986,
    "indice_participacion": 40.7424,
    "color": "#717290"
  },
  {
    "comuna": "Peñaflor",
    "poblacion": 64961,
    "encuentros_10000hab": 7.081,
    "indice_participacion": 41.2878,
    "color": "#717290"
  }
]

index.html

<html>
<meta charset="utf-8">

<body>

<div id="encuentros_participacion_metropolitana"></div>

<script src="http://d3plus.org/js/d3.js"></script>
<script src="http://d3plus.org/js/d3plus.js"></script>
<script>
var visualization = d3plus.viz()
  .container("#encuentros_participacion_metropolitana")
  .data("encuentros_participacion_metropolitana.json")
  .type("scatter")
  .width(false)
  .height(500)
  .resize(true)
  .id(["comuna"])
  .size("poblacion")
  .x("encuentros_10000hab")
  .y("indice_participacion")
  .color("color")
  .format({
  "text": function(text, params) {
    if (text === "poblacion") {
      return "Población";
    }
    if (text === "encuentros") {
      return "Encuentros locales";
    }
    if (text === "encuentros_10000hab") {
      return "Encuentros locales por cada 10.000 habitantes";
    }
    if (text === "indice_participacion") {
      return "Porcentaje de participación";
    }
    else {
      return d3plus.string.title(text, params);
    }
  },
  "number": function(number, params) {
    var myLocale = {
      "decimal": ",",
      "thousands": ".",
      "grouping": [3],
      "currency": ["$", ""],
      "dateTime": "%a %b %e %X %Y",
      "date": "%m/%d/%Y",
      "time": "%H:%M:%S",
      "periods": ["AM", "PM"],
      "days": ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
      "shortDays": ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
      "months": ["Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre"],
      "shortMonths": ["Ene", "Feb", "Mar", "Abr", "May", "Jun", "Jul", "Ago", "Sep", "Oct", "Nov", "Dic"]
    };
    var localeFormatter = d3.locale(myLocale);
    var numberFormat = localeFormatter.numberFormat(",.2r");
    var formatted = d3plus.number.format(number, params);
      if (params.key === "encuentros") {
        return numberFormat(number);
      }
      if (params.key === "encuentros_10000hab") {
        return numberFormat(number);
      }
      if (params.key === "poblacion") {
        return numberFormat(number);
      }
      if (params.key === "indice_participacion") {
        return numberFormat(number) + '%';
      }
      else {
        return formatted;
      }
  },
  "locale": "es_ES"
  })
  .font({"family": "Roboto"})
  .title("Encuentros locales versus participación en elecciones municipales de la Región Metropolitana")
  /*.title({"sub":"Considerando comunas con población de más de 10.000 habitantes"})*/
  .tooltip(["encuentros_10000hab"])
  .tooltip({"share": false})
  .legend(false)
  .messages({"branding":true})
  .aggs({"idh":"mean","encuentros_10000hab":"mean"})
  .draw();
</script>

<link rel="stylesheet" href="styles.css" />
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
</body>

</html>

styles.css

p {
    font-family: "Roboto", sans-serif;
}