Project 1 will be an
individual project to give people practice with writing an
in processing and get
everyone ready to contribute to the group projects to come.
focus on a recreation of the John Snow cholera map but this time
focusing on an interactive version of the map with additional
dynamic data. In this case the data is already pre-processed to
appropriate size and in an easily readable form. You also know
'the answer' is so you can concentrate on the visualization side
things. Those assumptions won't hold true for the later
I will provide you
with several datafiles. These include a vector map of the area
locations of the dead and a set of randomized dates.
are located at:
More data on the
original versions of these files can be found here:
I modified the format a bit and
added in a randomized sex and age of the victims based on data
Naples cholera outbreak in 1884.
The data files include:
gives the coordinates of the streets as a series of line
- pumps -
gives the locations of the 13 nearby pumps
gives the number of deaths for each day of the outbreak
the location of each death in the deathdays file, in order,
plus information on the age and sex of the victim.
> 80 5
another piece of
potentially useful information is the percentage of
people in each age group in general during that time as the
of people of different ages who died may not be the same as the
population. I haven't found any data for London at that time,
census data from 1850 at
following breakdown, so we will assume the same breakdown for
You will be creating
a web page that embeds a processing window that lets a user
this data. This web page should be viewable under Explorer,
Firefox. The application should have obvious and intuitive
you need ...
you need to add ...
- a well drawn map of the area including the locations of the
- a graph showing the number of deaths per day
- ability to move the mouse over a given area to choose which
to visualize - this should afect the deaths visible on the map
the graph - at minimum all cholera deaths prior to that date
shown on the map and the graph
- the graph and the map should be stable (ie they should not
when new data is added to it)
- the graph and the map should be well labelled
- the visualization itself should be well labelled (what,
where, who made it, where the data came from, etc)
- you should check your visualization with a colour blindness
checking web page to see that its ok
- the map and graph should update quickly when the user
you need to add ...
- more data to the map - major street names and the
of the brewery and the work house
- ability to easily see on the map whether a particular victim
male or female
- ability to easily see on the map the age of a particular
- a graph showing the distribution of deaths by sex and age
- the graph should mark the day the pump handle was removed
- the map should be able to show either deaths on this day or
- ability to cluster the data on the map into a grid that
number of dead in each grid cell (even with this small amount
the points are starting to overwhelm) and the user should be
vary the size of the clusters.
- ability to zoom in/out and pan around the map
start by getting processing installed and doing some initial
tests to load in the data and start displaying it. The Visualizing
texbook has some nice discussions and sample code.
You should then
start to draw some sketches of what the interface might look
how you want to arrange and display the data. How are you going to
use of the screen real-estate. All of the different visualizations
use should be visible simultaneously.
What kinds of charts are you going to use for the various data.
good starting point for that is:
create a web page that describes your work on
the project including an
embedded processing window (with a max size of 1280 by 700) and a
to a gzipped file containing the
source code and all other necessary files to make it run locally.
organized page should function as a README file and describe the
you implemented along with any special features that you added. It
should include screenshots of all the major features.
linking this web page to the course notes
so please send me a nice 1024 x 768 jpg image of your
should be named p1.<your_last_name>.jpg.
Web pages like this can
be very helpful later on in helping you build up a portfolio of
work when you start looking for a job so please put some effort
We will take one class period to look through these visualizations
everyone can see a variety of solutions to the
problem, and a variety of implementations. You will be expected to
about your work.