Mapping Femicides in Chili during period 2016–2018 with NewsPaper Data using Mapbox

5 min readApr 6, 2018

Regions: http://goo.gl/2ADY5K
Comunes: http://goo.gl/gQdwTw

Taking advantage to the great opportunity provided by Mapbox thanks to #mapmadness18, I am going to talk about a project I’ve been recently participating.

PREFACE

Femicides are a latent problem in the world, whose figures in several countries are alarming. It is important to know and cover this issue with responsibility on the part of everyone. In the present work, information analyzed in press articles is collected on the femicides that have occurred in the Chilean territory during the period 2016–2018. The information collected has been standardized, and the main objective is to report on this problem that should be of interest to all.

     In Chili during the period studied has occurried 81 cases

GOALS

Collecting data abut femicides in Chili using news published in relevant Chili press.
Mapping information collected to visualize data conclusions .
Raising awareness of the data in social problems and the usefulness of these in a relevant and latent problem

STAGES OF THE PROJECT

Collect Data: By reading the press articles about cases of femicide during the period under study, a database was created, achieved through collaborative work. In this stage google drive was used, and also a process of cleaning and normalization of the data obtained. (If you’re interesting in the data contact me).

Press Article about a femicide Case. source biobiochile.cl

Data Visualization : In this stage witt the information obtained, we obtanied graphs, maps and other resources , among wich we opted to use Mapbox to implement heat maps with the cases raised in the Chilean territory both at a regional level and in communes.

Infographic about the femicides in Chile

Developing the heat map:

Create an style using Mapbox Studio : Through mapbox studio, we proceeded to create an own style for the project where only the Chilean territory stands out, for which we used several data sets that can be observed highlighted in the image.

By means of a pattern it was established at what level of zoom the regional division is shown and at what level the division of communes

Creating a map in html
To use mapbox api you need import the mapbox library in the head of your html

<script src = 'https: //api.mapbox.com/mapbox-gl-js/v0.44.0/mapbox-gl.js'> </ script><link href = 'https: //api.mapbox.com/mapbox-gl-js/v0.44.0/mapbox-gl.css' rel = 'stylesheet' />

First we create the map object and we initialize it using the mapbox dark style for the background (this will highlight the data):

Code to implement mapbox using javascript and html

Loading the data: After that we load the .geojson files into the map, and use the property to create a heatmap :

map.on('load', function() {
    // Add a geojson point source.
    // Heatmap layers also work with a vector tile source.
    map.addSource('earthquakes', {
        "type": "geojson",
        "data": "chile.geojson"
    });
    map.addLayer({
        "id": "earthquakes-heat",
        "type": "heatmap",
        "source": "earthquakes",
        "maxzoom": 9,
        "paint": {
            // Increase the heatmap weight based on frequency and property magnitude
            "heatmap-weight": [
                "interpolate",
                ["linear"],
                ["get", "mag"],
                0, 0,
                6, 1
            ],
            // Increase the heatmap color weight weight by zoom level
            // heatmap-intensity is a multiplier on top of heatmap-weight
            "heatmap-intensity": [
                "interpolate",
                ["linear"],
                ["zoom"],
                0, 1,
                9, 3
            ],
            // Color ramp for heatmap.  Domain is 0 (low) to 1 (high).
            // Begin color ramp at 0-stop with a 0-transparancy color
            // to create a blur-like effect.
            "heatmap-color": [
                "interpolate",
                ["linear"],
                ["heatmap-density"],
                0, "rgba(33,102,172,0)",
                0.2, "rgb(103,169,207)",
                0.4, "rgb(209,229,240)",
                0.6, "rgb(253,219,199)",
                0.8, "rgb(239,138,98)",
                1, "rgb(178,24,43)"
            ],
            // Adjust the heatmap radius by zoom level
            "heatmap-radius": [
                "interpolate",
                ["linear"],
                ["zoom"],
                0, 2,
                9, 20
            ],
            // Transition from heatmap to circle layer by zoom level
            "heatmap-opacity": [
                "interpolate",
                ["linear"],
                ["zoom"],
                7, 1,
                9, 0
            ],
        }
    }, 'waterway-label');
});

Also we added the Navigations controls

map.addControl(new mapboxgl.NavigationControl());

RESULTS

And finally, here we have the map! This is the final result of our process:

Twitter Post

CONCLUSIONS

The project has just been released, so there are still so many things to improve (especially the ones related with the data visualitation (Web Portal) ). It is also true that as more countries to add , and the volume of the data increases, for this is important a collaborative job, and if you’re interesting about participate in the project, you’re welcome.

In any case, all the tools and resources offered by Mapbox have been a great help to achieve the final result of the project, and the results obtained with Mapbox was great, mapbox is a fundamental tool in the visualization of data, and other areas, due to its powerful tools for the design of maps, visualization, and also the availability of its resources for multiple platforms , so thank you Mapbox!

See you at the next Mapbox-#mapmadness18!

To more information contact me.