Connections

The question was posed: Where does ICHEC fit into the research landscape in Ireland?

To begin to answer this question it is important to understand some terminology. In Ireland there are seven universities, 13 institutes of technology, colleges of education, independent and further educations centres and other national research institutions such as the Dublin Institute for Advanced Studies. Staff and students of these institutions can gain access to ICHEC general-purpose computing resources (Stokes and Stoney) by submitting a project and are termed users.

Projects differ by size, class, and domain, for example, a small "Discovery" (Class C) project in the chemistry domain with three users or a large multi-year "Grand Challenge" (Class A) project in engineering with 10 users. Further details of the Full National Service can be found here. Also, ICHEC has numerous computational scientists, staff, that support the users during the course of their project.

So in summary there are users, project classes (A,B,C), project domains (Physics, Chemistry, Earth Science, Maths, Astrophysics, Engineering, Life Sciences, Computing) staff, Institutions, and ICHEC. The challenge was to represent these data in a single info-graphic. The protovis diagram above is the result and an explanation of its creation is described below.

But to answer the original question, ICHEC stands at the heart of computational research in Ireland.

Graphic Description

This diagram is an undirected graph that illustrates the connections or edges, between nodes: ICHEC, the Irish academic institutes, staff, users and project class and domain. Readers of graph theory will understand the concept of nodes and edges. The layout of the graph is carried out using a Force based algorithm from protovis. This graphic is an extension of the protovis force based example.
ICHEC is represented by a grey circle in the centre if the diagram. Institutions are colour coded diamonds.
The ICHEC staff and end users are shown in black using triangles and ticks respectively. The size of the symbols reflects the number of projects that staff member or user is involved in.
Projects are shown as circles colour coded depending on the particular domain, e.g. physics projects are shown as blue circles. The size of the circles reflects the project class. The larger circles are class A projects.
The graph is interactive - nodes (institutions/users/staff/projects) can be moved by dragging them. Placing your cursor over the nodes reveals the name of that node.

Graphic Development

The challenge in preparing this graph was to manipulate data so that the protovis javascript library could be used. Information for all projects that ran on the ICHEC machines during 2010 was extracted from our internal databases. Project name, title, PI, members, domain, and class was obtained. This information was processed using a python script and outputted a javascript file with the following form:


var ICHEC2010 = {
  nodes:[
    {nodeName:"TCD", group:1},
    {nodeName:"ICHEC", group:5},
    {nodeName:"Martin Peters", group:2},
    {nodeName:"Giorgio Carta", group:4, domain:2},
    {nodeName:"tcche018c", group:3, domain:2, cl:1}
  ],

  links:[
    {source:0, target:10, value:1},
    {source:1, target:10, value:1},
    {source:2, target:10, value:1},
  ]
};

There was 510 nodes and 750 edges in total. Each node was given a group variable with the following definitions:

Institutions	1
Staff	2
Project	3
User	4
ICHEC	5

Users and project were given a domain variable with the following definitions:

Physics	1
Chemistry	2
Earth Science	3
Maths	4
Astrophysics	5
Engineering	6
Life Sciences	7
Computing	8

Finally projects were also given a cl variable to distinguish between A, B and C:

A	10
B	5
C	1

The connections between staff, users, projects, institutes and ICHEC were defined with links as shown in the code above. Each edge or link as a source and target. These numbers are the indices of each in the nodes array. The value of one describes it as a single connection.

Code Description

The following code snippets put together produced the diagram above. The first part of the process is to set up the size of the graph and define the colour scheme to be used:


  var    w = 750, // width
         h = 650, // height
    colors = pv.Colors.category20();
  groupColours = pv.colors("red", "orange", "yellow", "green", "blue", "violet");

