From ee7b974ac500c4b41f8011b4b32beb5f8f987659 Mon Sep 17 00:00:00 2001
From: grahamtriggs <grahamtriggs@gmail.com>
Date: Mon, 20 Jun 2016 17:01:51 +0100
Subject: [PATCH] [VIVO-1249] Add capability maps for research areas (#35)

* Initial capability map implementation

* Add autocomplete

* Make headers update the info panel

* Ajax retrieval of person details - reduce memory requirements and startup time

* Remove old referer info

* Handle missing labels.

* Fix refresh button; add menu entry for new installations
---
 .../CapabilityMapRequestHandler.java          |  284 +++++
 .../capabilitymap/CapabilityMapResponse.java  |   10 +
 .../capabilitymap/CapabilityMapResult.java    |   68 +
 .../constants/QueryConstants.java             |    7 +-
 ...pOfScienceVisualizationRequestHandler.java |    5 +-
 .../visualization/model/ConceptLabelMap.java  |   12 +
 .../visualization/model/ConceptPeopleMap.java |   12 +
 .../model/OrganizationPeopleMap.java          |   12 +
 .../webapp/visualization/model/Person.java    |   11 +
 ...poralGrantVisualizationRequestHandler.java |    5 +-
 ...ublicationVisualizationRequestHandler.java |    5 +-
 .../utilities/VisualizationCaches.java        |  308 ++++-
 .../resources/rdf/display/firsttime/menu.n3   |   22 +-
 .../visualizations-beans-injection-fm.xml     |    6 +
 .../css/visualization/capabilitymap/graph.css |  355 ++++++
 .../visualization/capabilitymap/key.png       |  Bin 0 -> 6766 bytes
 .../visualization/capabilitymap/refresh.png   |  Bin 0 -> 1217 bytes
 .../visualization/capabilitymap/graph_new.js  | 1128 +++++++++++++++++
 .../capabilitymap/jquery.color.js             |  663 ++++++++++
 .../visualization/capabilitymap/jsr_class.js  |   82 ++
 .../capabilitymap/capabilityMap.ftl           |  167 +++
 21 files changed, 3126 insertions(+), 36 deletions(-)
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapRequestHandler.java
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResponse.java
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResult.java
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptLabelMap.java
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptPeopleMap.java
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/OrganizationPeopleMap.java
 create mode 100644 api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/Person.java
 create mode 100755 webapp/src/main/webapp/css/visualization/capabilitymap/graph.css
 create mode 100644 webapp/src/main/webapp/images/visualization/capabilitymap/key.png
 create mode 100644 webapp/src/main/webapp/images/visualization/capabilitymap/refresh.png
 create mode 100755 webapp/src/main/webapp/js/visualization/capabilitymap/graph_new.js
 create mode 100755 webapp/src/main/webapp/js/visualization/capabilitymap/jquery.color.js
 create mode 100755 webapp/src/main/webapp/js/visualization/capabilitymap/jsr_class.js
 create mode 100644 webapp/src/main/webapp/templates/freemarker/visualization/capabilitymap/capabilityMap.ftl

diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapRequestHandler.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapRequestHandler.java
new file mode 100644
index 00000000..0054324e
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapRequestHandler.java
@@ -0,0 +1,284 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.capabilitymap;
+
+import com.google.gson.Gson;
+import com.hp.hpl.jena.query.Dataset;
+import com.hp.hpl.jena.query.QueryExecution;
+import com.hp.hpl.jena.query.QueryExecutionFactory;
+import com.hp.hpl.jena.query.QuerySolution;
+import com.hp.hpl.jena.rdf.model.Literal;
+import com.hp.hpl.jena.rdf.model.Model;
+import com.hp.hpl.jena.rdf.model.ModelFactory;
+import edu.cornell.mannlib.vitro.webapp.auth.requestedAction.AuthorizationRequest;
+import edu.cornell.mannlib.vitro.webapp.controller.VitroRequest;
+import edu.cornell.mannlib.vitro.webapp.controller.freemarker.responsevalues.ResponseValues;
+import edu.cornell.mannlib.vitro.webapp.controller.freemarker.responsevalues.TemplateResponseValues;
+import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFService;
+import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFServiceException;
+import edu.cornell.mannlib.vitro.webapp.rdfservice.ResultSetConsumer;
+import edu.cornell.mannlib.vitro.webapp.visualization.constants.QueryConstants;
+import edu.cornell.mannlib.vitro.webapp.visualization.exceptions.MalformedQueryParametersException;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.ConceptLabelMap;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.ConceptPeopleMap;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.OrganizationPeopleMap;
+import edu.cornell.mannlib.vitro.webapp.visualization.utilities.VisualizationCaches;
+import edu.cornell.mannlib.vitro.webapp.visualization.visutils.VisualizationRequestHandler;
+import org.apache.axis.utils.StringUtils;
+import org.apache.commons.logging.Log;
+
+import java.util.HashMap;
+import java.util.HashSet;
+import java.util.Map;
+import java.util.Set;
+
+public class CapabilityMapRequestHandler implements VisualizationRequestHandler {
+    @Override
+    public AuthorizationRequest getRequiredPrivileges() {
+        return null;
+    }
+
+    @Override
+    public ResponseValues generateStandardVisualization(VitroRequest vitroRequest, Log log, Dataset dataSource) throws MalformedQueryParametersException {
+        return null;
+    }
+
+    @Override
+    public ResponseValues generateVisualizationForShortURLRequests(Map<String, String> parameters, VitroRequest vitroRequest, Log log, Dataset dataSource) throws MalformedQueryParametersException {
+        return prepareMarkup(vitroRequest);
+    }
+
+    @Override
+    public Object generateAjaxVisualization(VitroRequest vitroRequest, Log log, Dataset dataSource) throws MalformedQueryParametersException {
+        ConceptLabelMap conceptLabelMap = VisualizationCaches.conceptToLabel.get(vitroRequest.getRDFService());
+        ConceptPeopleMap conceptPeopleMap = VisualizationCaches.conceptToPeopleMap.get(vitroRequest.getRDFService());
+        OrganizationPeopleMap organizationPeopleMap = VisualizationCaches.organisationToPeopleMap.get(vitroRequest.getRDFService());
+        Map<String, String> organizationLabels = VisualizationCaches.organizationLabels.get(vitroRequest.getRDFService());
+
+        String data = vitroRequest.getParameter("data");
+        if (!StringUtils.isEmpty(data)) {
+            if ("concepts".equalsIgnoreCase(data)) {
+                Set<String> concepts = new HashSet<String>();
+
+                for (String conceptKey : conceptPeopleMap.conceptToPeople.keySet()) {
+                    String label = conceptLabelMap.conceptToLabel.get(conceptKey);
+                    if (!StringUtils.isEmpty(label)) {
+                        concepts.add(conceptLabelMap.conceptToLabel.get(conceptKey));
+                    }
+                }
+
+                Gson gson = new Gson();
+                return gson.toJson(concepts);
+            }
+            return "";
+        }
+
+        String personParam = vitroRequest.getParameter("person");
+        if (!StringUtils.isEmpty(personParam)) {
+            CapabilityMapResponse response = new CapabilityMapResponse();
+            CapabilityMapResult result = new CapabilityMapResult();
+            fillPersonDetails(vitroRequest.getRDFService(), personParam, result);
+            if (StringUtils.isEmpty(result.firstName) && StringUtils.isEmpty(result.lastName)) {
+                result.lastName = "Missing Name";
+            }
+            Set<String> concepts = conceptPeopleMap.personToConcepts.get(personParam);
+            if (concepts != null) {
+                result.subjectArea = concepts.toArray(new String[concepts.size()]);
+            }
+            Set<String> organizations = organizationPeopleMap.organizationToPeople.get(personParam);
+            if (organizations != null) {
+                for (String org : organizations) {
+                    result.department = organizationLabels.get(org);
+                    if (!StringUtils.isEmpty(result.department)) {
+                        break;
+                    }
+                }
+            }
+            response.results.add(result);
+
+            Gson gson = new Gson();
+
+            String callback = vitroRequest.getParameter("callback");
+            if (!StringUtils.isEmpty(callback)) {
+                return callback + "(" + gson.toJson(response) + ");";
+            }
+            return gson.toJson(response);
+        }
+
+        String query = vitroRequest.getParameter("query");
+        if (!StringUtils.isEmpty(query)) {
+            CapabilityMapResponse response = new CapabilityMapResponse();
+
+            Set<String> matchedConcepts = conceptLabelMap.lowerLabelToConcepts.get(query.toLowerCase());
+
+            Set<String> people = new HashSet<String>();
+            if (matchedConcepts != null) {
+                for (String uri : matchedConcepts) {
+                    Set<String> peopleSet = conceptPeopleMap.conceptToPeople.get(uri);
+                    if (peopleSet != null) {
+                        people.addAll(peopleSet);
+                    }
+                }
+            }
+
+            Set<String> clusterConcepts = new HashSet<String>();
+            for (String person : people) {
+                if (conceptPeopleMap.personToConcepts.containsKey(person)) {
+                    clusterConcepts.addAll(conceptPeopleMap.personToConcepts.get(person));
+                }
+            }
+
+            if (matchedConcepts != null) {
+                clusterConcepts.removeAll(matchedConcepts);
+            }
+
+            Set<String> clusterLabels = new HashSet<String>();
+            for (String clusterConcept : clusterConcepts) {
+                String label = conceptLabelMap.conceptToLabel.get(clusterConcept);
+                if (!StringUtils.isEmpty(label)) {
+                    clusterLabels.add(label);
+                }
+            }
+
+            String[] clusters = clusterLabels.toArray(new String[clusterLabels.size()]);
+
+            for (String person : people) {
+                CapabilityMapResult result = new CapabilityMapResult();
+                result.profileId = person;
+                result.query = query;
+                result.clusters = clusters;
+                response.results.add(result);
+            }
+
+            Gson gson = new Gson();
+
+            String callback = vitroRequest.getParameter("callback");
+            if (!StringUtils.isEmpty(callback)) {
+                return callback + "(" + gson.toJson(response) + ");";
+            }
+            return gson.toJson(response);
+        }
+
+        return "";
+    }
+
+    @Override
+    public Map<String, String> generateDataVisualization(VitroRequest vitroRequest, Log log, Dataset dataset) throws MalformedQueryParametersException {
+        return null;
+    }
+
+    private ResponseValues prepareMarkup(VitroRequest vreq) {
+        String standaloneTemplate = "capabilityMap.ftl";
+
+        Map<String, Object> body = new HashMap<String, Object>();
+        body.put("title", "Capability Map");
+        body.put("vivoDefaultNamespace", vreq.getWebappDaoFactory().getDefaultNamespace());
+        return new TemplateResponseValues(standaloneTemplate, body);
+    }
+
+    private void fillPersonDetails(final RDFService rdfService, final String personUri, final CapabilityMapResult result) {
+        try {
+            String construct = QueryConstants.getSparqlPrefixQuery() +
+                    "CONSTRUCT {\n" +
+                    "  <" + personUri + "> a foaf:Person .\n" +
+                    "  <" + personUri + "> foaf:lastName ?lastName .\n" +
+                    "  <" + personUri + "> foaf:firstName ?firstName .\n" +
+                    "  <" + personUri + "> obo:ARG_2000028 ?contactInfo .\n" +
+                    "  ?contactInfo vcard:hasName ?contactName .\n" +
+                    "  ?contactName vcard:familyName ?familyName .\n" +
+                    "  ?contactName vcard:givenName ?givenName .\n" +
+                    "  ?contactInfo vcard:hasTitle ?contactTitle .\n" +
+                    "  ?contactTitle vcard:title ?contactTitleLabel  .\n" +
+                    "  <" + personUri + "> public:thumbnailImage ?directDownloadUrl .\n" +
+                    "} WHERE {\n" +
+                    "  { \n" +
+                    "    <" + personUri + "> foaf:lastName ?lastName .\n" +
+                    "  } UNION { \n" +
+                    "    <" + personUri + "> foaf:firstName ?firstName .\n" +
+                    "  } UNION { \n" +
+                    "    <" + personUri + "> obo:ARG_2000028 ?contactInfo .\n" +
+                    "    ?contactInfo vcard:hasName ?contactName .\n" +
+                    "    ?contactName vcard:familyName ?familyName .\n" +
+                    "  } UNION { \n" +
+                    "    <" + personUri + "> obo:ARG_2000028 ?contactInfo .\n" +
+                    "    ?contactInfo vcard:hasName ?contactName .\n" +
+                    "    ?contactName vcard:givenName ?givenName .\n" +
+                    "  } UNION { \n" +
+                    "    <" + personUri + "> obo:ARG_2000028 ?contactInfo .\n" +
+                    "    ?contactInfo vcard:hasTitle ?contactTitle .\n" +
+                    "    ?contactTitle vcard:title ?contactTitleLabel .\n" +
+                    "  } UNION { \n" +
+                    "    <" + personUri + "> public:mainImage ?mainImage .\n" +
+                    "    ?mainImage public:thumbnailImage ?thumbnailImage .\n" +
+                    "    ?thumbnailImage public:downloadLocation ?downloadLocation .\n" +
+                    "    ?downloadLocation public:directDownloadUrl ?directDownloadUrl .\n" +
+                    "  } \n" +
+                    "}\n";
+
+            Model constructedModel = ModelFactory.createDefaultModel();
+            rdfService.sparqlConstructQuery(construct, constructedModel);
+
+            String nameQuery = QueryConstants.getSparqlPrefixQuery() +
+                    "SELECT ?familyName ?givenName ?lastName ?firstName ?title ?thumbnailUrl\n" +
+                    "WHERE\n" +
+                    "{\n" +
+                    "  <" + personUri + "> a foaf:Person .\n" + // ?person
+                    "  OPTIONAL {\n" +
+                    "    <" + personUri + ">  obo:ARG_2000028 ?contactInfo .\n" +
+                    "    ?contactInfo vcard:hasName ?contactName .\n" +
+                    "    OPTIONAL { ?contactName vcard:familyName ?familyName . }\n" +
+                    "    OPTIONAL { ?contactName vcard:givenName  ?givenName . }\n" +
+                    "  }\n" +
+                    "  OPTIONAL {\n" +
+                    "    <" + personUri + ">  obo:ARG_2000028 ?contactInfo .\n" +
+                    "    ?contactInfo vcard:hasTitle ?contactTitle .\n" +
+                    "    ?contactTitle vcard:title ?title .\n" +
+                    "  }\n" +
+                    "  OPTIONAL { <" + personUri + ">  foaf:lastName ?lastName . }\n" +
+                    "  OPTIONAL { <" + personUri + ">  foaf:firstName  ?firstName . }\n" +
+                    "  OPTIONAL { <" + personUri + ">  public:thumbnailImage ?thumbnailUrl . }\n" +
+                    "}\n";
+
+            QueryExecution qe = QueryExecutionFactory.create(nameQuery, constructedModel);
+
+            try {
+                new ResultSetConsumer() {
+                    @Override
+                    protected void processQuerySolution(QuerySolution qs) {
+                        result.profileId = personUri;
+                        result.firstName = null;
+                        result.lastName = null;
+                        result.thumbNail = null;
+                        result.preferredTitle = null;
+
+                        Literal familyNameNode = qs.getLiteral("familyName");
+                        if (familyNameNode != null) {
+                            result.lastName = familyNameNode.getString();
+                        } else {
+                            Literal lastNameNode = qs.getLiteral("lastName");
+                            result.lastName = lastNameNode == null ? null : lastNameNode.getString();
+                        }
+
+                        Literal givenNameNode = qs.getLiteral("givenName");
+                        if (givenNameNode != null) {
+                            result.firstName = givenNameNode.getString();
+                        } else {
+                            Literal firstNameNode = qs.getLiteral("firstName");
+                            result.firstName = firstNameNode == null ? null : firstNameNode.getString();
+                        }
+
+                        Literal thumbnailUrlNode = qs.getLiteral("thumbnailUrl");
+                        result.thumbNail = thumbnailUrlNode == null ? null : thumbnailUrlNode.getString();
+
+                        Literal titleNode = qs.getLiteral("title");
+                        result.preferredTitle = titleNode == null ? null : titleNode.getString();
+                    }
+                }.processResultSet(qe.execSelect());
+            } finally {
+                qe.close();
+            }
+        } catch (RDFServiceException e) {
+
+        }
+    }
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResponse.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResponse.java
new file mode 100644
index 00000000..c6d91fdc
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResponse.java
@@ -0,0 +1,10 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.capabilitymap;
+
+import java.util.ArrayList;
+import java.util.List;
+
+class CapabilityMapResponse {
+    List<CapabilityMapResult> results = new ArrayList<CapabilityMapResult>();
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResult.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResult.java
new file mode 100644
index 00000000..6e039ddc
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/capabilitymap/CapabilityMapResult.java
@@ -0,0 +1,68 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.capabilitymap;
+
+import com.google.gson.annotations.SerializedName;
+
+class CapabilityMapResult {
+    String[] clusters;
+
+    @SerializedName("md_1")
+    String profileId;
+
+    @SerializedName("md_2")
+    String description;
+
+    @SerializedName("md_3")
+    String thumbNail;
+
+    @SerializedName("md_4")
+    String department;
+
+    @SerializedName("md_5")
+    String overview;
+
+    @SerializedName("md_6")
+    String geographicFocus;
+
+    @SerializedName("md_7")
+    String geographicLocation;
+
+    @SerializedName("md_8")
+    String[] grants;
+
+    @SerializedName("md_A")
+    String firstName;
+
+    @SerializedName("md_B")
+    String lastName;
+
+    @SerializedName("md_F")
+    String fax;
+
+    @SerializedName("md_G")
+    String email;
+
+    @SerializedName("md_H")
+    String availableForSupervision;
+
+    @SerializedName("md_I")
+    String homepage;
+
+    @SerializedName("md_L")
+    String phoneNumber;
+
+    @SerializedName("md_U")
+    String[] publications;
+
+    @SerializedName("md_X")
+    String[] researchOverview;
+
+    @SerializedName("md_Y")
+    String[] subjectArea;
+
+    @SerializedName("md_Z")
+    String preferredTitle;
+
+    String query;
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/constants/QueryConstants.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/constants/QueryConstants.java
index 3aacfabf..abfc9e51 100644
--- a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/constants/QueryConstants.java
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/constants/QueryConstants.java
@@ -39,11 +39,12 @@ public class QueryConstants {
 			put("wos", "http://vivo.mannlib.cornell.edu/ns/ThomsonWOS/0.1#");
 			put("core", "http://vivoweb.org/ontology/core#");
 			put("vivo", "http://vivo.library.cornell.edu/ns/0.1#");
-			put("j.1", "http://aims.fao.org/aos/geopolitical.owl#");
-			put("j.2", "http://vitro.mannlib.cornell.edu/ns/vitro/public#");
+			put("geo", "http://aims.fao.org/aos/geopolitical.owl#");
+			put("public", "http://vitro.mannlib.cornell.edu/ns/vitro/public#");
 			put("afn", "http://jena.hpl.hp.com/ARQ/function#");
 			put("vivosocnet", "http://vivo.cns.iu.edu/ns/#");
-			
+			put("obo", "http://purl.obolibrary.org/obo/");
+			put("vcard", "http://www.w3.org/2006/vcard/ns#");
 	} };
 	
 	public static String getSparqlPrefixQuery() {
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/mapofscience/MapOfScienceVisualizationRequestHandler.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/mapofscience/MapOfScienceVisualizationRequestHandler.java
index e633e6ac..4a5b8acd 100644
--- a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/mapofscience/MapOfScienceVisualizationRequestHandler.java
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/mapofscience/MapOfScienceVisualizationRequestHandler.java
@@ -15,6 +15,7 @@ import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFService;
 import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFServiceException;
 import edu.cornell.mannlib.vitro.webapp.rdfservice.ResultSetConsumer;
 import edu.cornell.mannlib.vitro.webapp.visualization.constants.QueryConstants;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.OrganizationPeopleMap;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.OrgUtils;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.VisualizationCaches;
 import mapping.ScienceMapping;
@@ -252,7 +253,7 @@ public class MapOfScienceVisualizationRequestHandler implements VisualizationReq
 		}
 
 		Map<String, Set<String>> subOrgMap = VisualizationCaches.organizationSubOrgs.get(rdfService);
-		Map<String, Set<String>> organisationToPeopleMap = VisualizationCaches.organisationToPeopleMap.get(rdfService);
+		OrganizationPeopleMap organisationToPeopleMap = VisualizationCaches.organisationToPeopleMap.get(rdfService);
 		Map<String, Set<String>> personToPublicationMap = VisualizationCaches.personToPublication.get(rdfService).personToPublication;
 		Map<String, String> publicationToJournalMap = VisualizationCaches.publicationToJournal.get(rdfService);
 
@@ -267,7 +268,7 @@ public class MapOfScienceVisualizationRequestHandler implements VisualizationReq
 				orgPublicationsPeople,
 				subOrgPublicationsMap,
 				subOrgMap,
-				organisationToPeopleMap,
+				organisationToPeopleMap.organizationToPeople,
 				personToPublicationMap
 		);
 
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptLabelMap.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptLabelMap.java
new file mode 100644
index 00000000..ea0fd6a0
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptLabelMap.java
@@ -0,0 +1,12 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.model;
+
+import java.util.HashMap;
+import java.util.Map;
+import java.util.Set;
+
+public class ConceptLabelMap {
+    public final Map<String, String> conceptToLabel = new HashMap<String, String>();
+    public final Map<String, Set<String>> lowerLabelToConcepts = new HashMap<String, Set<String>>();
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptPeopleMap.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptPeopleMap.java
new file mode 100644
index 00000000..dd61ede3
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/ConceptPeopleMap.java
@@ -0,0 +1,12 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.model;
+
+import java.util.HashMap;
+import java.util.Map;
+import java.util.Set;
+
+public class ConceptPeopleMap {
+    public final Map<String, Set<String>> conceptToPeople = new HashMap<String, Set<String>>();
+    public final Map<String, Set<String>> personToConcepts = new HashMap<String, Set<String>>();
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/OrganizationPeopleMap.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/OrganizationPeopleMap.java
new file mode 100644
index 00000000..3c4d63b7
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/OrganizationPeopleMap.java
@@ -0,0 +1,12 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.model;
+
+import java.util.HashMap;
+import java.util.Map;
+import java.util.Set;
+
+public class OrganizationPeopleMap {
+    public final Map<String, Set<String>> organizationToPeople = new HashMap<String, Set<String>>();
+    public final Map<String, Set<String>> personToOrganizations = new HashMap<String, Set<String>>();
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/Person.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/Person.java
new file mode 100644
index 00000000..8b7dedfe
--- /dev/null
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/model/Person.java
@@ -0,0 +1,11 @@
+/* $This file is distributed under the terms of the license in /doc/license.txt$ */
+
+package edu.cornell.mannlib.vitro.webapp.visualization.model;
+
+public class Person {
+    public String uri;
+    public String preferredTitle;
+    public String firstName;
+    public String lastName;
+    public String thumbnailUrl;
+}
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalGrantVisualizationRequestHandler.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalGrantVisualizationRequestHandler.java
index b8a517a0..550e20b1 100644
--- a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalGrantVisualizationRequestHandler.java
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalGrantVisualizationRequestHandler.java
@@ -11,6 +11,7 @@ import java.util.Map;
 import java.util.Set;
 
 import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFService;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.OrganizationPeopleMap;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.CounterUtils;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.OrgUtils;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.VisualizationCaches;
@@ -152,7 +153,7 @@ public class TemporalGrantVisualizationRequestHandler implements
 		}
 
 		Map<String, Set<String>> subOrgMap               = VisualizationCaches.organizationSubOrgs.get(rdfService);
-		Map<String, Set<String>> organisationToPeopleMap = VisualizationCaches.organisationToPeopleMap.get(rdfService);
+		OrganizationPeopleMap organisationToPeopleMap = VisualizationCaches.organisationToPeopleMap.get(rdfService);
 		Map<String, String> orgMostSpecificLabelMap      = VisualizationCaches.organizationToMostSpecificLabel.get(rdfService);
 		Map<String, String> personMostSpecificLabelMap   = VisualizationCaches.personToMostSpecificLabel.get(rdfService);
 		Map<String, Set<String>> personToGrantMap        = VisualizationCaches.personToGrant.get(rdfService);
@@ -169,7 +170,7 @@ public class TemporalGrantVisualizationRequestHandler implements
 				orgGrantsPeople,
 				subOrgGrantsMap,
 				subOrgMap,
-				organisationToPeopleMap,
+				organisationToPeopleMap.organizationToPeople,
 				personToGrantMap
 		);
 
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalPublicationVisualizationRequestHandler.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalPublicationVisualizationRequestHandler.java
index a11320ef..0230b769 100644
--- a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalPublicationVisualizationRequestHandler.java
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/temporalgraph/TemporalPublicationVisualizationRequestHandler.java
@@ -11,6 +11,7 @@ import java.util.Map;
 import java.util.Set;
 
 import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFService;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.OrganizationPeopleMap;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.CounterUtils;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.OrgUtils;
 import edu.cornell.mannlib.vitro.webapp.visualization.utilities.VisualizationCaches;
@@ -91,7 +92,7 @@ public class TemporalPublicationVisualizationRequestHandler implements
 		Map<String, Set<String>> subOrgMap               = VisualizationCaches.organizationSubOrgs.get(rdfService);
 		Map<String, String> orgMostSpecificLabelMap      = VisualizationCaches.organizationToMostSpecificLabel.get(rdfService);
 		Map<String, String> personMostSpecificLabelMap   = VisualizationCaches.personToMostSpecificLabel.get(rdfService);
-		Map<String, Set<String>> organisationToPeopleMap = VisualizationCaches.organisationToPeopleMap.get(rdfService);
+		OrganizationPeopleMap organisationToPeopleMap = VisualizationCaches.organisationToPeopleMap.get(rdfService);
 		Map<String, Set<String>> personToPublicationMap  = VisualizationCaches.personToPublication.get(rdfService).personToPublication;
 		Map<String, String>      publicationToYearMap    = VisualizationCaches.publicationToYear.get(rdfService);
 
@@ -106,7 +107,7 @@ public class TemporalPublicationVisualizationRequestHandler implements
 				orgPublicationsPeople,
 				subOrgPublicationsMap,
 				subOrgMap,
-				organisationToPeopleMap,
+				organisationToPeopleMap.organizationToPeople,
 				personToPublicationMap
 		);
 
diff --git a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/utilities/VisualizationCaches.java b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/utilities/VisualizationCaches.java
index f99ee9a0..4195239d 100644
--- a/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/utilities/VisualizationCaches.java
+++ b/api/src/main/java/edu/cornell/mannlib/vitro/webapp/visualization/utilities/VisualizationCaches.java
@@ -2,11 +2,21 @@
 
 package edu.cornell.mannlib.vitro.webapp.visualization.utilities;
 
+import com.hp.hpl.jena.query.QueryExecution;
+import com.hp.hpl.jena.query.QueryExecutionFactory;
 import com.hp.hpl.jena.query.QuerySolution;
+import com.hp.hpl.jena.rdf.model.Literal;
+import com.hp.hpl.jena.rdf.model.Model;
+import com.hp.hpl.jena.rdf.model.ModelFactory;
+import com.hp.hpl.jena.rdf.model.RDFNode;
 import com.hp.hpl.jena.rdf.model.Resource;
 import edu.cornell.mannlib.vitro.webapp.rdfservice.RDFService;
 import edu.cornell.mannlib.vitro.webapp.rdfservice.ResultSetConsumer;
 import edu.cornell.mannlib.vitro.webapp.visualization.constants.QueryConstants;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.ConceptLabelMap;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.ConceptPeopleMap;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.OrganizationPeopleMap;
+import edu.cornell.mannlib.vitro.webapp.visualization.model.Person;
 import edu.cornell.mannlib.vitro.webapp.visualization.visutils.UtilityFunctions;
 import org.joda.time.DateTime;
 
@@ -17,6 +27,11 @@ import java.util.Set;
 
 /**
  * Holder for the caches we are using in the visualizations
+ *
+ * String.intern() was a problem pre-Java 7, but has greater utility now.
+ * Please see the following guide for information on the implementation of String.intern()
+ *
+ * http://java-performance.info/string-intern-in-java-6-7-8/
  */
 final public class VisualizationCaches {
     // Affinity object to ensure that only one background thread can be running at once when updating the caches
@@ -32,6 +47,8 @@ final public class VisualizationCaches {
      * @param rdfService if not null, use this service in foreground, otherwise may use the background thread
      */
     public static void rebuildAll(RDFService rdfService) {
+        conceptToLabel.build(rdfService);
+        conceptToPeopleMap.build(rdfService);
         organizationLabels.build(rdfService);
         organizationSubOrgs.build(rdfService);
         organizationToMostSpecificLabel.build(rdfService);
@@ -43,9 +60,12 @@ final public class VisualizationCaches {
         publicationToYear.build(rdfService);
         personToGrant.build(rdfService);
         grantToYear.build(rdfService);
+//        people.build(rdfService);
     }
 
     public static void buildMissing() {
+        if (!conceptToLabel.isCached())                  { conceptToLabel.build(null); }
+        if (!conceptToPeopleMap.isCached())              { conceptToPeopleMap.build(null); }
         if (!organizationLabels.isCached())              { organizationLabels.build(null); }
         if (!organizationSubOrgs.isCached())             { organizationSubOrgs.build(null); }
         if (!organizationToMostSpecificLabel.isCached()) { organizationToMostSpecificLabel.build(null); }
@@ -57,6 +77,7 @@ final public class VisualizationCaches {
         if (!publicationToYear.isCached())               { publicationToYear.build(null); }
         if (!personToGrant.isCached())                   { personToGrant.build(null); }
         if (!grantToYear.isCached())                     { grantToYear.build(null); }
+//        if (!people.isCached())                          { people.build(null); }
     }
 
     /**
@@ -71,6 +92,139 @@ final public class VisualizationCaches {
         }
     }
 
+    /**
+     * Cache of people
+     */
+    public static final CachingRDFServiceExecutor<Map<String, Person>> people =
+            new CachingRDFServiceExecutor<>(
+                    new CachingRDFServiceExecutor.RDFServiceCallable<Map<String, Person>>(visualizationAffinity) {
+                        @Override
+                        protected Map<String, Person> callWithService(RDFService rdfService) throws Exception {
+                            final Map<String, Person> map = new HashMap<String, Person>();
+
+                            String construct = QueryConstants.getSparqlPrefixQuery() +
+                                    "CONSTRUCT {\n" +
+                                    "  ?person a foaf:Person .\n" +
+                                    "  ?person foaf:lastName ?lastName .\n" +
+                                    "  ?person foaf:firstName ?firstName .\n" +
+                                    "  ?person obo:ARG_2000028 ?contactInfo .\n" +
+                                    "  ?contactInfo vcard:hasName ?contactName .\n" +
+                                    "  ?contactName vcard:familyName ?familyName .\n" +
+                                    "  ?contactName vcard:givenName ?givenName .\n" +
+                                    "  ?contactInfo vcard:hasTitle ?contactTitle .\n" +
+                                    "  ?contactTitle vcard:title ?contactTitleLabel  .\n" +
+                                    "  ?person public:thumbnailImage ?directDownloadUrl .\n" +
+                                    "} WHERE {\n" +
+                                    "  { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "  } UNION { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person foaf:lastName ?lastName .\n" +
+                                    "  } UNION { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person foaf:firstName ?firstName .\n" +
+                                    "  } UNION { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person obo:ARG_2000028 ?contactInfo .\n" +
+                                    "    ?contactInfo vcard:hasName ?contactName .\n" +
+                                    "    ?contactName vcard:familyName ?familyName .\n" +
+                                    "  } UNION { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person obo:ARG_2000028 ?contactInfo .\n" +
+                                    "    ?contactInfo vcard:hasName ?contactName .\n" +
+                                    "    ?contactName vcard:givenName ?givenName .\n" +
+                                    "  } UNION { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person obo:ARG_2000028 ?contactInfo .\n" +
+                                    "    ?contactInfo vcard:hasTitle ?contactTitle .\n" +
+                                    "    ?contactTitle vcard:title ?contactTitleLabel .\n" +
+                                    "  } UNION { \n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person public:mainImage ?mainImage .\n" +
+                                    "    ?mainImage public:thumbnailImage ?thumbnailImage .\n" +
+                                    "    ?thumbnailImage public:downloadLocation ?downloadLocation .\n" +
+                                    "    ?downloadLocation public:directDownloadUrl ?directDownloadUrl .\n" +
+                                    "  } \n" +
+                                    "}\n";
+
+                            Model constructedModel = ModelFactory.createDefaultModel();
+                            rdfService.sparqlConstructQuery(construct, constructedModel);
+
+                            String nameQuery = QueryConstants.getSparqlPrefixQuery() +
+                                    "SELECT ?person ?familyName ?givenName ?lastName ?firstName ?title ?thumbnailUrl\n" +
+                                    "WHERE\n" +
+                                    "{\n" +
+                                    "  ?person a foaf:Person .\n" +
+                                    "  OPTIONAL {\n" +
+                                    "    ?person obo:ARG_2000028 ?contactInfo .\n" +
+                                    "    ?contactInfo vcard:hasName ?contactName .\n" +
+                                    "    OPTIONAL { ?contactName vcard:familyName ?familyName . }\n" +
+                                    "    OPTIONAL { ?contactName vcard:givenName  ?givenName . }\n" +
+                                    "  }\n" +
+                                    "  OPTIONAL {\n" +
+                                    "    ?person obo:ARG_2000028 ?contactInfo .\n" +
+                                    "    ?contactInfo vcard:hasTitle ?contactTitle .\n" +
+                                    "    ?contactTitle vcard:title ?title .\n" +
+                                    "  }\n" +
+                                    "  OPTIONAL { ?person foaf:lastName ?lastName . }\n" +
+                                    "  OPTIONAL { ?person foaf:firstName  ?firstName . }\n" +
+                                    "  OPTIONAL { ?person public:thumbnailImage ?thumbnailUrl . }\n" +
+                                    "}\n";
+
+                            QueryExecution qe = QueryExecutionFactory.create(nameQuery, constructedModel);
+                            try {
+                                new ResultSetConsumer() {
+                                    @Override
+                                    protected void processQuerySolution(QuerySolution qs) {
+                                        String personUri = qs.getResource("person").getURI();
+                                        String familyName = null;
+                                        String givenName = null;
+                                        String thumbnailUrl = null;
+                                        String title = null;
+
+                                        Literal familyNameNode = qs.getLiteral("familyName");
+                                        if (familyNameNode != null) {
+                                            familyName = familyNameNode.getString();
+                                        } else {
+                                            Literal lastNameNode = qs.getLiteral("lastName");
+                                            familyName = lastNameNode == null ? null : lastNameNode.getString();
+                                        }
+
+                                        Literal givenNameNode = qs.getLiteral("givenName");
+                                        if (givenNameNode != null) {
+                                            givenName = givenNameNode.getString();
+                                        } else {
+                                            Literal firstNameNode = qs.getLiteral("firstName");
+                                            givenName = firstNameNode == null ? null : firstNameNode.getString();
+                                        }
+
+                                        Literal thumbnailUrlNode = qs.getLiteral("thumbnailUrl");
+                                        thumbnailUrl = thumbnailUrlNode == null ? null : thumbnailUrlNode.getString();
+
+                                        Literal titleNode = qs.getLiteral("title");
+                                        title = titleNode == null ? null : titleNode.getString();
+
+                                        Person person = map.get(personUri);
+                                        if (person == null) {
+                                            person = new Person();
+                                            map.put(personUri.intern(), person);
+                                        }
+
+                                        person.firstName = givenName == null ? null : givenName.intern();
+                                        person.lastName  = familyName == null ? null : familyName.intern();
+                                        person.preferredTitle = title == null ? null : title.intern();
+                                        person.thumbnailUrl = thumbnailUrl;
+                                    }
+                                }.processResultSet(qe.execSelect());
+                            } finally {
+                                qe.close();
+                            }
+
+                            return map;
+                        }
+                    }
+            );
+
     /**
      * Cache of organization labels (uri -> label)
      */
@@ -95,7 +249,7 @@ final public class VisualizationCaches {
                                     String org      = qs.getResource("org").getURI();
                                     String orgLabel = qs.getLiteral("orgLabel").getString();
 
-                                    map.put(org, orgLabel);
+                                    map.put(org.intern(), orgLabel.intern());
                                 }
                             });
 
@@ -131,10 +285,10 @@ final public class VisualizationCaches {
                                     Set<String> subOrgs = map.get(org);
                                     if (subOrgs == null) {
                                         subOrgs = new HashSet<String>();
-                                        subOrgs.add(subOrg);
-                                        map.put(org, subOrgs);
+                                        subOrgs.add(subOrg.intern());
+                                        map.put(org.intern(), subOrgs);
                                     } else {
-                                        subOrgs.add(subOrg);
+                                        subOrgs.add(subOrg.intern());
                                     }
                                 }
                             });
@@ -168,7 +322,7 @@ final public class VisualizationCaches {
                                 protected void processQuerySolution(QuerySolution qs) {
                                     String org = qs.getResource("org").getURI();
                                     String typeLabel  = qs.getLiteral("typeLabel").getString();
-                                    map.put(org, String.valueOf(typeLabel));
+                                    map.put(org.intern(), typeLabel.intern());
                                 }
                             });
 
@@ -180,11 +334,11 @@ final public class VisualizationCaches {
     /**
      * Map of people within an organisation (org uri -> list of person uri)
      */
-    public static final CachingRDFServiceExecutor<Map<String, Set<String>>> organisationToPeopleMap =
-            new CachingRDFServiceExecutor<Map<String, Set<String>>>(
-                    new CachingRDFServiceExecutor.RDFServiceCallable<Map<String, Set<String>>>(visualizationAffinity) {
+    public static final CachingRDFServiceExecutor<OrganizationPeopleMap> organisationToPeopleMap =
+            new CachingRDFServiceExecutor<OrganizationPeopleMap>(
+                    new CachingRDFServiceExecutor.RDFServiceCallable<OrganizationPeopleMap>(visualizationAffinity) {
                         @Override
-                        protected Map<String, Set<String>> callWithService(RDFService rdfService) throws Exception {
+                        protected OrganizationPeopleMap callWithService(RDFService rdfService) throws Exception {
                             String query = QueryConstants.getSparqlPrefixQuery() +
                                     "SELECT ?organisation ?person\n" +
                                     "WHERE\n" +
@@ -196,22 +350,31 @@ final public class VisualizationCaches {
                                     "  ?person a foaf:Person .\n" +
                                     "}\n";
 
-                            final Map<String, Set<String>> orgToPeopleMap = new HashMap<String, Set<String>>();
+                            final OrganizationPeopleMap orgToPeopleMap = new OrganizationPeopleMap();
 
                             rdfService.sparqlSelectQuery(query, new ResultSetConsumer() {
                                 @Override
                                 protected void processQuerySolution(QuerySolution qs) {
-                                    String org    = qs.getResource("organisation").getURI();
-                                    String person = qs.getResource("person").getURI();
+                                    String org    = qs.getResource("organisation").getURI().intern();
+                                    String person = qs.getResource("person").getURI().intern();
 
-                                    Set<String> people = orgToPeopleMap.get(org);
+                                    Set<String> people = orgToPeopleMap.organizationToPeople.get(org);
                                     if (people == null) {
                                         people = new HashSet<String>();
                                         people.add(person);
-                                        orgToPeopleMap.put(org, people);
+                                        orgToPeopleMap.organizationToPeople.put(org, people);
                                     } else {
                                         people.add(person);
                                     }
+
+                                    Set<String> organizations = orgToPeopleMap.personToOrganizations.get(org);
+                                    if (organizations == null) {
+                                        organizations = new HashSet<String>();
+                                        organizations.add(org);
+                                        orgToPeopleMap.organizationToPeople.put(person, organizations);
+                                    } else {
+                                        organizations.add(org);
+                                    }
                                 }
                             });
 
@@ -220,6 +383,103 @@ final public class VisualizationCaches {
                     }
             );
 
+    /**
+     * Concept to label
+     */
+    public static final CachingRDFServiceExecutor<ConceptLabelMap> conceptToLabel =
+            new CachingRDFServiceExecutor<>(
+                    new CachingRDFServiceExecutor.RDFServiceCallable<ConceptLabelMap>() {
+                        @Override
+                        protected ConceptLabelMap callWithService(RDFService rdfService) throws Exception {
+                            String query = QueryConstants.getSparqlPrefixQuery() +
+                                    "SELECT ?concept ?label\n" +
+                                    "WHERE\n" +
+                                    "{\n" +
+                                    "    ?person a foaf:Person .\n" +
+                                    "    ?person core:hasResearchArea ?concept .\n" +
+                                    "    ?concept a skos:Concept .\n" +
+                                    "    ?concept rdfs:label ?label .\n" +
+                                    "}\n";
+
+//                            final Map<String, String> map = new HashMap<>();
+                            final ConceptLabelMap map = new ConceptLabelMap();
+
+                            rdfService.sparqlSelectQuery(query, new ResultSetConsumer() {
+                                @Override
+                                protected void processQuerySolution(QuerySolution qs) {
+                                    String conceptURI = qs.getResource("concept").getURI().intern();
+                                    String label  = qs.getLiteral("label").getString().intern();
+                                    String labelLower = label.toLowerCase().intern();
+
+                                    map.conceptToLabel.put(conceptURI, label);
+
+                                    Set<String> conceptSet = map.lowerLabelToConcepts.get(labelLower);
+                                    if (conceptSet == null) {
+                                        conceptSet = new HashSet<String>();
+                                        conceptSet.add(conceptURI);
+                                        map.lowerLabelToConcepts.put(labelLower, conceptSet);
+                                    } else {
+                                        conceptSet.add(conceptURI);
+                                    }
+
+                                }
+                            });
+
+                            return map;
+                        }
+                    }
+            );
+
+    /**
+     * Map of people associated with a concept
+     */
+    public static final CachingRDFServiceExecutor<ConceptPeopleMap> conceptToPeopleMap =
+            new CachingRDFServiceExecutor<ConceptPeopleMap>(
+                    new CachingRDFServiceExecutor.RDFServiceCallable<ConceptPeopleMap>(visualizationAffinity) {
+                        @Override
+                        protected ConceptPeopleMap callWithService(RDFService rdfService) throws Exception {
+                            String query = QueryConstants.getSparqlPrefixQuery() +
+                                    "SELECT ?person ?concept\n" +
+                                    "WHERE\n" +
+                                    "{\n" +
+                                    "  ?person a foaf:Person .\n" +
+                                    "  ?person core:hasResearchArea ?concept .\n" +
+                                    "  ?concept a skos:Concept .\n" +
+                                    "}\n";
+
+                            final ConceptPeopleMap conceptPeopleMap = new ConceptPeopleMap();
+
+                            rdfService.sparqlSelectQuery(query, new ResultSetConsumer() {
+                                @Override
+                                protected void processQuerySolution(QuerySolution qs) {
+                                    String concept = qs.getResource("concept").getURI().intern();
+                                    String person  = qs.getResource("person").getURI().intern();
+
+                                    Set<String> people = conceptPeopleMap.conceptToPeople.get(concept);
+                                    if (people == null) {
+                                        people = new HashSet<String>();
+                                        people.add(person);
+                                        conceptPeopleMap.conceptToPeople.put(concept, people);
+                                    } else {
+                                        people.add(person);
+                                    }
+
+                                    Set<String> concepts = conceptPeopleMap.personToConcepts.get(person);
+                                    if (concepts == null) {
+                                        concepts = new HashSet<String>();
+                                        concepts.add(concept);
+                                        conceptPeopleMap.personToConcepts.put(person, concepts);
+                                    } else {
+                                        concepts.add(concept);
+                                    }
+                                }
+                            });
+
+                            return conceptPeopleMap;
+                        }
+                    }
+            );
+
     /**
      * Display labels for people (uri -> label)
      */
@@ -244,7 +504,7 @@ final public class VisualizationCaches {
                                     String person      = qs.getResource("person").getURI();
                                     String personLabel = qs.getLiteral("personLabel").getString();
 
-                                    map.put(person, personLabel);
+                                    map.put(person.intern(), personLabel.intern());
                                 }
                             });
 
@@ -277,7 +537,7 @@ final public class VisualizationCaches {
                                 protected void processQuerySolution(QuerySolution qs) {
                                     String person = qs.getResource("person").getURI();
                                     String typeLabel  = qs.getLiteral("typeLabel").getString();
-                                    map.put(person, String.valueOf(typeLabel));
+                                    map.put(person.intern(), String.valueOf(typeLabel).intern());
                                 }
                             });
 
@@ -317,7 +577,7 @@ final public class VisualizationCaches {
                                         String personURI = person.getURI();
                                         String documentURI = document.getURI();
 
-                                        map.put(personURI, documentURI);
+                                        map.put(personURI.intern(), documentURI.intern());
                                     }
                                 }
                             });
@@ -352,7 +612,7 @@ final public class VisualizationCaches {
                                     String document      = qs.getResource("document").getURI();
                                     String journalLabel = qs.getLiteral("journalLabel").getString();
 
-                                    map.put(document, journalLabel);
+                                    map.put(document.intern(), journalLabel.intern());
                                 }
                             });
 
