31:T608,{ // If this page is outside of Observable, set the default styles to approximate // the appearance of the Observable Look and Feel. if (ui === "custom") { return htl.html`

Note: This is an archived version of an Observable Notebook supplement for the RAMPVIS PhilTransA submission titled: 
"Visualization for Epidemiological Modelling: Challenges, Solutions, Reflections & Recommendations"
For the live version, see here: https://observablehq.com/@kaimdx/rampvis-idiom-gmap

`; } else { return htl.html`

Note: This is a live version of the Observable Notebook supplement for the RAMPVIS PhilTransA submission titled 
"Visualization for Epidemiological Modelling: Challenges, Solutions, Reflections & Recommendations"

`; } }32:T534,Choosing the data attribute or dimension to cluster is one of the main design choices when creating GMaps. After discussion with the epidemiologists, it was identified that there are two candidates: - the location of a person when he/she is infected (such as school or shops) - the infection chain a person belongs to: an infection chain starts with one infected person at time t0. This person infects others, who in turn infect more people. All the people who have the common source infection form a chain. The image below shows part of the GMap where the colour indicates the location of where a person is infected (such as school or shop). Each numbered node is a person, and two are connected if one infects the other (the infection is directional but this is not shown in the visualisation). The person with a red number and a circle is the 'source' of each infection chain or cluster. Below we have a GMap of coloured areas that types of place at which infections occur. The node background colours shows the type of location at which each person is infected. Two people have the same background colour if they are infected at the same (type of) place. All the neighbouring persons with the same infection place type form a cluster. There are 10 different types of locations including restaurant, school, shop, office, etc.33:T4dc,The epidemiologists found the second visualisation, which uses the infection chain for clustering, most useful. As the coloured cluster background is visually dominant, choosing which data attribute to use is equivalent to selecting the attribute that is most important for the analysis because other attributes will not be as prominent if represented visually. This requires the designers and users to identify the most important data attribute, which is a useful exercise in understanding the visualisation requirements. The other reason that the first visualisation, which uses location type for clustering, is less favourable is that it has more and smaller clusters, which is less informative for the users. Knowing that there are many small clusters can be potentially useful, but usually it is the larger clusters that are of more interest to the users. Another disadvantage of having many small clusters is the increased visual complexity, which usually has a negative impact on visual analysis. Finally, having many small clusters makes it less feasible to use other visual channels to represent additional data attributes. For example, the node shape is more likely to interfere with cluster boundary when the cluster is small.34:[{"id":"9032ef3f85576dbed90d78cf63cbdae4f8f0b8f28f42dbfdb3d9a127e0a0f2335276771d7f61b56d6a5ef52fd5e2bde9cc82acc6ccea5774239b7cc433ba4e15","href":"https://static.observableusercontent.com/files/9032ef3f85576dbed90d78cf63cbdae4f8f0b8f28f42dbfdb3d9a127e0a0f2335276771d7f61b56d6a5ef52fd5e2bde9cc82acc6ccea5774239b7cc433ba4e15","name":"gmap-location-as-cluster-crop.png","type":"image/png","lastModified":1628637389007.787,"size":1536731},{"id":"4d06fc374b09d92d26217382e0e9285a964f002f647381cdf40f67795c3e38a062b3ca91853446e6b49165996caab7fbe63eb741d512be62de047d31f0503d11","href":"https://static.observableusercontent.com/files/4d06fc374b09d92d26217382e0e9285a964f002f647381cdf40f67795c3e38a062b3ca91853446e6b49165996caab7fbe63eb741d512be62de047d31f0503d11","name":"ConnectedNodeAsCluster_50_zoom_in.png","type":"image/png","lastModified":1628638345956.211,"size":713921},{"id":"ab515fdfa87c18dbe238211e139d72ac8184a11e91a6308271fdf06fc93ac03ce491c54d9cf50943c4455d3b9f150fc7b6ce9cda422023d1a175c1d2c21f5ec0","href":"https://static.observableusercontent.com/files/ab515fdfa87c18dbe238211e139d72ac8184a11e91a6308271fdf06fc93ac03ce491c54d9cf50943c4455d3b9f150fc7b6ce9cda422023d1a175c1d2c21f5ec0","name":"ConnectedNodeAsCluster_50_1000px.png","type":"image/png","lastModified":1628640273919.194,"size":1430847}] 2f:{"title":"RAMPVIS : GMap","cells":[{"id":0,"value":"md`# RAMPVIS : GMap`","pinned":false,"hidden":false,"mode":"ojs"},{"id":796,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":360,"value":"---\n## 1. TASK & USERS - User Story","pinned":false,"hidden":false,"mode":"md"},{"id":660,"value":"* As an epidemiological model builder\n* I would like to know\n * if there is any error in the simulation model\n * how the parameters affect the output\n * the effect of different isolation policy options\n* so that I can \n * detect and fix any errors in the simulation code\n * choose parameter values that lead to outputs that match reality\n * develop an intuitive feel and understanding of the model dynamics \n * understand the balance between the loss of freedom and the size of the infected population for different isolation policies\n * guide the quantitative measures we extract from the simulations\n * conceptualise control measures that tackle key features of the dynamics","pinned":false,"hidden":false,"mode":"md"},{"id":128,"value":"---\n\n## 2. DATA","pinned":false,"hidden":false,"mode":"md"},{"id":673,"value":"The data used for the GMap visualisation is generated by the simulation model (written in Java), which is available on Github https://github.com/ScottishCovidResponse/Contact-Tracing-Model.\n\nThe dataset used to generate the GMap visualisations below are available on GitHub: https://github.com/jeewanhyongju/InfectionMap-Visualization","pinned":false,"hidden":false,"mode":"md"},{"id":7,"value":"---\n\n## 3. GMap","pinned":false,"hidden":false,"mode":"md"},{"id":678,"value":"Traditional graph visualization methods often fail to capture the underlying structural information, clustering, and neighbourhoods in the network.\n\n**GMap** provides a way to overcome some of these shortcomings with the help of the geographic map metaphor: nodes are grouped with coloured backgrounsd, similar to regions on a geographical map.\n\n**GMap** has the added advantage of familiarity comparing to other graph visualisation methods, as most people are very familiar with maps and even enjoy carefully examining them.","pinned":false,"hidden":false,"mode":"md"},{"id":371,"value":"---\n## 4. ORIGIN & CONTEXT","pinned":false,"hidden":false,"mode":"md"},{"id":683,"value":"**GMap** was originally introduced by [Gansner et al (2010)](https://doi.org/10.1109/PACIFICVIS.2010.5429590) as a way to show clusters in a graph. \n\n**GMap** was later evaluated in a user study by [Jianu et al (2014)](https://doi.org/10.1109/TVCG.2014.2315995) together with other set visualisation methods including BubbleSet and LineSet. It was found that the GMap can improve memorability comparing to the alternatives. For group membership tasks, GMap can outperform alternatives if its visual design is slightly changed by connecting separate areas that belong to the same group. During the user study, the authors manually edited the images produced by the GMap to achieve this result. We did not implement this feature in the project because of time and resource constraints.","pinned":false,"hidden":false,"mode":"md"},{"id":13,"value":"___\n\n## 5. EXAMPLES","pinned":false,"hidden":false,"mode":"md"},{"id":689,"value":"This is an example showing [the relationships among the musicians and groups](http://gmap.cs.arizona.edu/description) using GMap.","pinned":false,"hidden":false,"mode":"md"},{"id":53,"value":"---\n## 6. DESCRIPTION & USE","pinned":false,"hidden":false,"mode":"md"},{"id":814,"value":"$32","pinned":false,"hidden":false,"mode":"md"},{"id":805,"value":"await FileAttachment(\"gmap-location-as-cluster-crop.png\").image({width:800})\n","pinned":false,"hidden":false,"mode":"ojs"},{"id":819,"value":"The other alternative is to use the infection chain as the cluster, i.e., all the people in the same infection chain has the same background colour. In the image below, the node shape is used to show the location information as discussed earlier (circle is restaurant, square is school, etc.).\nThis is a GMap of coloured areas that represent infection networks.","pinned":false,"hidden":false,"mode":"md"},{"id":810,"value":"await FileAttachment(\"ConnectedNodeAsCluster_50_zoom_in.png\").image({width:800})","pinned":false,"hidden":false,"mode":"ojs"},{"id":824,"value":"The size of the clusters gives the users some idea of how many people are infected and how fast the spread is (a larger cluster usually means a faster spread). The epidemiological modellers can mentally compare the visualisation with what they expected to identify any obvious issues in the model. Comparing visualisations from different isolation policies allow the users to see the difference in policy impact and their dynamics.","pinned":false,"hidden":false,"mode":"md"},{"id":410,"value":"---\n## 7. REFLECTION","pinned":false,"hidden":false,"mode":"md"},{"id":446,"value":"### 7.0 Reflective Discussion ","pinned":false,"hidden":false,"mode":"md"},{"id":728,"value":"Because of the 'emergency' nature of the project, there was no time for the usual user requirement analysis or design/brainstorming session to generate design ideas. The team had to start working on the data and generating visualisation straightaway. Usually this is not recommended, but it seemed to work well in this particular case. The requirement and design work seem to become part of the visualisation creation: we learn more about the data and user requirements as we create/test more visualisations.","pinned":false,"hidden":false,"mode":"md"},{"id":865,"value":"The GMap is part of the contact tracing team effort. It is designed to work with statistical analysis and other visualisations (such as dynamic node-link graph visualisation) efforts that were ongoing in parallel at the same time. The results from these efforts complement each other and provide multiple perspectives of the target problem.","pinned":false,"hidden":false,"mode":"md"},{"id":415,"value":"### 7.1 What Worked","pinned":false,"hidden":false,"mode":"md"},{"id":705,"value":"$33","pinned":false,"hidden":false,"mode":"md"},{"id":434,"value":"### 7.2 What Didn't Work","pinned":false,"hidden":false,"mode":"md"},{"id":709,"value":"Because the model tries to simulate the population within a fairly large region, there can be easily thousands, tens of thousands, or even more people in the infection network. This is close to the limit of how big a graph GMap can visualise, if not over. The image below shows the 50 largest infection chains from the simulation results. It is difficult to see the details of each cluster, even when many smaller clusters are excluded.","pinned":false,"hidden":false,"mode":"md"},{"id":835,"value":"await FileAttachment(\"ConnectedNodeAsCluster_50_1000px.png\").image({width:800})","pinned":false,"hidden":false,"mode":"ojs"},{"id":838,"value":"Another challenge is that the computation of the GMap layout can be quite slow, especially for large graphs. This will make it not suitable for interactive visualisation, even if a JavaScript version existed.","pinned":false,"hidden":false,"mode":"md"},{"id":461,"value":"### 7.3 Recommendations & Opportunities","pinned":false,"hidden":false,"mode":"md"},{"id":718,"value":"Choosing the data attribute for clustering can be a useful and important exercise, as it forces the users and design to identify the most important data attribute, which is not always clear when a project starts, even for the users.\n\nThere is a chance that the most important data attribute leads to a GMap visualisation with many small clusters (luckily not in this case). The increased visual complexity is likely to hinder visual analysis. It will be an interesting research challenge to adapt GMap for this situation. \n\nThere are also scalability issues for both visual complexity and response time. Multi-level/scale graph visualisation techniques can be potentially applied to improve the effectiveness of GMaps when the graph is very large, and more algorithmic improvement is needed to make GMap feasible for interactive visualisation.","pinned":false,"hidden":false,"mode":"md"},{"id":624,"value":"### 7.4 Who Was Involved?\n","pinned":false,"hidden":false,"mode":"md"},{"id":721,"value":"**Kai Xu**, **Cagatay Turkay**, **Sibylle Mohr**, **Louise Matthews** and **Daniel Archambault**","pinned":false,"hidden":false,"mode":"md"},{"id":16,"value":"---\n\n## 8. REFERENCES","pinned":false,"hidden":false,"mode":"md"},{"id":723,"value":"**Gansner, E.R., Hu, Y. and Kobourov, S. (2010).
**\n_GMap: Visualizing graphs and clusters as maps_
\n2010 IEEE Pacific Visualization Symposium (PacificVis), pp. 201–208.
\nhttps://doi.org/10.1109/PACIFICVIS.2010.5429590","pinned":false,"hidden":false,"mode":"md"},{"id":872,"value":"**Jianu, R. et al. (2014).
**\n_How to Display Group Information on Node-Link Diagrams: An Evaluation_
\nIEEE Transactions on Visualization and Computer Graphics, 20(11), pp. 1530–1541.
\nhttps://doi.org/10.1109/TVCG.2014.2315995","pinned":false,"hidden":false,"mode":"md"},{"id":845,"value":"---","pinned":false,"hidden":false,"mode":"md"},{"id":793,"value":"import { ui } from \"@mootari/environment\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}