The question and other materials required are attached below.
Data Set: Antibiotics
After the World War II, antibiotics were considered as “wonder drugs”, since they were easy remedy for what had been intractable ailments. To learn which drug worked most effectively for which bacterial infection, performance of the three most popular antibiotics on 16 bacteria were gathered.
Table 1: Burtin?s data
|
? |
Antibiotics |
? |
||
|
Bacteria |
Penicilin |
Streptomycin |
Neomycin |
Gram Staining |
|
Aerobacter aerogenes |
870 |
1 |
1.6 |
Negative |
|
Brucella abortus |
1 |
2 |
0.02 |
Negative |
|
Brucella anthracis |
0.001 |
0.01 |
0.007 |
Positive |
|
Diplococcus pneumoniae |
0.005 |
11 |
10 |
Positive |
|
Escherichia coli |
100 |
0.4 |
0.1 |
Negative |
|
Klebsiella pneumoniae |
850 |
1.2 |
1 |
Negative |
|
Mycobacterium tuberculosis |
800 |
5 |
2 |
Negative |
|
Proteus vulgaris |
3 |
0.1 |
0.1 |
Negative |
|
Pseudomonas?aeruginosa |
850 |
2 |
0.4 |
Negative |
|
Salmonella?(Eberthella) typhosa |
1 |
0.4 |
0.008 |
Negative |
|
Salmonella schottmuelleri |
10 |
0.8 |
0.09 |
Negative |
|
Staphylococcus albus |
0.007 |
0.1 |
0.001 |
Positive |
|
Staphylococcus aureus |
0.03 |
0.03 |
0.001 |
Positive |
|
Streptococcus?fecalis |
1 |
1 |
0.1 |
Positive |
|
Streptococcus hemolyticus |
0.001 |
14 |
10 |
Positive |
|
Streptococcus viridans |
0.005 |
10 |
40 |
Positive |
The values in the table represent the minimum inhibitory concentration (MIC), a measure of the effectiveness of the antibiotic, which represents the concentration of antibiotic required to prevent growth in vitro. The reaction of the bacteria to Gram staining is described by the covariate ?gram staining?. Bacteria that are stained dark blue or violet are Gram-positive. Otherwise, they are Gram-negative.
Dataset:
.csv
??Download .csvand?
.txt
??Download .txtfiles
Assignment
Your task is to design?a static (i.e., single image) visualization?that you believe effectively communicates the data (20 points) and provide?a short write-up?(no more than 2 pages long) describing your design (60 points).
You are free to use any graphics or charting tool –including drafting it by hand. Go to?
Useful Resources
??Download Useful Resources
provided by the instructor for a list of visualization tools. You may find it most instructive to create the chart from scratch using Excel or a graphics API of your choice.
While you must use the data set given, note that you are free to transform the data as you see fit. You are also free to incorporate external data as you see fit. Your chart image should be interpretable without looking at your short write-up. Appropriate title, axis labels or legends are needed.
The write-up should include but not limited to the following components:
? Describe how your created the visualization, what software was used, any external data used, the steps you took to create the visualization etc. (10 points)
? Tell the story of the figure. In the big picture, what story (or stories) are you trying to tell?? (10 points)
? Justification of visual encodings. Use the what-how-why framework to analyze your vis. Data: What are data and dataset types? Encodings: marks and channels used? Tasks: What are tasks of your vis? (20 points)
? Effectiveness of visualization. In your write-up, you should provide a rigorous rationale for your design Document the visual encodings you used and why they are appropriate for the data. These decisions include the choice of chart type, size, color, scale, and other visual elements, as well as the use of sorting or other data transformations. How do these decisions facilitate effective communication? Any pros or cons of design? (20 points)
The writing quality of the report will also be evaluated in grading. Please proofread your submission before submitting it and make sure it is free of spelling and grammar issues. (10% of the grade.)
Submission Instructions:
Save the write-up as a Word file and name it as M4_VisDesign, save the visualization as an image format (PNG or JPEG). Submit both files.
If you only include the image inside the Word file, you will lost the 20 points for not including the individual image file.
| Bacteria | Penicilin | Streptomycin | Neomycin | Gram Staining |
| Aerobacter aerogenes | 870 | 1 | 1.6 | negative |
| Brucella abortus | 1 | 2 | 0.02 | negative |
| Brucella anthracis | 0.001 | 0.01 | 0.007 | positive |
| Diplococcus pneumoniae | 0.005 | 11 | 10 | positive |
| Escherichia coli | 100 | 0.4 | 0.1 | negative |
| Klebsiella pneumoniae | 850 | 1.2 | 1 | negative |
| Mycobacterium tuberculosis | 800 | 5 | 2 | negative |
| Proteus vulgaris | 3 | 0.1 | 0.1 | negative |
| Pseudomonas aeruginosa | 850 | 2 | 0.4 | negative |
| Salmonella (Eberthella) typhosa | 1 | 0.4 | 0.008 | negative |
| Salmonella schottmuelleri | 10 | 0.8 | 0.09 | negative |
| Staphylococcus albus | 0.007 | 0.1 | 0.001 | positive |
| Staphylococcus aureus | 0.03 | 0.03 | 0.001 | positive |
| Streptococcus fecalis | 1 | 1 | 0.1 | positive |
| Streptococcus hemolyticus | 0.001 | 14 | 10 | positive |
| Streptococcus viridans | 0.005 | 10 | 40 | positive |
1
Tools
Visualization Toolkits
A variety of useful toolkits have been designed to help support information visualization
applications. Some include support for the full visualization pipeline from data to interactive
graphics, while others focus only on a subset, typically graphics and interaction.
o D3 – A JavaScript library for data-driven DOM manipulation, interaction and animation.
Includes utilities for visualization techniques and SVG generation.
o Processing and Processing.js – A popular Java-like graphics and interaction language and
IDE. Processing has a strong user community with many examples.
o Protovis – JavaScript visualization language, predecessor of d3.
o HTML/!JavaScript/XML – use standard web technologies to build the visualization. You
may use libraries such as jQuery, Dojo, and the Google Maps API to help build your
visualization.
o PolyMaps ? create map displays with JavaScript & SVG
o Flare – Visualization toolkit for Adobe Flash
o Modest Maps – Mapping library for Flash
o Prefuse – Visualization toolkit for Java
o Improvise – Java system supporting coordinated views
o InfoVis Toolkit – A Java visualization library, from INRIA France
o Piccolo – A Java library for zoomable UIs, from the University of Maryland (Java and
.NET)
o VTK – A scientific visualization library (C++ with wrappers for other languages)
Statistical Data Analysis Tools
o Microsoft Excel? supports charts, graphs, or histograms generated from specified
groups of cells.
o Tableau for Student? get Tableau free license as a student.
o Tableau Public – a free version of Tableau which publishes to the web
o GGplot2 – a graphics language for R
o GGobi – visualizations for multivariate data
o Improvise – a visualization tool supporting a variety of visualization types
o MATLAB – optimized for solving engineering and scientific problems.
Network Analysis Tools
o NodeXL graph analysis plug-in for Excel
2
o Gephi – a graph analysis application
o GUESS – a combined visual/scripting interface for graph analysis
o Pajek – another popular network analysis tool
o NetworkX – graph analysis library for Python
o SNAP – graph analysis library for C++
Color Tools
o kuler – Color Palette Generator
o Color Brewer
Tutorials & Tips
In addition to our workshops, these tutorials could be useful for Assignment 3, final project,
and your future visualization work.
HTML, CSS
o Basics:
o Mozilla Develop Network (HTML, CSS).
o CSS Zen Garden
o Extras
o Sass is easy to learn and powerful way to write
o Compass contains a lot of reusable patterns.
o Twitter Bootstrap is a popular template.
Javascript
o Fundamental JavaScript Concepts
o Mozilla Developer Network
o JavaScript Garden is a good reference to language quirks and gotchas.
o Eloquent Javascript ? free online book by Marijn Haverbeke
o A re-introduction to JavaScript (JS Tutorial) on Mozilla Developer Network
o JavaScript: The Good Parts ? Douglas Crockford (See also his YUI videos)
o Learning JavaScript Design Patterns by Addy Osmani
o Debugging:
o Learn to use the Webkit Inspector (or Firebug if you?re a firefox fan.)
3
o Learn useful short keys? the basic one is cmd+shift+Ifor opening inspector. Then
you can learn more by clicking the gear button on the bottom right and see the
shortcuts tab
o use JSHint to avoid syntactic bugs
o Addy Osmani’s list of good JavaScript style guide
o Javascript MVC
o Backbone.js- Simple MVC Backbone
o Backbone Fundamentals
o Angular.js – better but takes more time to learn (say 1-2 weeks to really understand
concepts)
o Start with egghead.io and thinkster.io.
o Angular’s official document is a pain. When you look at it, make sure to look at
comments so you learn from others’ confusion. Hopefully the community is big, so
it should get better overtime though.
o Use yeoman
o Useful stuff from mg-newsletter
o Angular for jQuery developer
o Make sure to have AngularJS Batarang in Chrome so you can debug scope.
o Javascript Library like Lodash (An arguably better fork of underscore.) ? make sure to use
them only if you need. Sometimes d3 helpers are enough.
o a lodash tutorial
o Need an in-memory database for your vis prototype? – try datavore or crossfilter
o Syntax alternatives: Coffeescript, MS TypeScript
d3.js
o Interactive Data Visualization for the Web Scott Murray(free online version)
o Scott Murray?s Original tutorial (shorter)
o Vadim’s Intro Slides
o J?r?me Cukier & Scott Murray?s d3 tutorial at Strata 2013 (slides)
o (older) d3 tutorial at Visweek 2012 by J?r?me Cukier, Jeff Heer, and Scott Murray.
(source, demo, cheatsheet)
o More extensive list of examples can be found in d3’s tutorial
page and gallery and Christophe Viau’s gallery.
Git & Github
4
o Git Tutorials
o Git Official Docs
o Visual Git Guide
o A Successful Branching Model
o Github
o Use Github’s issue tracker, so you can refer to issues in your commit messages
using # followed by issue no.
o Working in a team? Use Github’s Pull Request so you can do code review.
o Pull Request Workflows by Patrick Cozzi
o Extras
o Interactive Rebase
o Need to merge multiple repos (e.g. using datavore in another project)?
Use git subtree and DO NOT use git submodule.
o GUI
o Using git with command line is generally fast but using SourceTree is easier for
reviewing your code before committing or committing a part of your changes
and reduce chances that you will run a wrong command (such as push wrong
branch to master).
o More Tips
o Atomic Commit is a good practice.
o Stash is useful when you have unfinished messy things and need to switch
branches to work on something else.
Data Sets
o Civic Data Sets for the Pacific Northwest
o 30 Places to Find Open Data on the Web ? Visual.ly
o Office for National Statistics (UK) – a repository of detailed statistics about Great
Britain and Northern Irland
o World Bank Data Catalog
o CDC NCHS Data – CDC’s National Center for Health Statistics Data Access
o Machine Learning Repository – large variety of maintained data sets
5
o Links
Visualization Blogs
o Flowing Data
o Information Aesthetics
o Visual Complexity
o Edward Tufte: Ask E.T. Forum
o Statistical Modeling, Causal Inference, and Social Science
o Information is Beautiful
o Datalysed
o Kelso Cartography
o Visual
Other Resources Lists
o Tamara Munzner’s Course at UBC
o John Stasko’s Course at Georgia Tech