@@ -390,7 +650,7 @@ final public class VisualizationCaches {
                                                 .getValidParsedDateTimeObject(pubDate);
 
                                         if (validParsedDateTimeObject != null) {
-                                            map.put(document, String.valueOf(validParsedDateTimeObject.getYear()));
+                                            map.put(document.intern(), String.valueOf(validParsedDateTimeObject.getYear()).intern());
                                         }
                                     }
                                 }
@@ -434,10 +694,10 @@ final public class VisualizationCaches {
                                         Set<String> documents = map.get(personURI);
                                         if (documents == null) {
                                             documents = new HashSet<String>();
-                                            documents.add(grant.getURI());
-                                            map.put(personURI, documents);
+                                            documents.add(grant.getURI().intern());
+                                            map.put(personURI.intern(), documents);
                                         } else {
-                                            documents.add(grant.getURI());
+                                            documents.add(grant.getURI().intern());
                                         }
                                     }
                                 }
@@ -478,7 +738,7 @@ final public class VisualizationCaches {
                                                 .getValidParsedDateTimeObject(startDate);
 
                                         if (validParsedDateTimeObject != null) {
-                                            map.put(grant, String.valueOf(validParsedDateTimeObject.getYear()));
+                                            map.put(grant.intern(), String.valueOf(validParsedDateTimeObject.getYear()).intern());
                                         }
                                     }
                                 }
