Recreating Nightingale's rose diagram

Thu, 04/03/2010 - 13:32 | by richshaw
"Rose" diagram

Data visualisation has been my pursuit of choice over the past few weeks, this has involved a lot reading, trying to teach my self how to draw and eating of cake. One of the most interesting stories about graphs I've come across, involves and the diagrams she used to highlight the adverse effect of unhygienic conditions in the army.

As part of the whole data visualisation thing I've being having a bit of a play with a data visualisation framework called Processing. Processing is somewhat awesome because it allows you build any type of data visualisation you could possibly imagine using the data you give it.

To help me learn Processing I though I would have a bash at recreating one of Nightingale's charts. The chart produced is pretty basic and took me less than an hour to put together, it probably would have been alot quicker, but I hadn't really used Processing before and had to go through a couple of examples to get me head round it. The diagram is based on: 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

 /*
 * Nightingales rose diagram
 *
 */
size(1200, 1200);
background(#ffffff,255);
noStroke(); 
smooth();
 
//Our dataset
//Note http://bit.ly/b7YGq2 page 18
//Per 1000 deaths/total soliders * 12000
//April 1854 - March 1855
 
int[][] data = { //Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec,Jan,Feb,Mar 
                {1,6,5,150,329,312,197,341,632,1023,823,480}, //Zymotic Diseases
                {7,5,3,10,12,30,50,43,48,120,140,69}, // All other causes
                {0,0,0,0,0,32,52,116,42,31,16,13}, //Wounds & injuries
};
 
/*
//April 1855 - March 1856
int[][] data = { //Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec,Jan,Feb,Mar 
                {178,172,248,108,130,48,33,56,25,11,7,4}, //Zymotic Diseases
                {18,17,65,37,44,69,14,11,5,0,0,0}, // All other causes
                {21,12,10,9,7,5,5,10,8,13,5,9}, //Wounds & injuries
};
*/
//Data series colors
int[] colour = {#2FA2FF,#000000,#BF001A}; 
//Sets starting angle
float lastAng = radians(180);
 
//for each dataset
for (int i = 0; i < data.length; i++){
  //for each data point
  for (int ii = 0; ii < data[i].length; ii++) {
    fill(colour[i]);
    //Note http://understandinguncertainty.org/node/214
    //float area = (PI * sq(radius))/12;
    float rad = 12 * (sqrt(data[i][ii]) / PI);
    /**
    *Drawing an arc
    *arc(x,y,width, height, start, finish)
    */
    arc(width/2, height/3, rad*7, rad*7 , lastAng, lastAng+radians(30));
    //There are 12 months in the year so 360 / 12 = 30
    lastAng += radians(30);
  }  
}
//Save the rendered image
save("nightingale.png");
println("PNG saved.");

Ooops

Has I write this I've noticed a bit a cock up with the code above which means some wedge segments won't display correctly and the data in the arrays is slightly wrong. Ah, well it's a first attempt. I'll post a improved/correct version in the near future.

  • "share"
Tags: