Featured Posts

Impossible Maps | The Death Map of the 1965 Communist Genocide in Aceh

Links:

http://165.227.205.200/impossiblemaps/week2

https://github.com/hafiyyandi/impossiblemaps/tree/master/week2

The Death Map

For this week's assignment, I decided to redraw the maps featured in Jess Melvin's paper on the 1965 communist "genocide" in Indonesia. Melvin found a new evidence on the military's involvement in inciting (and implied coercing) the public to kill those suspected as and/or related to a communist party (PKI) member.

//Side note: the wikipedia page & a documentary for more context.

There are several maps that were featured:

The original military map of death count and strategic markings

Redrawn map. Light grey means the visit of a military general and dark grey marks the start of the killings.

My process in developing/designing the map is as following:

  1. Writing the data in GeoJSON

  2. Designing the interaction

  3. Writing the code

1. Writing the data in GeoJSON

The available data set is not written in GeoJSON, so I had to write my own file. I tried to find the coordinates of the places marked in the original map with geojson.io, and cross-checked it with the most current map and the wiki page of Aceh.

After, I identified the important properties that I want to use in the map and annotated these onto the JSON file:

  • Name of town & regency

  • Date of General Djuarsa's visit

  • Start date of the killing

  • Death count

Here is the data in GeoJSON format:

features": [ { "type": "Feature", "properties": { "city": "Pidie", "region": "Southwest Aceh", "start": 15, "killcount": 314 }, "geometry": { "type": "Point", "coordinates": [ 96.339111328125, 4.937724274302492 ] } }

2. Designing the Interaction

Next, I decided on the story I want to tell with the map. One of the main points in the paper is that the killings only started after General Djuarsa visited these towns. So my map has to show the chronology/timeline of his visits and when the killings started to happen.

The next part is to show the death count in this regions. One simple idea that I had is to use color and size to represent the count.

I decided to only show the numerical count and total death count when user slides to the end, so that they can understand the chronology first before digesting the full information.

Lastly, I wanted to have a pop-up that shows all the relevant data points.

3. Writing the Code

//Source: https://github.com/hafiyyandi/impossiblemaps/tree/master/week2

There are 4 layers in this map:

  1. Blue dots (circle): Djuarsa's visit

  2. Transparent circles (circle): start of killing

  3. Opaque circle (circle): final death count

  4. Numerical count (symbol): final death count

Layer 3 & 4 are only added when the slider hits the end and are removed otherwise.

For filtering the map using a slider, I found an interactive timeline tutorial on MapboxGL documentation, and adapted the code.

This is the code snippet:

document.getElementById('slider').addEventListener('input', function(e) { var date = parseInt(e.target.value, 10); filterBy(date); });

function filterBy(date) {

var startfilters = ['<=', 'start', currentdate]; map.setFilter('killings', startfilters); var visitfilters = ['<=', 'visit', currentdate]; map.setFilter('visits', visitfilters);

}

And for the pop up, I adapted the code from Mapbox's popup tutorial.

Some Reflections

I am somewhat unsure if I did a good enough job reinterpreting the map.

First, I think it would make more sense to color the different region/district instead of using circles. The exact coordinates of the circles don't really mean much, as the numbers in the original military map are aggregates. Also, I had to eyeball the locations in geojson.io.

Second, i feel that the visual representation of the murder victims is not impactful enough. It doesn't communicate the horror and the scale sufficiently. Maybe it would look more meaningful with a different color, or if I used repeated icons instead of varying the size of circles.

#ImpossibleMaps #mapboxgljs #DataVisualization

Related Posts
Recent Posts
Search By Tags
No tags yet.

Hafiyyandi | Creative Technologist

New York, New York | hafiyyandi@gmail.com