@@ -520,7 +780,7 @@ final public class VisualizationCaches {
                                                 .getValidParsedDateTimeObject(startDate);
 
                                         if (validParsedDateTimeObject != null) {
-                                            map.put(grant, String.valueOf(validParsedDateTimeObject.getYear()));
+                                            map.put(grant.intern(), String.valueOf(validParsedDateTimeObject.getYear()).intern());
                                         }
                                     }
                                 }
diff --git a/home/src/main/resources/rdf/display/firsttime/menu.n3 b/home/src/main/resources/rdf/display/firsttime/menu.n3
index ca8b266e..418b3dd0 100644
--- a/home/src/main/resources/rdf/display/firsttime/menu.n3
+++ b/home/src/main/resources/rdf/display/firsttime/menu.n3
@@ -19,7 +19,8 @@ display:DefaultMenu
     display:hasElement display:HomeMenuItem ;
     display:hasElement display:OrganizationsMenuItem ;
     display:hasElement display:PeopleMenuItem ;
-    display:hasElement display:ResearchMenuItem .
+    display:hasElement display:ResearchMenuItem ;
+    display:hasElement display:CapabilityMapMenuItem .
 
 #### Menu Items for Default Menu ####
 
@@ -53,7 +54,13 @@ display:EventsMenuItem
     display:linkText "Events";
     display:toPage display:Events .        
     
-display:Home 
+display:CapabilityMapMenuItem
+    a display:NavigationElement ;
+    display:menuPosition 6;
+    display:linkText "Capability Map";
+    display:toPage display:CapabilityMap .
+
+display:Home
     a display:HomePage ;    
     a display:Page ;
     display:title "Home" ;    
@@ -93,8 +100,12 @@ display:Research
     display:urlMapping "/research" ;
     display:hasDataGetter display:researchDataGetter .
 
+display:CapabilityMap
+    a display:Page ;
+    display:title "Capability Map" ;
+    display:urlMapping "/vis/capabilitymap" ;
+    display:hasDataGetter display:capabilityMapDataGetter .
 
-    
 #The data getter objects used above
 display:peopleDataGetter
       a <java:edu.cornell.mannlib.vitro.webapp.utils.dataGetter.ClassGroupPageData>;
@@ -118,3 +129,8 @@ display:eventsDataGetter
               
 display:homeDataGetter
       a <java:edu.cornell.mannlib.vitro.webapp.utils.dataGetter.BrowseDataGetter> .
+
+display:capabilityMapDataGetter
+      a <java:edu.cornell.mannlib.vitro.webapp.utils.dataGetter.FixedHTMLDataGetter>;
+      display:htmlValue """Capability Map"""@en ;
+      display:saveToVar "capabilityMap" .
diff --git a/webapp/src/main/webapp/WEB-INF/visualization/visualizations-beans-injection-fm.xml b/webapp/src/main/webapp/WEB-INF/visualization/visualizations-beans-injection-fm.xml
index 88548065..e59748bb 100644
--- a/webapp/src/main/webapp/WEB-INF/visualization/visualizations-beans-injection-fm.xml
+++ b/webapp/src/main/webapp/WEB-INF/visualization/visualizations-beans-injection-fm.xml
@@ -9,6 +9,8 @@
            http://www.springframework.org/schema/context
            http://www.springframework.org/schema/context/spring-context-2.5.xsd">
 
+	<bean id="capability_map"
+		  class="edu.cornell.mannlib.vitro.webapp.visualization.capabilitymap.CapabilityMapRequestHandler" />
 
 	<bean id="person_pub_count"
 		class="edu.cornell.mannlib.vitro.webapp.visualization.personpubcount.PersonPublicationCountRequestHandler" />
@@ -47,6 +49,10 @@
 		class="edu.cornell.mannlib.vitro.webapp.controller.visualization.VisualizationInjector">
 		<property name="visualizations">
 			<map>
+				<entry key="capabilitymap">
+					<ref bean="capability_map"></ref>
+				</entry>
+
 				<entry key="person_pub_count">
 					<ref bean="person_pub_count"></ref>
 				</entry>