Then each institute and domain were also given a colour:


  var instituteColours = {
    "TCD"    : colors(1),
    "UCD"    : colors(2),
    "DCU"    : colors(3),
    "UCC"    : colors(4),
    "Tyndall": colors(5),
    "NUIG"   : colors(6),
    "NUIM"   : colors(7),
    "DIAS"   : colors(8),
    "RCSI"   : colors(9),
    "UL"     : colors(10),
    "ITS"    : colors(11),
    "TG"     : colors(12),
    "DIT"    : colors(14),
    "ICHEC"  : colors(13),
  };

  var domains = {
    "Physics"       : colors(1),
    "Chemistry"     : colors(2),
    "Earth Science" : colors(3),
    "Maths"         : colors(4),
    "Astrophysics"  : colors(5),
    "Engineering"   : colors(6),
    "Life Sciences" : colors(7),
    "Computing"     : colors(8)
  };

A couple of functions were created to generate different coloured, sized and shaped symbols depending on the node variables:


  var col = function(g, d, n) {
    if (g == 1) { // institutes
      return instituteColours[n];
    }
    if (g == 2) { // staff
      return "black";
    }
    if (g == 3) {
      return colors(d);
    }
    if (g == 4) { // users
      return "black";
    }
    if (g == 5) { // ICHEC
      return "grey";
    }
    return colors(d);
  };

  nodeSize = function(g, c, ld, s) {
    if (g == 5) { // ICHEC
      return (ld + 100) * (Math.pow(s, -1.5));
    }
    if (g == 1) { // institues
      return (ld + 8) * (Math.pow(s, -1.5));
    }
    if (g == 2) { // staff
      return (ld + 5) * (Math.pow(s, -1.5));
    }
    if (g == 3) { // project
      return ((5 * c)) * (Math.pow(s, -1.5));
    }
    return (ld + 2) * (Math.pow(s, -1.5));
  };

  nodeShape = function(g, c) {
    if (g == 5) { // ICHEC
      return "circle";
    }
    if (g == 1) { // institutes
      return "diamond";
    }
    if (g == 2) { // staff
      return "triangle";
    }
    if (g == 4) { // users
      return "cross";
    }
    return "circle";
  };

The graph was then ready to be created using the variables described above:


  var vis = new pv.Panel()
    .width(w)
    .height(h)
    .fillStyle("white");

  var force = vis.add(pv.Layout.Force)
    .nodes(ICHEC2010.nodes)
    .links(ICHEC2010.links);

  force.link.add(pv.Line);

The shape, size, and colour of the nodes was defined using the functions above:


  force.node.add(pv.Dot)
    .shape(function(d) nodeShape(d.group, d.cl))
    .size(function(d) nodeSize(d.group, d.cl, d.linkDegree, this.scale))
    .fillStyle(function(d) col(d.group, d.domain, d.nodeName) ? 
                           col(d.group, d.domain, d.nodeName)  : 
                           colors(d.domain) )
    .strokeStyle(function() this.fillStyle().darker())
    .lineWidth(1)
    .title(function(d) d.nodeName)
    .event("mousedown", pv.Behavior.drag())
    .event("drag", force);

The Legends for the institutions and domains were added:


  vis.add(pv.Label)
    .right(100)
    .top(function() 40)
    .text("Project Domains");

  vis.add(pv.Dot)
    .data(pv.keys(domains))
    .right(90)
    .top(function() 50 + this.index * 18)
    .fillStyle(function(d) domains[d])
    .width(36)
    .height(12)
    .anchor("right").add(pv.Label)
    .textMargin(6)
    .textAlign("left");

  vis.add(pv.Label)
    .right(720)
    .top(function() 40)
    .text("Institutions");

  vis.add(pv.Dot)
    .shape("diamond")
    .data(pv.keys(instituteColours))
    .right(700)
    .top(function() 50 + this.index * 18)
    .fillStyle(function(d) instituteColours[d])
    .width(36)
    .height(12)
    .anchor("right").add(pv.Label)
    .textMargin(6)
    .textAlign("left");

Finally the graph was rendered:


  vis.render();