diff --git a/webapp/src/main/webapp/css/visualization/capabilitymap/graph.css b/webapp/src/main/webapp/css/visualization/capabilitymap/graph.css
new file mode 100755
index 00000000..adb9b848
--- /dev/null
+++ b/webapp/src/main/webapp/css/visualization/capabilitymap/graph.css
@@ -0,0 +1,355 @@
+body {
+    background-position-y:60px;
+}
+.text {
+    margin: 7px;
+}
+
+.alert {
+	color: red;
+	font-size: large;
+}
+
+#queryform button, #queryform input[type=submit] {
+    border-radius: 4px;
+    -webkit-border-radius: 4px;
+    -moz-border-radius: 4px;
+    -o-border-radius: 4px;
+    box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
+    -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
+    -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
+    -o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
+    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
+    -webkit-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
+    -moz-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
+    -o-text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
+    background-color: #8BAB2E;
+//    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#446791), to(#164682));
+//    background-image: -moz-linear-gradient(top, #446791, #164682);
+    width: auto;
+    padding: 9px 18px 8px;
+//    margin: 10px 10px 0 0;
+    color: #fff;
+    border: 0;
+    vertical-align: middle
+}
+
+#content {
+	width: 1200px;
+	max-width: 1200px;
+}
+
+/* Contains all the graphics. */
+#container {
+    /*width: 1200px;*/width:940px;
+    height: auto;
+    /* margin:0 auto; */
+    /*margin-left:-130px;*/
+    position:relative;
+    /*box-shadow:0px 0px 20px -6px #000000;*/
+    margin-top:15px;
+}
+
+#left-container, 
+#right-container, 
+#center-container {
+    height:600px;
+    position:absolute;
+    top:0;
+}
+
+ul#log_printout {
+    display: block;
+    height: 330px;
+    overflow: scroll
+}
+
+#left-container, #right-container {
+    width: 300px;
+    color:#686c70;
+    text-align: left;
+    /*overflow: auto;*/
+    background-color:#fff;
+    background-repeat:no-repeat;
+    /*border-bottom:1px solid #ddd;*/
+}
+
+.result_body {
+    overflow:auto;
+    height:570px;
+}
+#left-container {
+    left:0;
+}
+
+#right-container {
+    right:0;
+    border-left:1px solid #ddd;
+}
+
+#right-container h4{
+    text-indent:8px;
+}
+
+#center-container {
+    width: 900px;
+    background-color:#FFFFFF;
+    color:#ccc;
+}
+
+.result_section {
+	/*	width: 100%;*/
+    font-size: 12px;
+    list-style:none;
+    margin:7px;
+}
+
+#log {
+    position: absolute;
+		top: 10px;
+		right:10px;
+    font-size:1.0em;
+}
+
+#infovis {
+    width:100%;
+    height:600px;
+    /*margin:auto;*/
+    overflow:hidden;
+}
+
+span.close {
+	color:#FF5555;
+	cursor:pointer;
+	font-weight:bold;
+	margin-left:3px;
+}
+
+span.name {
+  cursor: pointer;
+}
+
+
+/*TOOLTIPS*/
+.tip {
+	color: #111;
+	width: 139px;
+	background-color: white;
+	border:1px solid #ccc;
+	-moz-box-shadow:#555 2px 2px 8px;
+	-webkit-box-shadow:#555 2px 2px 8px;
+	-o-box-shadow:#555 2px 2px 8px;
+	box-shadow:#555 2px 2px 8px;
+	opacity:0.9;
+	filter:alpha(opacity=90);
+	font-size:10px;
+	font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
+	padding:7px;
+	text-align: left;
+	width:auto;
+	max-width:500px;
+}
+
+
+/* LIST OF EXPERTS */
+.field {
+	font-style: italic;
+	margin: .4ex 1ex;
+}
+
+#graphDetails {
+    margin-bottom:0px;
+    margin-top:5px;
+}
+input[disabled] {
+    opacity:0.5;
+    box-shadow:none;
+}
+#resetButton {
+    background-color: #933;
+    background-image: -webkit-gradient(linear,0 0,0 100%,from(#B55),to(#933));
+    background-image: -moz-linear-gradient(center top , #B55, #933);
+}
+#helptext {
+    width:630px;
+    /*padding:5px;*/
+}
+#center-container {
+    display:none;
+}
+.bar {
+    height:15px;
+    display:block;
+    background-color:#EEE;
+    border:1px solid #CCC;
+    float:left;
+    margin-bottom:1px;
+}
+.barchart {
+    line-height:18px;
+    padding-top:5px;
+}
+
+h2 {
+    font-size:23px;
+    margin-top:0px;
+    padding-top:0px;
+    line-height:1.3em;
+    margin-bottom:20px;
+}
+.result_section h2 {
+    font-size:16px;
+    padding:10px 0px;
+    margin:0px;
+}
+.result_section ul li {
+    margin-top:3px;
+}
+li input[type=checkbox] {
+    vertical-align:middle;
+}
+.orange-square, .blue-circle {
+    display:block;
+    float:left;
+    height:15px;
+    width:15px;
+    margin-right:3px;
+}
+.orange-square {
+    background-color:#ffa500;
+}
+.blue-circle {
+    background-color:#23A4FF;
+    border-radius:7px;
+}
+ul.visible {
+    margin-bottom:1.3em;
+    margin-left:20px;
+    list-style-type:disc;
+}
+#cutofflabel {
+    display:inline-block;
+    width:0px;
+    overflow:visible;
+    position:relative;
+    left:10px;
+    top:2px;
+    foont-size: 14px;
+}
+#queryCutoff {
+    background:transparent;
+    text-align:right;
+    padding-left:40px;
+}
+#cutofflabel img {
+    vertical-align:middle;
+    position:relative;
+    top:-2px;
+}
+.progress, .progress div {
+    height:10px;
+    margin-bottom:-10px;
+}
+.progress {
+    position:absolute;
+    top:0px;
+    left:0px;
+    width:100%;
+}
+.progress div {
+    background-color:#9999FF;
+    width:0%;
+    white-space:nowrap;
+    color:#FFF;
+    font-size:10px;
+    line-height:10px;
+}
+hr {
+    background:#efefef;
+}
+.tabs {
+    width: auto;
+    margin-bottom: 15px;
+    border: 0;
+    z-index: 10;
+}
+.tabs ul.titles li {
+    background: transparent;
+    /*padding-right: 1px;*/
+    line-height: normal;
+    display:inline;
+}
+.tabs ul {
+    padding-left:0px;
+}
+.tabs ul.titles {
+    list-style: none;
+    height:30px;
+    color: #5e6363;
+    font-size: 13px;
+}
+.tabs ul.titles li a {
+    text-decoration: none;
+    background-color: #eeeeee;
+    outline: none;
+    display:block;
+    float:left;
+//    width:100px;
+    width:150px;
+    height:30px;
+    line-height:30px;
+    text-align:center;
+    color: #5e6363;
+}
+
+.tabs ul.titles li a:hover {
+    background-color: #dddddd;
+    color: #002b44;
+}
+
+.tabs ul.titles li.activeTab a,
+.tabs ul.titles li.activeTab a:hover {
+    background-color: #fff;
+}
+.smalllogo {
+    margin-left:-5px;
+    vertical-align:middle;
+}
+.advanced label, input {
+    display:inline;
+}
+.advanced input[type=text] {
+    width:50px;
+}
+.advanced {
+    display:none;
+}
+.person_details {
+    margin-top:5px;
+}
+.person_details p {
+    margin-bottom:0px;
+}
+.person_details ul {
+    list-style:disc;
+    margin-left:20px;
+}
+.person_details li {
+    margin:0px;
+    margin-bottom:3px;
+}
+.ack {
+    padding-top:20px;
+    /*text-align:center;*/
+    color:#999;
+    margin:0px 20px;
+    /*font-size:8pt;*/
+}
+footer {
+    margin:0px 20px;
+    width:auto;
+}
+footer p.copyright {
+    margin-left:0px;
+    padding-left:0px;
+}
diff --git a/webapp/src/main/webapp/images/visualization/capabilitymap/key.png b/webapp/src/main/webapp/images/visualization/capabilitymap/key.png
new file mode 100644
index 0000000000000000000000000000000000000000..5954e234d91d91fef40080487de690f5d7123f29
GIT binary patch
literal 6766
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
OK$@z$Dy2#`kNyjz{Do8i

literal 0
HcmV?d00001

diff --git a/webapp/src/main/webapp/images/visualization/capabilitymap/refresh.png b/webapp/src/main/webapp/images/visualization/capabilitymap/refresh.png
new file mode 100644
index 0000000000000000000000000000000000000000..cea1abc44f00c97802e66a507d3dcaa7067de0f5
GIT binary patch
literal 1217
zcmbVMTWAzl7#@wZ@v>fmRjbyF6Ko#L?wm85-PxUHYqC4LacL(myBiH6n3I{4?3kU4
zGbiq3p&(M*1|M2zX{5!6V4sQ>LRCt|R8bKXFZ4-ETWnv<gCHTr2dn6rB%AgjSm?ma
zIsZBT_x<-7$#r!GmTg?dFiar3Q_j<Mwg1+?M!${IFA!bcB<UVfu=+^_Ihg6ttUk<U
z4K#rB7-_=?uj4j`sq5E^J)}o@Us5e2gnXTlXV?_YFl{?L8>xesuzh$yHxu0B^FMK{
zt|hoV5d|oA3YYYqRR<TUT}8DzsKzyJ$GdEsCs6_e6U2H(*>oi@!OieWbnhSY96O^z
z1{2(@Q$0$KO<4|RBOwq}K@_l27=qzeQ50KP0YJb5frmm6ic(mR0AS}Hj#_iHekm_!
z=4??Z!IcQHC7!QTDxpd^WH|#ojK||Xhad#0M$jEL3G#xb+f-wav8y_|O?1m-eMZ!0
z4Uq&#J)I4~uoY#V*mUO-MN`Im$mU@P@P^^XHKXm4JpRXx1-0Gcu#NdVcC8^trS<4<
zs)1?lUTw%%q~1uo9Gw;gm1RpEGO$Uqa)P5bAx+n$j3{Ox6kCBPfM^WDSSBhYGie|~
zF&b};2sMs{uuzD?j#x^Fq#^=@X(0|}F)hP5h((~B1nC+!Yq|uPDz4epsogm&d?i*&
zIT#VkDOy&!)&aSaMJ%^u*=(v1VHKq6rZ4;DnT=M)j(!Mh8OJi%nfyxn0`@bp|B8DS
ztNovx@zfdKZ;pR8OYMkupue4OeJack4>sw<ICM1b{&;2s9jmFV+)?y?`KEAe%@MHT
z=$1N=?3}Fst-bT&QnKU(bAl0bZ!^t@16tiZrttXc^0S946X#za`|Qqp$%YS_wwWWF
z?yanwN|w=`KieOToV@nY@yioy!Yj8df4G?6@YZCGbN|@ZHhysJ{VKouve(_c@94UZ
zca6QXWdB#Y$^B!i4sBPy9T}K<_T;quBvSfy)0bmc(DM{y9=N%v`>*CNJ~?nf814Om
zTmN9|X1C==!>Rh*Q&qdYHT`|Fx_NQn%%X=YZtpFl(cTwE`^ihIu6Ez}ec$+n&wmys
x8^@=W_Pw8e*mxx@1<tj+F<rSe@%PtH8+sY7s!WdB8$JK0l1+EX-z9sGyaZX8kt+ZI

literal 0
HcmV?d00001

diff --git a/webapp/src/main/webapp/js/visualization/capabilitymap/graph_new.js b/webapp/src/main/webapp/js/visualization/capabilitymap/graph_new.js
new file mode 100755
index 00000000..633ebf54
--- /dev/null
+++ b/webapp/src/main/webapp/js/visualization/capabilitymap/graph_new.js
@@ -0,0 +1,1128 @@
+/**
+ * Global variables
+ */
+var g; // global graph variable
+var queryQueue = [];
+var fullResultsQueue = [];
+var updatedPeople = [];
+var hidden = true;
+var detailsPane;
+var progressBar;
+var expandLastQuery = 0;
+var vis;
+var force;
+var force2;
+var nodedict = {};
+var linkdict = {};
+var labelAnchorDict = {};
+var labelAnchorLinkDict = {};
+var demos = [[
+    "telecommunications", '"grid computing"','"community resilience"',
+    '"emergency response"','"disaster management"','"natural disaster"',
+    '"natural hazard"','"incident response"',"tsunami","fire","bushfire",
+    '"environmental risk"',"earthquake", "flood", "cyclone",
+    '"environmental stress"','"spatial data"','"environmental law"'
+]];
+if (!console) var console = {
+    log : function() {}
+};
+var schemes = {
+    "white" : {
+        "backgroundcolor" : "#FFFFFF",
+        "capabilitycolor" : "#FFA500",
+        "nodestroke" : "#FFFFFF",
+        "fontcolor" : "#555",
+        "linkcolor" : "#B8B8B8",
+        "gradient" : function(percent) {
+            return percent
+        }
+    },
+    "black" : {
+        "backgroundcolor" : "#333333",
+        "capabilitycolor" : "#FFA500",
+        "nodestroke" : "#333333",
+        "fontcolor" : "#FFF",
+        "linkcolor" : "#777",
+        "gradient" : function(percent) {
+            return -percent + 125;
+        }
+    }
+};
+var scheme = schemes["white"];
+
+/**
+ * The Capability prototype represents a search term. It does not directly store the results of the
+ * search term, rather,the top-level unit is a group of People (see the Graph prototype).
+ */
+var Capability = function(term, cutoff, numpeople) {
+    this.term = term;
+    this.cutoff = cutoff;
+    this.numpeople = numpeople;
+}
+
+/**
+ * An individual person and their information.
+ */
+var Person = function(info) {
+    this.id = info["md_1"];
+    this.setInfo(info);
+}
+Person.prototype.fullname = function() {
+    return this.info["md_Z"] + " " + this.info["md_A"] + " " + this.info["md_B"];
+}
+Person.prototype.queryText = function(capabilities) {
+    return ("\"" + this.info["md_A"] + "+" + this.info["md_B"] + "\"+[" + capabilities.map(function(a) { return decodeURIComponent(a.term); }).join("+") + "]").replace(/<\/?strong>/g, "");
+}
+Person.prototype.setInfo = function(info) {
+    this.info = info;
+    if (this.info["md_Z"] === undefined) { this.info["md_Z"] = ""; } else { this.info["md_Z"] = this.info["md_Z"].replace(/^.*\|/g, ""); } // stop things like "PROFTAYLOR|PROF"
+    if (this.info["md_A"] === undefined) { this.info["md_A"] = ""; } else { this.info["md_A"] = this.info["md_A"].replace(/<\/?strong>/g, ""); }
+    if (this.info["md_B"] === undefined) { this.info["md_B"] = ""; } else { this.info["md_B"] = this.info["md_B"].replace(/<\/?strong>/g, ""); }
+    if (this.info["md_4"] === undefined) { this.info["md_4"] = ""; }
+    this.fullInfo = {};
+}
+
+/**
+ * A group of people, and their capabilities.
+ */
+var Group = function(g, c, people) {
+    this.graph = g;
+    this.people = people;
+    this.capabilities = c;
+}
+/**
+ * Merge a group with a new capability. This function is called on every group whenever a new
+ * capability is added, in order to `distribute' the new people among existing groups where applicable.
+ */
+Group.prototype.merge = function(capability, people) {
+    var that = this; // scoping trick...
+    var common = this.people.filter(function(a) { return people.indexOf(a) != -1; }); // this.people & people
+    var unmerged = people.filter(function(a) { return that.people.indexOf(a) == -1; });
+    this.people = this.people.filter(function(a) { return people.indexOf(a) == -1; });
+    if (!this.people.length) this.graph.removeGroup(this);
+    if (common.length) g.addGroup(new Group(this.graph, this.capabilities.concat(capability), common));
+    return unmerged;
+}
+/**
+ * Removes a person from the group. Will destroy the group if the last person is removed.
+ */
+Group.prototype.removePerson = function(person) { 
+    this.people = this.people.filter(function(a) {
+        return (a != person && a.id != person.id);
+    });
+    delete this.graph.people[person.id];
+    if (!this.people.length) this.graph.removeGroup(this);
+}
+
+/**
+ * And finally, the Graph prototype. This represents all the data associated with the capability map,
+ * including search terms ("capabilities") as well as people. The representation is hierarchical,
+ * with the data structure being composed of multiple Groups, with each group containing some
+ * capabilities. This way, the graph itself is completely oblivious to what capabilities exist in it,
+ * and must ask the groups about it when necessary. Nevertheless, everything is passed by reference
+ * and so equality between groups and capabilities will always hold.
+ */
+var Graph = function() {
+    this.groups = [];
+    this.people = {};
+}
+Graph.prototype.addGroup = function(g) {
+    this.groups.push(g);
+}
+Graph.prototype.createPerson = function(info) {
+    if (info["md_1"] in this.people) return this.people[info["md_1"]];
+    var p = new Person(info);
+    this.people[p.id] = p;
+    return p;
+}
+Graph.prototype.addCapability = function(c, people) {
+    if ((people = this.groups.reduce(function(ps, group) {
+        return group.merge(c, ps);
+    }, people)).length) this.groups.push(new Group(this, [c], people));
+}
+Graph.prototype.hasCapability = function(term) {
+    return this.getCapabilities().reduce(function(acc, v) {
+        return acc || v.term == term;
+    }, false);
+}
+Graph.prototype.getCapabilities = function() {
+    return this.groups.reduce(function(capabilities, group) {
+        return capabilities.concat(group.capabilities.reduce(function(cs, c) {
+            if (capabilities.indexOf(c) == -1) return cs.concat(c);
+            else return cs;
+        }, []));
+    }, []);
+}
+Graph.prototype.removeGroup = function(group) {
+    var that = this;
+    $.each(group.people, function(key, person) { delete that.people[person.id]; });
+    this.groups = this.groups.filter(function(a) { return a != group; });
+}
+Graph.prototype.removeCapability = function(term) {
+    var i = 0;
+    while (i < g.groups.length) {
+        var oldlen = g.groups[i].capabilities.length;
+        g.groups[i].capabilities = g.groups[i].capabilities.filter(function(a) {
+            return (a.term != term);
+        });
+        if (g.groups[i].capabilities.length != oldlen) {
+            var cs = {};
+            var shifted = false;
+            $.each(g.groups[i].capabilities, function(key, c) {
+                cs[c.term] = c;                
+            });
+            consideringGroups: for (var j = 0; j < g.groups.length; j++) {
+                if (j == i) continue;
+                if (g.groups[j].capabilities.length != g.groups[i].capabilities.length) continue;
+                for (var k = 0; k < g.groups[j].capabilities.length; k++) {
+                    if (!(g.groups[j].capabilities[k].term in cs)) continue consideringGroups;
+                }
+                g.groups[j].people = g.groups[j].people.concat(g.groups[i].people);
+                shifted = true;
+                break;
+            }
+            if (shifted || !g.groups[i].capabilities.length) {
+                g.groups[i].people = [];
+                this.removeGroup(g.groups[i]);
+                i--;
+            }
+        }
+        i++;
+    }
+}
+Graph.prototype.toDOT = function() {
+    var nodes = "";
+    var edges = "";
+    var cs = this.getCapabilities();
+    $.each(cs, function(key, c) {
+        var term = decodeURIComponent(c.term).replace(/"/g, "\\\"");
+        nodes += "    \"" + term + "\" [label=\"" + term + "\", shape=\"square\"];\n";
+    });
+    this.groups.forEach(function(group, i) {
+        nodes += "    G" + i + " [label=\"" + group.people.length + "\"];\n";
+        $.each(group.capabilities, function(key, c) {
+            edges += "    \"" + decodeURIComponent(c.term).replace(/"/g, "\\\"") + "\" -- G" + i + ";\n";
+        });
+    });
+    return "graph G {\n" + nodes + edges + "}\n";
+}
+Graph.prototype.tod3 = function() {
+    var d3_graph = {"nodes" : [], "labelAnchors" : [], "labelAnchorLinks" : [], "links" : []};
+    $.each(g.groups, function(i, group) {
+        var k = i;// + " " + group.people.length;
+        var node;
+        if (nodedict[k]) {
+            node = nodedict[k];
+            node["value"] = group.people.length;
+            node["numcaps"]  = group.capabilities.length;
+            node["label"] = group.people.length == 1 ? group.people[0].info["md_B"] : group.people.length;
+        } else {
+            node = {
+                "uid" : Math.random(),
+                "identifier" : i,
+                "label" : group.people.length == 1 ? group.people[0].info["md_B"] : group.people.length,
+                "nodetype" : "group",
+                "value" : group.people.length,
+                "numcaps" : group.capabilities.length
+            };
+            nodedict[k] = node;
+        }
+        d3_graph.nodes.push(node);
+        if (!labelAnchorDict[i]) {
+            labelAnchorDict[i] = [
+                {"uid" : Math.random(), "node" : node}, {"uid" : Math.random(), "node" : node}
+            ];
+        }
+        d3_graph.labelAnchors.push(labelAnchorDict[i][0]);
+        d3_graph.labelAnchors.push(labelAnchorDict[i][1]);
+    });
+    var capabilities = g.getCapabilities();
+    $.each(capabilities, function(i, capability) {
+        var node;
+        if (nodedict[capability.term]) node = nodedict[capability.term];
+        else {
+            node = {
+                "uid" : Math.random(),
+                "identifier" : capability.term,
+                "label" : decodeURI(capability.term).replace(/\"/g, ""),
+                "nodetype" : "capability",
+                "value" : capability.numpeople
+            };
+            nodedict[capability.term] = node;
+        }
+        d3_graph.nodes.push(node);
+        if (!labelAnchorDict[capability.term]) {
+            labelAnchorDict[capability.term] = [
+                {"uid" : Math.random(), "node" : node}, {"uid" : Math.random(), "node" : node}
+            ];
+        }
+        d3_graph.labelAnchors.push(labelAnchorDict[capability.term][0]);
+        d3_graph.labelAnchors.push(labelAnchorDict[capability.term][1]);
+    });
+    $.each(d3_graph.nodes, function(i, node) {
+        var k = d3_graph.labelAnchors[i * 2]["node"]["identifier"];// + " " + d3_graph.labelAnchors[i * 2 + 1]["node"]["label"];
+        console.log(k);
+        if (!labelAnchorLinkDict[k]) labelAnchorLinkDict[k] =
+            {
+                "uid" : Math.random(),
+                source : d3_graph.labelAnchors[i * 2],
+                target : d3_graph.labelAnchors[i * 2 + 1],
+                weight : 1
+            };
+        else {
+            labelAnchorLinkDict[k]["source"] = d3_graph.labelAnchors[i * 2];
+            labelAnchorLinkDict[k]["target"] = d3_graph.labelAnchors[i * 2 + 1];
+        }
+        d3_graph.labelAnchorLinks.push(labelAnchorLinkDict[k]);
+    });
+    $.each(g.groups, function(i, group) {
+        $.each(group.capabilities, function(j, c) {
+            var k = (i + " ") + (g.groups.length + capabilities.indexOf(c));
+            console.log(k);
+            if (!linkdict[k]) linkdict[k] = {"uid" : Math.random()};
+            linkdict[k]["source"] = d3_graph.nodes[i];
+            linkdict[k]["target"] = d3_graph.nodes[g.groups.length + capabilities.indexOf(c)];
+            linkdict[k]["weight"] = 1 - 1 / (0.01 + Math.pow(2, group.people.length));
+            linkdict[k]["value"] = group.people.length;
+            d3_graph.links.push(linkdict[k]);
+        });
+    });
+    return d3_graph;
+}
+Graph.prototype.export = function() {
+    return JSON.stringify(this, function(k, v) {
+        if (k == "graph" || k == "fullInfo") return;
+        else return v;
+    });
+}
+Graph.prototype.toPersonList = function() {
+    var list = "";
+    $.each(this.people, function(id, person) {
+         list += person.info["md_1"] + "|";
+    });
+    return list;
+}
+Graph.import = function(jsonstr) {
+    var g = new Graph();
+    var json = JSON.parse(jsonstr);
+    var capabilities = {};
+    $.each(json.people, function(i, person) { g.people[i] = new Person(person.info) });
+    $.each(json.groups, function(key, group) {
+        var cs = [];
+        var ps = [];
+        $.each(group.capabilities, function(key, c) {
+            if (!(c.term in capabilities)) capabilities[c.term] = c;
+            cs.push(capabilities[c.term]);
+        });
+        $.each(group.people, function(key, person) { ps.push(g.people[person.id]); });
+        var newgroup = new Group(g, cs, ps);
+        g.groups.push(newgroup);
+    });
+    return g;
+}
+
+/**
+ * The ProgressBar prototype manages the functionality of a visual progress bar on the page.
+ * Each copy of the ProgressBar represents a single bar on the page, which can be progressed and reset.
+ */
+var ProgressBar = function(bar, length) {
+    this.bar = bar;
+    this.length = length;
+    this.reset();
+}
+ProgressBar.prototype.reset = function(length, stage) {
+    if (length != undefined) this.length = length;
+    this.filled = 0;
+    this.bar.css({"width" : "0%", "background-color" : (stage == 1 ? "#99C" : "#C96")});
+    this.bar.empty();
+}
+ProgressBar.prototype.progress = function(amount, callback, text) {
+    var that = this;
+    this.filled += amount || 1;
+    this.bar.html("Loaded " + text + "&hellip;");
+    this.bar.css("width", Math.round(this.filled / this.length * 100) + "%");
+    if (that.filled >= that.length) this.reset(0, 0);
+    callback();
+}
+
+/**
+ * A FullResultQueryUnit is generated and queued when the full results for a person
+ * needs to be retrieved.
+ */
+var FullResultQueryUnit = function(capabilities, person) {
+    this.capabilities = capabilities;
+    this.person = person;
+}
+FullResultQueryUnit.prototype.fetch = function() {
+    var jsonurl = contextPath + "/visualizationAjax?vis=capabilitymap&person=" + encodeURI(this.person.id)  + "&callback=ipretFullResults";
+    var request = new JSONscriptRequest(jsonurl);
+    request.buildScriptTag();
+    request.addScriptTag();
+
+/*
+    TODO - create a new endpoint
+ var query = this.person.queryText(this.capabilities);
+ query = encodeURI(query);
+    var jsonurl = contextPath + "/search.html?collection=unimelb-researchers&type.max_clusters=40&&topic.max_clusters=40&form=faeJSON&query=" + query + "&num_ranks=1&callback=ipretFullResults"
+    var request = new JSONscriptRequest(jsonurl);
+    request.buildScriptTag();
+    request.addScriptTag();
+*/
+} 
+
+var showPanel = function(name) {
+    $(".titles li").removeClass("activeTab");
+    $(".titles li a[href=#" + name + "]").parent().addClass("activeTab");
+    $(".result_section").css("display", "none");
+    $("#" + name).css("display", "block");
+}
+/**
+ * The DetailsPanel prototype controls the display of information in the sidebar.
+ */
+var DetailsPanel = function(element) {
+    this.panel = element;   
+}
+DetailsPanel.prototype.clearDetails = function() {
+    $(this.panel).empty();
+}
+DetailsPanel.prototype.showDetails = function(mode, id) {
+    showPanel("logg");
+    
+    var that = this;
+    var departments = {};
+    var deptNames = [];
+    var title;
+    if (mode != "group") {
+        $(this.panel)
+            .empty()
+            .append(title = $("<h2>Term: " + decodeURIComponent(id) + "</h2>")
+                .bind("click", function() {
+                    highlight(id);
+                    detailsPane.showDetails(mode, id);
+                })
+                .css("cursor", "pointer")
+                .prepend($("<span/>").addClass("orange-square"))
+            )
+            .append($("<button>Remove capability</button>")
+                .bind("click", function() {
+                    g.removeCapability(id);
+                    that.clearDetails();
+                    render();
+                })
+            )
+            .append($("<span> </span>"))
+            .append($("<button>Expand</button>")
+                .bind("click", function() {
+                    expandLastQuery = 1;
+                    addKwd(decodeURIComponent(id));
+                })
+            ).append(
+                g.groups.reduce(function(div, group, i) {
+                    if (group.capabilities.map(function(c) { return c.term; }).indexOf(id) != -1) {
+                        $.each(group.people, function(key, person) {
+                            person.info["md_4"].split("|").forEach(function(i) {
+                                if (i !== undefined && i != "") {
+                                    if (!departments[i]) {
+                                        departments[i] = 0;
+                                        deptNames.push(i);
+                                    }
+                                    departments[i]++;
+                                }
+                            });
+                        });
+                        return div.append(that.groupInfo(i, group, mode, id));
+                    } else return div;
+                }, $("<div/>"))
+            );
+            title.after(DetailsPanel.makebarchart(deptNames, departments));
+    } else $(this.panel).empty().append(this.groupInfo(id, g.groups[id], mode, id));
+} 
+DetailsPanel.prototype.groupInfo = function(i, group, mode, id) {
+    var that = this;
+    var departments = {};
+    var deptNames = [];
+    $.each(group.people, function(key, person) {
+        person.info["md_4"].split("|").forEach(function (i) {
+            if (i !== undefined && i != "") {
+                if (!departments[i]) {
+                    departments[i] = 0;
+                    deptNames.push(i);
+                }
+                departments[i]++;
+            }
+        });
+    });
+    return $("<div/>")
+        .append(
+            $("<h2>" + "Group: " + group.capabilities.map(function(c) {
+                return decodeURIComponent(c.term);
+            }).join(", ") + "</h2>")
+                .bind("click", function() {
+                    highlight(i);
+                    detailsPane.showDetails("group", i);
+                })
+                .css("cursor", "pointer")
+                .prepend($("<span/>").addClass("blue-circle"))
+        )
+        .append($("<button>Remove group</button>")
+            .bind("click", function() {
+                g.removeGroup(group);
+                that.clearDetails();
+                render();
+            })
+        )
+        .append(DetailsPanel.makebarchart(deptNames, departments))
+        .append(
+            group.people.reduce(function(div, p, i) {
+                return div
+                    .append($("<div>")
+                        .addClass("person_details")
+                        .append(!p.info["md_3"] ? $("<span/>") : ($("<img/>")
+                            .attr("src", contextPath + p.info["md_3"])
+                            .attr("width", 50)
+                            .css({"float" : "right", "margin-top" : "10px", "clear" : "both"}))
+                        )
+                        .append($("<h3/>")
+                            .css({"clear" : "none"})
+                            .append($("<a>" + p.fullname() + "</a>")
+                                .attr("href", contextPath + "/display?uri=" + encodeURI(p.id))
+                                .attr("target", "_blank")
+                            )
+                            .append($("<span> </span>"))
+                            .append($("<a>[X]</a>")
+                                .css("cursor", "pointer")
+                                .bind("click", function(k) {
+                                    return function() {
+                                        group.removePerson(group.people[k]);
+                                        render();
+                                        that.showDetails(mode, id);
+                                    }
+                                }(i))
+                            )
+                        )
+                        .append($("<p>" + p.info["md_4"].replace(/\|/g, " / ") + "</p>").css("font-style", "italic"))
+                        .append(DetailsPanel.makeslidedown(p.queryText(group.capabilities), p.fullInfo["md_8"], "grants"))
+                        .append(DetailsPanel.makeslidedown(p.queryText(group.capabilities), p.fullInfo["md_U"], "publications"))
+
+                        
+                        
+                    )
+                
+            }, $("<div/>"))
+        );
+}
+DetailsPanel.makeslidedown = function(q, l, name) {
+    return l != undefined
+        ? $("<p>Matching " + name + ": " + l.length + " </p>")
+            .append($("<button>+</button>")
+                .bind("click", function() {
+                    if ($(this).html() == "+") {
+                        $(this).parent().children("ul").slideDown();
+                        $(this).html("-");
+                    } else {
+                        $(this).parent().children("ul").slideUp();
+                        $(this).html("+");
+                    }
+                })
+            )
+            .append((l || []).slice(0, 5).reduce(function(list, grant) {
+                return list.append($("<li>" + grant + "</li>"));
+            }, $("<ul/>")
+                .addClass("publist").css("display", "none"))
+                .append(l.length > 5 
+                    ? $("<li/>")
+                    /*.append(
+                        $("<a>(view more)</a>")
+                        .attr("href", contextPath + "?query=" + encodeURI(q))
+                        .attr("target", "_blank")
+                    )*/
+                    : ""
+                )
+            )
+        : null
+}
+DetailsPanel.makebarchart = function(deptNames, departments) {
+    var n = 0;
+    for (i in departments) n = Math.max(n, departments[i]);
+    var div = $("<p/>").addClass("barchart");
+    $.each(deptNames.sort(function(a, b) { return departments[b]-departments[a]; }), function(x, i) {
+        var percent = Math.ceil(departments[i]/n * 99);
+        if (percent < 0.2 * 99) return;
+        div
+            .append($("<span/>")
+                .addClass("bar")
+                .css({"width" : percent + "%", "margin-right" : "-" + percent + "%"})
+            )
+            .append($("<strong>" + i.replace(/<\/?strong>/g, "").substr(0,37) + (i.replace(/<\/?strong>/g, "").length > 37 ? "&hellip;" : "") + ": </strong>")
+                .attr("title", i)
+            )
+            .append($("<span>" + departments[i] + "</span>"))
+            .append($("<br/>"));
+    });
+    return div;
+};
+            
+var loadCapability = function() {
+    if (hidden) unhide();
+    if (!queryQueue.length) finish();
+    else {
+        disableSubButton(); 
+        var query = queryQueue.pop();
+        var jsonurl = contextPath + "/visualizationAjax?vis=capabilitymap&query=" + encodeURIComponent(query) + "&callback=ipretResults"
+        var request = new JSONscriptRequest(jsonurl);
+        request.buildScriptTag();
+        request.addScriptTag();
+    }
+}
+var addKwd = function(kwd) {
+    if (kwd !== false) {
+        if (!kwd) window.location.hash = encodeURI(queryElem.value + "|" + queryCutoffElem.value + "|" + expandLastQuery);
+        queryQueue.push(kwd || queryElem.value);
+    }
+    loadCapability();
+}
+var ipretResults = function(results) {
+    if (progressBar === undefined) {
+        progressBar = new ProgressBar($("#progressbar"));
+    }
+
+    var resultlist = results["results"];
+    if (!resultlist.length || resultlist[0]["md_1"] === undefined) enableSubButton();
+    else {
+        var term = resultlist[0]["query"];
+        if (!g.hasCapability(term)) {
+            var c = new Capability(term, queryCutoffElem.value, resultlist.length);
+            var people = [];
+            for (var i = 0; i < Math.min(queryCutoffElem.value, resultlist.length); i++) {
+                if (resultlist[i]["md_1"] == undefined) continue;
+                var person = g.createPerson(resultlist[i]);
+                people.push(person);
+                updatedPeople.push(person.id);
+            }
+            g.addCapability(c, people, resultlist.length);
+        }
+        if (expandLastQuery && resultlist[0]["clusters"]) {
+            expandLastQuery = 0;
+            resultlist[0]["clusters"].forEach(function(term) {
+                queryQueue.push(decodeURIComponent(term));
+            });
+            progressBar.reset(resultlist[0]["clusters"].length, 1);
+        }
+    }
+    progressBar.progress(1, loadCapability, decodeURI(term || ""));
+}
+
+var disableSubButton = function() {
+    subButton.disabled = true;
+    $("#sExpand").attr("disabled", true);
+    $("#resetButton").val("Stop");
+}
+var enableSubButton = function() {
+    subButton.disabled = false;
+    $("#sExpand").attr("disabled", false);
+    $("#resetButton").val("Reset");
+}
+var getLinkColor = function() {
+    var linkColor = $("#linkColor").val();
+    if (linkColor !== undefined) {
+        return linkColor;
+    }
+
+    return "#B8B8B8";
+}
+var render = function() {
+    if (!force) $("#infovis").empty();
+    //if (!g.groups.length) return;
+    
+    if (force) force.stop();
+    
+    var d3_graph = g.tod3();
+    var nodes = d3_graph.nodes;
+    var labelAnchors = d3_graph.labelAnchors;
+    var labelAnchorLinks = d3_graph.labelAnchorLinks;
+    var links = d3_graph.links;
+    var delta = !!force;
+    
+    
+    var w = $("#infovis").width(), h = 600;
+    if (schemes[$("#colorScheme").val()] !== undefined && scheme != schemes[$("#colorScheme").val()]) {
+        scheme = schemes[$("#colorScheme").val()];
+        $("#linkColor").val(scheme["linkcolor"]);
+    }
+    if (!delta) {
+        var outer = d3.select("#infovis").append("svg:svg").attr("width", w).attr("height", h);
+        var rescale = function() { vis.attr("transform", "translate(" + d3.event.translate + ")" + " scale(" + d3.event.scale + ")"); }
+        vis = outer
+            .append('svg:g')
+                .call(d3.behavior.zoom().scaleExtent([1, 5]).on("zoom", rescale))
+                .on("dblclick.zoom", null)
+            .append("svg:g")
+                .on("mousedown", function() {
+                    vis.call(d3.behavior.zoom().scaleExtent([1, 5]).on("zoom", rescale))
+                });
+        vis.append('svg:rect')
+            .attr('width', w).attr('height', h).attr('fill', scheme["backgroundcolor"])
+            .on("click", unhighlight)
+            .on("touchstart", unhighlight);
+        
+        edge_layer = vis.append("svg:g");
+        node_layer = vis.append("svg:g");//.attr('width', w).attr('height', h).attr("fill", "transparent");
+        label_layer = vis.append("svg:g");
+
+        var graph_gravity = parseInt($("#graph_gravity").val());
+        var graph_charge = parseInt($("#graph_charge").val());
+        var graph_linkdistance = parseInt($("#graph_linkdistance").val());
+
+        if (isNaN(graph_gravity)) { graph_gravity = 1; }
+        if (isNaN(graph_charge)) { graph_charge = -1500; }
+        if (isNaN(graph_linkdistance)) { graph_linkdistance = 40; }
+
+        force = d3.layout
+            .force().size([w, h])
+                .gravity(graph_gravity)
+                .charge(graph_charge)
+                .linkDistance(graph_linkdistance)
+                .linkStrength(function(x) {
+                    return x.weight * 10
+                });
+        
+        force2 = d3.layout
+            .force().gravity(0)
+            .linkDistance(0).linkStrength(8).charge(-100).size([w, h]);
+    }
+
+    transformto(force.nodes(), nodes);
+    transformto(force.links(), links);
+    transformto(force2.nodes(), labelAnchors);
+    transformto(force2.links(), labelAnchorLinks);
+    
+    if (delta) {
+        force.alpha(0.05);
+        force2.alpha(0.05);
+    }
+    force.start();
+    force2.start();
+    
+    link_data = edge_layer.selectAll("line.link").data(links, function(d) { return d.uid; });
+    link_data.enter().append("svg:line")
+        .attr("class", "link")
+        .style("stroke", getLinkColor())
+        .style("stroke-opacity", ".6")
+        .style("stroke-width", function(d) {
+            return Math.sqrt(d.value) + 1;
+        });
+    link_data.exit().remove();
+    link = edge_layer.selectAll("line.link");
+    
+    var node_data = node_layer.selectAll("g.node").data(force.nodes(), function(d) { return d.uid; });
+    var node = node_data.enter().append("svg:g");
+    console.log("nodes:");
+    console.log(node);
+    console.log(node_data.exit());
+    node
+        .attr("class", "node")
+        .style("cursor", "pointer")
+        .on("click", function(d) {
+            highlight(d.identifier);
+            detailsPane.showDetails(d.nodetype, d.identifier);
+        })
+        .on("touchstart", function(d) {
+            highlight(d.identifier);
+            detailsPane.showDetails(d.nodetype, d.identifier);        
+        })
+        .style("stroke", scheme["nodestroke"])
+        .style("stroke-width", 2)
+        .each(function(d, i) {
+            d3.select(this).selectAll("*").remove();
+            if (d.nodetype == "group") d3.select(this).append("svg:circle");
+            else d3.select(this).append("svg:rect");
+            if (d.nodetype == "group") {
+                d3.select(this).select("circle")
+                    .attr("r", function(d) {
+                        return 4 * d.value / queryCutoffElem.value + 4;
+                    })
+                    .style("fill", function(d) {
+                        var p = (85 - Math.min(1, d.numcaps / 4) * 50);
+                        var l = scheme["gradient"](p);
+                        var c = "hsl(240, " + (85 - p) + "%, " + l + "%)";
+                        return c;
+                    });
+            } else {
+                var dim = 2 * (Math.sqrt(d.value / 10) + 5);
+                d3.select(this).select("rect")
+                    .attr("width", dim).attr("height", dim)
+                    .attr("transform", "translate(-" + dim / 2 + ", -" + dim / 2 + ")")
+                    .style("fill", scheme["capabilitycolor"]);
+            }
+        })
+        .call(force.drag);
+    node_data.exit().remove();
+    node = d3.selectAll("g.node");
+    
+    var anchorLink = label_layer.selectAll("line.anchorLink").data(labelAnchorLinks, function(d) { return d.uid; });
+    anchorLink.exit().remove();
+    
+    var anchor_data = label_layer.selectAll("g.anchorNode").data(force2.nodes(), function(d) { return d.uid; });
+    var anchorNode = anchor_data.enter().append("svg:g").attr("class", "anchorNode");
+    anchorNode.append("svg:circle").attr("r", 0).style("fill", "#FFF");
+    anchorNode.append("svg:text")
+        .style("fill", scheme["fontcolor"])
+        .style("font-family", "Arial")
+        .style("font-size", 10)
+        .style("cursor", "pointer")
+        .style("font-weight", function(d) { return d.node.nodetype == "group" ? "normal" : "bold"})
+        .attr("class", function(d) { return "label-" + d.node.nodetype })
+        .style("text-shadow", function(d) {
+            return d.node.nodetype == "group" ? "none" :
+                "2px 0px " + scheme["nodestroke"] +
+                ", -2px 0px " + scheme["nodestroke"] + 
+                ", 0px 2px " + scheme["nodestroke"] +
+                ", 0px -2px " + scheme["nodestroke"];
+        }).on("click", function(d) {
+            highlight(d.node.identifier);
+            detailsPane.showDetails(d.node.nodetype, d.node.identifier);
+        });
+    label_layer.selectAll("g.anchorNode").each(function(d, i) {
+    	d3.select(this).select("text").text(i % 2 == 0 ? "" : d.node.label)
+    });
+    anchor_data.exit().remove();
+    anchorNode = label_layer.selectAll("g.anchorNode");
+    
+    var updateLink = function() {
+    	this.attr("x1", function(d) {
+    		return d.source.x;
+    	}).attr("y1", function(d) {
+    		return d.source.y;
+    	}).attr("x2", function(d) {
+    		return d.target.x;
+    	}).attr("y2", function(d) {
+    		return d.target.y;
+    	});
+    
+    }
+    var updateNode = function() {
+    	this.attr("transform", function(d) {
+    		return "translate(" + d.x + "," + d.y + ")";
+    	});
+    
+    }
+    force.on("tick", function() {
+        $("#log button:first-child").html("pause");
+    	force2.start();
+    	node.call(updateNode);
+    	anchorNode.each(function(d, i) {
+    		if(i % 2 == 0) {
+    			d.x = d.node.x;
+    			d.y = d.node.y;
+    		} else {
+    			var b = this.childNodes[1].getBBox();
+    			var diffX = d.x - d.node.x;
+    			var diffY = d.y - d.node.y;
+    			var dist = Math.sqrt(diffX * diffX + diffY * diffY);
+    			var shiftX = b.width * (diffX - dist) / (dist * 2);
+    			shiftX = Math.max(-b.width, Math.min(0, shiftX));
+    			var shiftY = 5;
+    			this.childNodes[1].setAttribute("transform", "translate(" + shiftX + "," + shiftY + ")");
+    		}
+    	});
+    	anchorNode.call(updateNode);
+    	link.call(updateLink);
+    	anchorLink.call(updateLink);
+    
+    });
+    
+    // refresh UI
+    $("#log").empty().append($("<button>pause</button>")
+        .bind("click", function() {
+            if ($(this).html() != "resume") {
+                $(this).html("resume");
+                force.stop();
+                force2.stop();
+            } else {
+                $(this).html("pause");
+                force.resume();
+                force2.resume();
+            }
+        })
+    ).append(" ").append($("<button>hide group labels</button>")
+        .bind("click", function() {
+            if ($(this).html() != "show group labels") {
+                $(this).html("show group labels");
+                $(".label-group").css("visibility", "hidden");
+            } else {
+                $(this).html("hide group labels");
+                $(".label-group").css("visibility", "visible");
+            }
+        })
+    );
+    $("#log_printout").empty().append($("<button>Delete selected</button>").bind("click", function() {
+        $("input[type=checkbox]:checked").each(function() {
+            g.removeCapability($(this).attr("name"));
+            $(this).parent().remove();
+        });
+        render();
+    }));
+    $.each(g.getCapabilities(), function(i, c) {
+        $("#log_printout")
+            .append($("<li/>")
+                .append($("<a> " + decodeURI(c.term) + "</a>")
+                    .bind("click", function() {
+                        highlight(c.term);
+                        detailsPane.showDetails("capability", c.term);
+                    })
+                    .css("cursor", "pointer")
+                )
+                .prepend($("<input/>").attr("type", "checkbox")
+                    .attr("name", c.term)                   
+                )
+            );
+    });
+}
+var highlight = function(identifier) {
+    unhighlight();
+    d3.selectAll("g.node").each(function(d, i) {
+        if (d.identifier == identifier) {
+            var that = this;
+            d3.select(this).select("*").style("stroke", "#6C9");
+            d3.selectAll("line.link").each(function(d, i) {
+                var nodeid = d3.select(that).datum().identifier;
+                if (d.source.identifier == nodeid || d.target.identifier == nodeid) {
+                    var strokewidth = parseFloat(d3.select(this).style("stroke-width").replace(/px/g, ""));
+                    d3.select(this).style("stroke", "#6C9")
+                        .style("stroke-width", (strokewidth + 2) + "px")
+                        .style("stroke-opacity", 1);
+                }
+            });
+        }
+    });
+}
+var unhighlight = function() {
+    detailsPane.clearDetails();
+    d3.selectAll("g.node").each(function(d, i) {
+        d3.select(this).select("*").style("stroke", scheme["nodestroke"]);
+    });
+    d3.selectAll("line.link").each(function(d, i) {
+        //console.log(d.source.identifier);
+        //console.log(d.target.identifier);
+        //console.log(nodeid);
+        console.log(d3.select(this).style("stroke"));
+        if (d3.select(this).style("stroke") == "#66cc99" || d3.select(this).style("stroke") == "rgb(102, 204, 153)") {
+            var strokewidth = parseFloat(d3.select(this).style("stroke-width").replace(/px/g, ""));
+            d3.select(this).style("stroke", getLinkColor())
+                .style("stroke-width", (strokewidth - 2) + "px")
+                .style("stroke-opacity", 0.6);
+        }
+    });
+}
+
+var generateGraphPersonList = function() {
+    $("#graphDetails").attr("value", g.toPersonList());
+}
+var generateGraphSVG = function() {
+    download(
+        "<?xml version=\"1.0\" standalone=\"no\"?>\n" + 
+        "<!DOCTYPE svg PUBLIC \"-//W3C//DTD SVG 1.1//EN\" " +  
+        "\"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd\">\n" +
+        $("#infovis").html().replace("<svg", "<svg xmlns=\"http://www.w3.org/2000/svg\" version=\"1.1\"")
+    , "svg");
+}
+var importGraphDetails = function() {
+    g = Graph.import($("#graphDetails").attr("value"));
+    render();
+}
+var download = function(content, ext) {
+    $("#download").attr("action", "http://115.146.84.185/search/download.php?ext=" + ext);
+    $("#exportContent").val(content);
+    $("#download").submit();
+}
+var showhideadvanced = function(button) {
+    if ($("#advanced_options").data("shown") != true) {
+        $("#advanced_options").slideDown();
+        $("#advanced_options").data("shown", true);
+        $(button).html("Hide advanced");
+    } else {
+        $("#advanced_options").slideUp();
+        $("#advanced_options").data("shown", false);        
+        $(button).html("Show advanced");
+    }
+}
+var restoreDefaults = function() {
+    $("#colorScheme").val("white");
+    $("#graph_gravity").val("1");
+    $("#graph_charge").val("-1500");
+    $("#graph_linkdistance").val("40");
+    $("#linkColor").val("#B8B8B8");
+}
+var finish = function() {
+    render();
+    showPanel("demo");
+    enableSubButton();
+    fullResultsQueue = [];
+    $.each(g.groups, function(key, group) {
+        $.each(group.people, function(key, person) {
+            if (updatedPeople.indexOf(person.id) != -1)
+                fullResultsQueue.push(new FullResultQueryUnit(group.capabilities, person));
+        })
+    });
+    updatedPeople = [];
+    progressBar.reset(fullResultsQueue.length, 2);
+    retrieveFullResults();
+}
+
+var retrieveFullResults = function() {
+    if (fullResultsQueue.length) fullResultsQueue.pop().fetch();
+}
+var ipretFullResults = function(result) {
+    if (g.people[result["results"][0]["md_1"]] != undefined) { // otherwise reset
+        g.people[result["results"][0]["md_1"]].setInfo(result["results"][0]);
+        g.people[result["results"][0]["md_1"]].fullInfo = result["results"][0];
+        progressBar.progress(1, retrieveFullResults, g.people[result["results"][0]["md_1"]].info["md_B"]);
+    }
+}
+
+var reset = function() {
+    if (queryQueue.length) queryQueue = []; // stop
+    else {
+        hidden = true;
+        g = new Graph();
+        force = undefined;
+        $("#infovis").html("");
+        window.location.hash = "";
+        
+        $("#log_printout").empty();
+        detailsPane.clearDetails();
+        $("#graphDetails").attr("value", "");
+        $(".result_section").each(function() {
+            $(this).html($(this).data("original"));
+        });
+        $("#resetButton").attr("disabled", "disabled");
+        $("#container").css({"box-shadow" : "none", "height" : "auto"});
+        $("#container").animate({"width" : "940px", "margin-left" : "0px"}, 500);
+        $("#center-container").fadeOut();
+        $("#helptext").fadeIn();
+    }
+    render();
+    
+}
+var unhide = function() {
+    hidden = false;
+    $("#resetButton").removeAttr("disabled");
+    if ($(window).width() > 1230) {
+        $("#container").css("box-shadow", "0px 0px 20px -6px #000000");
+        $("#container").animate({"height" : "600px", "width" : "1200px", "margin-left" : "-130px"}, 500);
+        $("#center-container").css("width", "900px");
+    } else {
+        $("#container").animate({"height" : "600px"});
+        $("#center-container").css("width", "640px");
+    }
+    $("#helptext").fadeOut();
+    $("#center-container").fadeIn();
+}
+   
+function run_demo(demoValues) {
+    demoValues.forEach(function(query) {
+        queryQueue.push(query); 
+    });
+    progressBar.reset(demoValues.length, 1);
+    addKwd(false);
+}
+
+var queryKeyDown = function(e) {
+    e.cancelBubble = true;
+    if(e.which === 13 || e.keyCode === 13) {
+        subButton.click();
+        e.returnValue = false;
+        e.cancel = true;
+        return false;
+    }
+    return true;
+}
+
+$(document).ready(function() {
+    // elements global variables
+    subButton = document.getElementById('add');
+    queryElem = document.getElementById('query');
+    queryCutoffElem = document.getElementById('queryCutoff');
+    detailsPane = new DetailsPanel('#inner-details');
+    g = new Graph();
+    
+    // results section text backup
+    $(".result_section").each(function() {
+        $(this).data("original", $(this).html());
+    });
+    
+    // querycutoffelem hadling
+    $(queryCutoffElem).bind("keyup", function() {
+        var that = this;
+        console.log($(this).val());
+        if ($(this).data("prev") != $(this).val() && $("#infovis").html() != "") {
+            $("#cutofflabel").empty().append($("<img/>")
+                .attr("src", contextPath + "/images/visualization/capabilitymap/refresh.png")
+                .bind("click", function() {
+                    $.each(g.getCapabilities(), function(i, c) {
+                        if (c.cutoff != queryCutoffElem.value) {
+                            g.removeCapability(c.term);
+                            queryQueue.push(decodeURI(c.term));
+                        }
+                    });
+                    $(this).unbind("click");
+                    $(this).parent().html("Cutoff:");
+                    progressBar.reset(queryQueue.length, 1);
+                    addKwd(false);
+                    return false;
+                })
+            );
+            setTimeout(function() {
+                $("#cutofflabel img").unbind("click");
+                $("#cutofflabel").html("Cutoff:");
+            }, 5000);
+        }
+        $(this).data("prev", $(this).val());
+    });
+    $(queryCutoffElem).data("prev", $(queryCutoffElem).val());
+    
+    // URL hash reading
+    if (window.location.hash != "") {
+        var preset = decodeURI(window.location.hash).slice(1).split("|");
+        queryElem.value = preset[0];
+        queryCutoffElem.value = preset[1];
+        if (preset[2] == "1") expandLastQuery = 1;
+        addKwd();
+    }
+    
+    // queryfield
+    $("#query").bind("focus", function() {
+        $(this).data("previous", $(this).val());
+        $(this).val("");
+    });
+    $("#query").bind("blur", function() {
+        if ($(this).val() == "") $(this).val($(this).data("previous"));
+        else $(this).data("previous", $(this).val());
+    });
+    $("#query").focus();
+    enableSubButton();
+    
+    // tabs
+    $(".tabs div ul li + li + li + li + li").parent().children(":last-child").find("a").trigger("click");
+    $(".tabs ul.titles li[class!=\"full\"]").bind("click", function(e) {
+        $(this).parent().children("li").removeClass("activeTab");
+        $(this).addClass("activeTab");
+        $(this).parent().parent().find("div .result_section").css("display", "none");
+        $("#" + $(this).find("a").attr("href").slice(1)).css("display", "block");
+        return false;
+        });
+    $(".tabs ul li:first-child").trigger("click");
+});
+
+var transformto = function(a, b) { // a = b
+    $.each(b, function(i, link) {
+        if (a.indexOf(link) == -1) a.push(link);
+    });
+    var i = 0;
+    while (i < a.length) {
+        if (b.indexOf(a[i]) == -1) a.splice(i, 1);
+        else i++;
+    }
+    
+}
+            
diff --git a/webapp/src/main/webapp/js/visualization/capabilitymap/jquery.color.js b/webapp/src/main/webapp/js/visualization/capabilitymap/jquery.color.js
new file mode 100755
index 00000000..64a0b071
--- /dev/null
+++ b/webapp/src/main/webapp/js/visualization/capabilitymap/jquery.color.js
@@ -0,0 +1,663 @@
+/*!
+ * jQuery Color Animations v@VERSION
+ * https://github.com/jquery/jquery-color
+ *
+ * Copyright 2013 jQuery Foundation and other contributors
+ * Released under the MIT license.
+ * http://jquery.org/license
+ *
+ * Date: @DATE
+ */
+(function( jQuery, undefined ) {
+
+	var stepHooks = "backgroundColor borderBottomColor borderLeftColor borderRightColor borderTopColor color columnRuleColor outlineColor textDecorationColor textEmphasisColor",
+
+	// plusequals test for += 100 -= 100
+	rplusequals = /^([\-+])=\s*(\d+\.?\d*)/,
+	// a set of RE's that can match strings and generate color tuples.
+	stringParsers = [{
+			re: /rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
+			parse: function( execResult ) {
+				return [
+					execResult[ 1 ],
+					execResult[ 2 ],
+					execResult[ 3 ],
+					execResult[ 4 ]
+				];
+			}
+		}, {
+			re: /rgba?\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
+			parse: function( execResult ) {
+				return [
+					execResult[ 1 ] * 2.55,
+					execResult[ 2 ] * 2.55,
+					execResult[ 3 ] * 2.55,
+					execResult[ 4 ]
+				];
+			}
+		}, {
+			// this regex ignores A-F because it's compared against an already lowercased string
+			re: /#([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})/,
+			parse: function( execResult ) {
+				return [
+					parseInt( execResult[ 1 ], 16 ),
+					parseInt( execResult[ 2 ], 16 ),
+					parseInt( execResult[ 3 ], 16 )
+				];
+			}
+		}, {
+			// this regex ignores A-F because it's compared against an already lowercased string
+			re: /#([a-f0-9])([a-f0-9])([a-f0-9])/,
+			parse: function( execResult ) {
+				return [
+					parseInt( execResult[ 1 ] + execResult[ 1 ], 16 ),
+					parseInt( execResult[ 2 ] + execResult[ 2 ], 16 ),
+					parseInt( execResult[ 3 ] + execResult[ 3 ], 16 )
+				];
+			}
+		}, {
+			re: /hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d?(?:\.\d+)?)\s*)?\)/,
+			space: "hsla",
+			parse: function( execResult ) {
+				return [
+					execResult[ 1 ],
+					execResult[ 2 ] / 100,
+					execResult[ 3 ] / 100,
+					execResult[ 4 ]
+				];
+			}
+		}],
+
+	// jQuery.Color( )
+	color = jQuery.Color = function( color, green, blue, alpha ) {
+		return new jQuery.Color.fn.parse( color, green, blue, alpha );
+	},
+	spaces = {
+		rgba: {
+			props: {
+				red: {
+					idx: 0,
+					type: "byte"
+				},
+				green: {
+					idx: 1,
+					type: "byte"
+				},
+				blue: {
+					idx: 2,
+					type: "byte"
+				}
+			}
+		},
+
+		hsla: {
+			props: {
+				hue: {
+					idx: 0,
+					type: "degrees"
+				},
+				saturation: {
+					idx: 1,
+					type: "percent"
+				},
+				lightness: {
+					idx: 2,
+					type: "percent"
+				}
+			}
+		}
+	},
+	propTypes = {
+		"byte": {
+			floor: true,
+			max: 255
+		},
+		"percent": {
+			max: 1
+		},
+		"degrees": {
+			mod: 360,
+			floor: true
+		}
+	},
+	support = color.support = {},
+
+	// element for support tests
+	supportElem = jQuery( "<p>" )[ 0 ],
+
+	// colors = jQuery.Color.names
+	colors,
+
+	// local aliases of functions called often
+	each = jQuery.each;
+
+// determine rgba support immediately
+supportElem.style.cssText = "background-color:rgba(1,1,1,.5)";
+support.rgba = supportElem.style.backgroundColor.indexOf( "rgba" ) > -1;
+
+// define cache name and alpha properties
+// for rgba and hsla spaces
+each( spaces, function( spaceName, space ) {
+	space.cache = "_" + spaceName;
+	space.props.alpha = {
+		idx: 3,
+		type: "percent",
+		def: 1
+	};
+});
+
+function clamp( value, prop, allowEmpty ) {
+	var type = propTypes[ prop.type ] || {};
+
+	if ( value == null ) {
+		return (allowEmpty || !prop.def) ? null : prop.def;
+	}
+
+	// ~~ is an short way of doing floor for positive numbers
+	value = type.floor ? ~~value : parseFloat( value );
+
+	// IE will pass in empty strings as value for alpha,
+	// which will hit this case
+	if ( isNaN( value ) ) {
+		return prop.def;
+	}
+
+	if ( type.mod ) {
+		// we add mod before modding to make sure that negatives values
+		// get converted properly: -10 -> 350
+		return (value + type.mod) % type.mod;
+	}
+
+	// for now all property types without mod have min and max
+	return 0 > value ? 0 : type.max < value ? type.max : value;
+}
+
+function stringParse( string ) {
+	var inst = color(),
+		rgba = inst._rgba = [];
+
+	string = string.toLowerCase();
+
+	each( stringParsers, function( i, parser ) {
+		var parsed,
+			match = parser.re.exec( string ),
+			values = match && parser.parse( match ),
+			spaceName = parser.space || "rgba";
+
+		if ( values ) {
+			parsed = inst[ spaceName ]( values );
+
+			// if this was an rgba parse the assignment might happen twice
+			// oh well....
+			inst[ spaces[ spaceName ].cache ] = parsed[ spaces[ spaceName ].cache ];
+			rgba = inst._rgba = parsed._rgba;
+
+			// exit each( stringParsers ) here because we matched
+			return false;
+		}
+	});
+
+	// Found a stringParser that handled it
+	if ( rgba.length ) {
+
+		// if this came from a parsed string, force "transparent" when alpha is 0
+		// chrome, (and maybe others) return "transparent" as rgba(0,0,0,0)
+		if ( rgba.join() === "0,0,0,0" ) {
+			jQuery.extend( rgba, colors.transparent );
+		}
+		return inst;
+	}
+
+	// named colors
+	return colors[ string ];
+}
+
+color.fn = jQuery.extend( color.prototype, {
+	parse: function( red, green, blue, alpha ) {
+		if ( red === undefined ) {
+			this._rgba = [ null, null, null, null ];
+			return this;
+		}
+		if ( red.jquery || red.nodeType ) {
+			red = jQuery( red ).css( green );
+			green = undefined;
+		}
+
+		var inst = this,
+			type = jQuery.type( red ),
+			rgba = this._rgba = [];
+
+		// more than 1 argument specified - assume ( red, green, blue, alpha )
+		if ( green !== undefined ) {
+			red = [ red, green, blue, alpha ];
+			type = "array";
+		}
+
+		if ( type === "string" ) {
+			return this.parse( stringParse( red ) || colors._default );
+		}
+
+		if ( type === "array" ) {
+			each( spaces.rgba.props, function( key, prop ) {
+				rgba[ prop.idx ] = clamp( red[ prop.idx ], prop );
+			});
+			return this;
+		}
+
+		if ( type === "object" ) {
+			if ( red instanceof color ) {
+				each( spaces, function( spaceName, space ) {
+					if ( red[ space.cache ] ) {
+						inst[ space.cache ] = red[ space.cache ].slice();
+					}
+				});
+			} else {
+				each( spaces, function( spaceName, space ) {
+					var cache = space.cache;
+					each( space.props, function( key, prop ) {
+
+						// if the cache doesn't exist, and we know how to convert
+						if ( !inst[ cache ] && space.to ) {
+
+							// if the value was null, we don't need to copy it
+							// if the key was alpha, we don't need to copy it either
+							if ( key === "alpha" || red[ key ] == null ) {
+								return;
+							}
+							inst[ cache ] = space.to( inst._rgba );
+						}
+
+						// this is the only case where we allow nulls for ALL properties.
+						// call clamp with alwaysAllowEmpty
+						inst[ cache ][ prop.idx ] = clamp( red[ key ], prop, true );
+					});
+
+					// everything defined but alpha?
+					if ( inst[ cache ] && jQuery.inArray( null, inst[ cache ].slice( 0, 3 ) ) < 0 ) {
+						// use the default of 1
+						inst[ cache ][ 3 ] = 1;
+						if ( space.from ) {
+							inst._rgba = space.from( inst[ cache ] );
+						}
+					}
+				});
+			}
+			return this;
+		}
+	},
+	is: function( compare ) {
+		var is = color( compare ),
+			same = true,
+			inst = this;
+
+		each( spaces, function( _, space ) {
+			var localCache,
+				isCache = is[ space.cache ];
+			if (isCache) {
+				localCache = inst[ space.cache ] || space.to && space.to( inst._rgba ) || [];
+				each( space.props, function( _, prop ) {
+					if ( isCache[ prop.idx ] != null ) {
+						same = ( isCache[ prop.idx ] === localCache[ prop.idx ] );
+						return same;
+					}
+				});
+			}
+			return same;
+		});
+		return same;
+	},
+	_space: function() {
+		var used = [],
+			inst = this;
+		each( spaces, function( spaceName, space ) {
+			if ( inst[ space.cache ] ) {
+				used.push( spaceName );
+			}
+		});
+		return used.pop();
+	},
+	transition: function( other, distance ) {
+		var end = color( other ),
+			spaceName = end._space(),
+			space = spaces[ spaceName ],
+			startColor = this.alpha() === 0 ? color( "transparent" ) : this,
+			start = startColor[ space.cache ] || space.to( startColor._rgba ),
+			result = start.slice();
+
+		end = end[ space.cache ];
+		each( space.props, function( key, prop ) {
+			var index = prop.idx,
+				startValue = start[ index ],
+				endValue = end[ index ],
+				type = propTypes[ prop.type ] || {};
+
+			// if null, don't override start value
+			if ( endValue === null ) {
+				return;
+			}
+			// if null - use end
+			if ( startValue === null ) {
+				result[ index ] = endValue;
+			} else {
+				if ( type.mod ) {
+					if ( endValue - startValue > type.mod / 2 ) {
+						startValue += type.mod;
+					} else if ( startValue - endValue > type.mod / 2 ) {
+						startValue -= type.mod;
+					}
+				}
+				result[ index ] = clamp( ( endValue - startValue ) * distance + startValue, prop );
+			}
+		});
+		return this[ spaceName ]( result );
+	},
+	blend: function( opaque ) {
+		// if we are already opaque - return ourself
+		if ( this._rgba[ 3 ] === 1 ) {
+			return this;
+		}
+
+		var rgb = this._rgba.slice(),
+			a = rgb.pop(),
+			blend = color( opaque )._rgba;
+
+		return color( jQuery.map( rgb, function( v, i ) {
+			return ( 1 - a ) * blend[ i ] + a * v;
+		}));
+	},
+	toRgbaString: function() {
+		var prefix = "rgba(",
+			rgba = jQuery.map( this._rgba, function( v, i ) {
+				return v == null ? ( i > 2 ? 1 : 0 ) : v;
+			});
+
+		if ( rgba[ 3 ] === 1 ) {
+			rgba.pop();
+			prefix = "rgb(";
+		}
+
+		return prefix + rgba.join() + ")";
+	},
+	toHslaString: function() {
+		var prefix = "hsla(",
+			hsla = jQuery.map( this.hsla(), function( v, i ) {
+				if ( v == null ) {
+					v = i > 2 ? 1 : 0;
+				}
+
+				// catch 1 and 2
+				if ( i && i < 3 ) {
+					v = Math.round( v * 100 ) + "%";
+				}
+				return v;
+			});
+
+		if ( hsla[ 3 ] === 1 ) {
+			hsla.pop();
+			prefix = "hsl(";
+		}
+		return prefix + hsla.join() + ")";
+	},
+	toHexString: function( includeAlpha ) {
+		var rgba = this._rgba.slice(),
+			alpha = rgba.pop();
+
+		if ( includeAlpha ) {
+			rgba.push( ~~( alpha * 255 ) );
+		}
+
+		return "#" + jQuery.map( rgba, function( v ) {
+
+			// default to 0 when nulls exist
+			v = ( v || 0 ).toString( 16 );
+			return v.length === 1 ? "0" + v : v;
+		}).join("");
+	},
+	toString: function() {
+		return this._rgba[ 3 ] === 0 ? "transparent" : this.toRgbaString();
+	}
+});
+color.fn.parse.prototype = color.fn;
+
+// hsla conversions adapted from:
+// https://code.google.com/p/maashaack/source/browse/packages/graphics/trunk/src/graphics/colors/HUE2RGB.as?r=5021
+
+function hue2rgb( p, q, h ) {
+	h = ( h + 1 ) % 1;
+	if ( h * 6 < 1 ) {
+		return p + (q - p) * h * 6;
+	}
+	if ( h * 2 < 1) {
+		return q;
+	}
+	if ( h * 3 < 2 ) {
+		return p + (q - p) * ((2/3) - h) * 6;
+	}
+	return p;
+}
+
+spaces.hsla.to = function ( rgba ) {
+	if ( rgba[ 0 ] == null || rgba[ 1 ] == null || rgba[ 2 ] == null ) {
+		return [ null, null, null, rgba[ 3 ] ];
+	}
+	var r = rgba[ 0 ] / 255,
+		g = rgba[ 1 ] / 255,
+		b = rgba[ 2 ] / 255,
+		a = rgba[ 3 ],
+		max = Math.max( r, g, b ),
+		min = Math.min( r, g, b ),
+		diff = max - min,
+		add = max + min,
+		l = add * 0.5,
+		h, s;
+
+	if ( min === max ) {
+		h = 0;
+	} else if ( r === max ) {
+		h = ( 60 * ( g - b ) / diff ) + 360;
+	} else if ( g === max ) {
+		h = ( 60 * ( b - r ) / diff ) + 120;
+	} else {
+		h = ( 60 * ( r - g ) / diff ) + 240;
+	}
+
+	// chroma (diff) == 0 means greyscale which, by definition, saturation = 0%
+	// otherwise, saturation is based on the ratio of chroma (diff) to lightness (add)
+	if ( diff === 0 ) {
+		s = 0;
+	} else if ( l <= 0.5 ) {
+		s = diff / add;
+	} else {
+		s = diff / ( 2 - add );
+	}
+	return [ Math.round(h) % 360, s, l, a == null ? 1 : a ];
+};
+
+spaces.hsla.from = function ( hsla ) {
+	if ( hsla[ 0 ] == null || hsla[ 1 ] == null || hsla[ 2 ] == null ) {
+		return [ null, null, null, hsla[ 3 ] ];
+	}
+	var h = hsla[ 0 ] / 360,
+		s = hsla[ 1 ],
+		l = hsla[ 2 ],
+		a = hsla[ 3 ],
+		q = l <= 0.5 ? l * ( 1 + s ) : l + s - l * s,
+		p = 2 * l - q;
+
+	return [
+		Math.round( hue2rgb( p, q, h + ( 1 / 3 ) ) * 255 ),
+		Math.round( hue2rgb( p, q, h ) * 255 ),
+		Math.round( hue2rgb( p, q, h - ( 1 / 3 ) ) * 255 ),
+		a
+	];
+};
+
+
+each( spaces, function( spaceName, space ) {
+	var props = space.props,
+		cache = space.cache,
+		to = space.to,
+		from = space.from;
+
+	// makes rgba() and hsla()
+	color.fn[ spaceName ] = function( value ) {
+
+		// generate a cache for this space if it doesn't exist
+		if ( to && !this[ cache ] ) {
+			this[ cache ] = to( this._rgba );
+		}
+		if ( value === undefined ) {
+			return this[ cache ].slice();
+		}
+
+		var ret,
+			type = jQuery.type( value ),
+			arr = ( type === "array" || type === "object" ) ? value : arguments,
+			local = this[ cache ].slice();
+
+		each( props, function( key, prop ) {
+			var val = arr[ type === "object" ? key : prop.idx ];
+			if ( val == null ) {
+				val = local[ prop.idx ];
+			}
+			local[ prop.idx ] = clamp( val, prop );
+		});
+
+		if ( from ) {
+			ret = color( from( local ) );
+			ret[ cache ] = local;
+			return ret;
+		} else {
+			return color( local );
+		}
+	};
+
+	// makes red() green() blue() alpha() hue() saturation() lightness()
+	each( props, function( key, prop ) {
+		// alpha is included in more than one space
+		if ( color.fn[ key ] ) {
+			return;
+		}
+		color.fn[ key ] = function( value ) {
+			var vtype = jQuery.type( value ),
+				fn = ( key === "alpha" ? ( this._hsla ? "hsla" : "rgba" ) : spaceName ),
+				local = this[ fn ](),
+				cur = local[ prop.idx ],
+				match;
+
+			if ( vtype === "undefined" ) {
+				return cur;
+			}
+
+			if ( vtype === "function" ) {
+				value = value.call( this, cur );
+				vtype = jQuery.type( value );
+			}
+			if ( value == null && prop.empty ) {
+				return this;
+			}
+			if ( vtype === "string" ) {
+				match = rplusequals.exec( value );
+				if ( match ) {
+					value = cur + parseFloat( match[ 2 ] ) * ( match[ 1 ] === "+" ? 1 : -1 );
+				}
+			}
+			local[ prop.idx ] = value;
+			return this[ fn ]( local );
+		};
+	});
+});
+
+// add cssHook and .fx.step function for each named hook.
+// accept a space separated string of properties
+color.hook = function( hook ) {
+	var hooks = hook.split( " " );
+	each( hooks, function( i, hook ) {
+		jQuery.cssHooks[ hook ] = {
+			set: function( elem, value ) {
+				var parsed, curElem,
+					backgroundColor = "";
+
+				if ( value !== "transparent" && ( jQuery.type( value ) !== "string" || ( parsed = stringParse( value ) ) ) ) {
+					value = color( parsed || value );
+					if ( !support.rgba && value._rgba[ 3 ] !== 1 ) {
+						curElem = hook === "backgroundColor" ? elem.parentNode : elem;
+						while (
+							(backgroundColor === "" || backgroundColor === "transparent") &&
+							curElem && curElem.style
+						) {
+							try {
+								backgroundColor = jQuery.css( curElem, "backgroundColor" );
+								curElem = curElem.parentNode;
+							} catch ( e ) {
+							}
+						}
+
+						value = value.blend( backgroundColor && backgroundColor !== "transparent" ?
+							backgroundColor :
+							"_default" );
+					}
+
+					value = value.toRgbaString();
+				}
+				try {
+					elem.style[ hook ] = value;
+				} catch( e ) {
+					// wrapped to prevent IE from throwing errors on "invalid" values like 'auto' or 'inherit'
+				}
+			}
+		};
+		jQuery.fx.step[ hook ] = function( fx ) {
+			if ( !fx.colorInit ) {
+				fx.start = color( fx.elem, hook );
+				fx.end = color( fx.end );
+				fx.colorInit = true;
+			}
+			jQuery.cssHooks[ hook ].set( fx.elem, fx.start.transition( fx.end, fx.pos ) );
+		};
+	});
+
+};
+
+color.hook( stepHooks );
+
+jQuery.cssHooks.borderColor = {
+	expand: function( value ) {
+		var expanded = {};
+
+		each( [ "Top", "Right", "Bottom", "Left" ], function( i, part ) {
+			expanded[ "border" + part + "Color" ] = value;
+		});
+		return expanded;
+	}
+};
+
+// Basic color names only.
+// Usage of any of the other color names requires adding yourself or including
+// jquery.color.svg-names.js.
+colors = jQuery.Color.names = {
+	// 4.1. Basic color keywords
+	aqua: "#00ffff",
+	black: "#000000",
+	blue: "#0000ff",
+	fuchsia: "#ff00ff",
+	gray: "#808080",
+	green: "#008000",
+	lime: "#00ff00",
+	maroon: "#800000",
+	navy: "#000080",
+	olive: "#808000",
+	purple: "#800080",
+	red: "#ff0000",
+	silver: "#c0c0c0",
+	teal: "#008080",
+	white: "#ffffff",
+	yellow: "#ffff00",
+
+	// 4.2.3. "transparent" color keyword
+	transparent: [ null, null, null, 0 ],
+
+	_default: "#ffffff"
+};
+
+})( jQuery );
diff --git a/webapp/src/main/webapp/js/visualization/capabilitymap/jsr_class.js b/webapp/src/main/webapp/js/visualization/capabilitymap/jsr_class.js
new file mode 100755
index 00000000..d267de4a
--- /dev/null
+++ b/webapp/src/main/webapp/js/visualization/capabilitymap/jsr_class.js
@@ -0,0 +1,82 @@
+// jsr_class.js
+//
+// JSONscriptRequest -- a simple class for making HTTP requests
+// using dynamically generated script tags and JSON
+//
+// Author: Jason Levitt
+// Date: December 7th, 2005
+//
+// A SECURITY WARNING FROM DOUGLAS CROCKFORD:
+// "The dynamic <script> tag hack suffers from a problem. It allows a page 
+// to access data from any server in the web, which is really useful. 
+// Unfortunately, the data is returned in the form of a script. That script 
+// can deliver the data, but it runs with the same authority as scripts on 
+// the base page, so it is able to steal cookies or misuse the authorization 
+// of the user with the server. A rogue script can do destructive things to 
+// the relationship between the user and the base server."
+//
+// So, be extremely cautious in your use of this script.
+//
+//
+// Sample Usage:
+//
+// <script type="text/javascript" src="jsr_class.js"></script>
+// 
+// function callbackfunc(jsonData) {
+//      alert('Latitude = ' + jsonData.ResultSet.Result[0].Latitude + 
+//            '  Longitude = ' + jsonData.ResultSet.Result[0].Longitude);
+//      aObj.removeScriptTag();
+// }
+//
+// request = 'http://api.local.yahoo.com/MapsService/V1/geocode?appid=YahooDemo&
+//            output=json&callback=callbackfunc&location=78704';
+// aObj = new JSONscriptRequest(request);
+// aObj.buildScriptTag();
+// aObj.addScriptTag();
+//
+//
+
+
+// Constructor -- pass a REST request URL to the constructor
+//
+function JSONscriptRequest(fullUrl) {
+    // REST request path
+    this.fullUrl = fullUrl; 
+    // Keep IE from caching requests
+    this.noCacheIE = '&noCacheIE=' + (new Date()).getTime();
+    // Get the DOM location to put the script tag
+    this.headLoc = document.getElementsByTagName("head").item(0);
+    // Generate a unique script tag id
+    this.scriptId = 'JscriptId' + JSONscriptRequest.scriptCounter++;
+}
+
+// Static script ID counter
+JSONscriptRequest.scriptCounter = 1;
+
+// buildScriptTag method
+//
+JSONscriptRequest.prototype.buildScriptTag = function () {
+
+    // Create the script tag
+    this.scriptObj = document.createElement("script");
+    
+    // Add script object attributes
+    this.scriptObj.setAttribute("type", "text/javascript");
+    this.scriptObj.setAttribute("charset", "utf-8");
+    this.scriptObj.setAttribute("src", this.fullUrl + this.noCacheIE);
+    this.scriptObj.setAttribute("id", this.scriptId);
+};
+ 
+// removeScriptTag method
+// 
+JSONscriptRequest.prototype.removeScriptTag = function () {
+    // Destroy the script tag
+    this.headLoc.removeChild(this.scriptObj);  
+};
+
+// addScriptTag method
+//
+JSONscriptRequest.prototype.addScriptTag = function () {
+    // Create the script tag
+    this.headLoc.appendChild(this.scriptObj);
+};
diff --git a/webapp/src/main/webapp/templates/freemarker/visualization/capabilitymap/capabilityMap.ftl b/webapp/src/main/webapp/templates/freemarker/visualization/capabilitymap/capabilityMap.ftl
new file mode 100644
index 00000000..8584e830
--- /dev/null
+++ b/webapp/src/main/webapp/templates/freemarker/visualization/capabilitymap/capabilityMap.ftl
@@ -0,0 +1,167 @@
+${scripts.add(
+    '<script type="text/javascript" src="${urls.base}/js/d3.min.js"></script>',
+    '<script type="text/javascript" src="${urls.base}/js/jquery-ui/js/jquery-ui-1.8.9.custom.min.js"></script>',
+    '<script type="text/javascript" src="${urls.base}/js/visualization/capabilitymap/jquery.color.js"></script>',
+    '<script type="text/javascript" src="${urls.base}/js/visualization/capabilitymap/jsr_class.js"></script>',
+    '<script type="text/javascript" src="${urls.base}/js/visualization/capabilitymap/graph_new.js"></script>'
+)}
+
+${stylesheets.add(
+    '<link rel="stylesheet" href="${urls.base}/js/jquery-ui/css/smoothness/jquery-ui-1.8.9.custom.css" />',
+    '<link rel="stylesheet" type="text/css" href="${urls.base}/templates/freemarker/edit/forms/css/autocomplete.css" />',
+    '<link rel="stylesheet" type="text/css" href="${urls.base}/css/visualization/personlevel/page.css" />',
+    '<link rel="stylesheet" type="text/css" href="${urls.base}/css/visualization/visualization.css" />',
+    '<link rel="stylesheet" type="text/css" href="${urls.base}/css/visualization/capabilitymap/graph.css" />'
+)}
+
+<script language="JavaScript" type="text/javascript">
+    var contextPath = "${urls.base}";
+    $(document).ready(function() {
+        var loadedConcepts = $.ajax({
+            url: contextPath + "/visualizationAjax?vis=capabilitymap&data=concepts",
+            type: "GET",
+            async: false,
+            success: function(result) {
+                return result;
+            }
+        });
+        var conceptArray = $.parseJSON(loadedConcepts.responseText);
+        $("#query").autocomplete({
+            source: conceptArray
+        });
+    });
+</script>
+<div class="main" id="main-content" role="main">
+    <div class="col-8">
+        <h2>Capability Map</h2>
+        <p>Build a &lsquo;first pass&rsquo; capability map by typing in a<!-- set of--> search term<!--s--> that could be said to represent a broad research capability.</p>
+    </div>
+
+    <div id="queryform">
+        <p>
+            <span>
+                <input name="query" id="query" size="34" value="" onfocus="" accesskey="q" onblur="" type="text" onkeydown="queryKeyDown(event);">
+                <label id="cutofflabel" for="queryCutoff">Cutoff:</label>
+                <input id="queryCutoff" name="queryCutoff" type="text" title="Cutoff" size="4" value="10">
+                <input type="submit" value="Search" id="add" type="button" onclick="addKwd();">
+                <input value="Search and Expand" type="submit" id="sExpand" onclick="expandLastQuery = 1; addKwd();">
+                <input value="Reset" id="resetButton" type="submit" onclick="reset()" disabled>
+                <!-- a style="display:inline-block; float:right; line-height:32px; height:32px; cursor:pointer" onclick="showhideadvanced(this)">Show advanced</a -->
+            </span>
+        </p>
+    </div>
+
+    <hr style="clear:both;">
+
+    <div id="container">
+        <div id="helptext">
+            <p>
+                Welcome to the Capability Mapping tool.
+                This tool visualises how researchers relate to other
+                researchers via search terms.
+            </p>
+            <h3>Getting Started</h3>
+            <p>
+                Enter a research area into the search field above and press ‘Search’.
+                The resulting diagram displays the search term, rendered in orange,
+                connected to the blue group of researchers that are active in that area.
+                Enter another search term to see how researchers from both searches relate.
+                Keep adding search terms to build a capability map.
+            </p>
+            <p>
+                Tip: you can expand a broad search term into smaller concepts
+                by clicking &lsquo;search and expand&rsquo;.
+            </p>
+            <h3>Interacting with the visualisation</h3>
+            <p>
+                By clicking on any node in the visualisation,
+                additional information can be viewed in the
+                ‘Info’ tab on the right-hand side.
+                For groups of people, the participants in the group
+                and their information can be viewed,
+                and individual researchers can be removed from the graph.
+                Selecting a search term will display all attached groups.
+                Under each group full information for each person is retrieved,
+                and the number of matching grants and publications
+                for each researcher within the mapped capabilities is shown.
+                Clicking on a researcher's name will lead to the original search
+                results.
+            </p>
+            <h4>Visual cues</h4>
+            <p>
+                To make the visualisation easier to read,
+                search terms and groups are scaled according
+                to the number of results returned.
+                Groups are also given different shades
+                according to the number of connected search terms.
+                The darker the shade, the more search terms a group is connected to.
+            </p>
+            <h3>Advanced features</h3>
+            <h4>Changing the cutoff value</h4>
+            <p>
+                The amount of researchers retrieved for each search term
+                for is limited by the cutoff value in the search form
+                (10 by default).
+                Increasing this cutoff will increase the likelihood
+                of an intersection between different search terms.
+                This will also increase the complexity of the graph,
+                however, and may make it difficult to identify patterns.
+            </p>
+        </div>
+
+        <div id="center-container">
+            <div id="log"></div>
+            <div id="infovis"></div>
+            <div class="progress"><div id="progressbar"></div></div>
+        </div>
+
+        <div id="right-container">
+            <div class="tabs">
+                <ul  class="titles">
+                    <li><a href="#demo">Search terms</a></li>
+                    <li><a href="#logg">Info</a></li>
+                    <!-- li><a href="#extractData">Data</a></li -->
+                </ul>
+
+                <div class="result_body">
+                    <div class="result_section" id="demo">
+                        <h2>Current search terms</h2>
+                        <ul id="log_printout">
+                            <li>This panel displays a list of the search terms currently
+                                on the graph. Search for something to begin.</li>
+                        </ul>
+                        <p style="position:absolute; bottom:10px">
+                            <img src="${urls.base}/images/visualization/capabilitymap/key.png" alt="Key">
+                        </p>
+                    </div>
+                    <div class="result_section" id="logg">
+                        <div id="inner-details">
+                            <p>
+                                This panel displays information about individual
+                                search terms and groups. Click on a group to display
+                                its information.
+                            </p>
+                        </div>
+                    </div>
+
+                    <!-- div class="result_section" id="extractData">
+                        <h2>Extract Data</h2>
+                        <p>
+                            Import:
+                            <button disabled>SVG</button>
+                            <button onclick="importGraphDetails();">JSON</button>
+                            <br>
+                            Export:
+                            <button onclick="generateGraphSVG();">SVG</button>
+                            <button onclick="download(g.export(), 'json')">JSON</button>
+                            <button onclick="download(g.toDOT(), 'gv')">DOT</button>
+                            <button onclick="generateGraphPersonList();">MRW</button>
+                        </p>
+                        <textarea id="graphDetails" style="width:99%; height:450px; border:1px solid #EEE; padding:0px;"></textarea>
+                    </div -->
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+