Transcript slides - University of Maryland at College Park

Choropleth Maps go to the Web
Human-Computer Interaction Laboratory
Department of Computer Science
Ben Shneiderman, Kent Norman, Evan Golub,
Haixia Zhao, Wayne Menezes
Overview




What is “Dynamap” ?
Dynamap – Desire for Web-based solutions
Dynamap – DHTML solution
- layers and tables
Dynamap – Java solutions
- single image w/palette manipulation
- shape-based image construction
What Is Dynamap

Motivation:


Typical applications


Exploratory Tasks, Specific Scenario Tasks
Technology originally used


To provide a convenient, dynamic visual representation of
summary data (example problem space - census data)
Visual Basic 6.0, ESRI MapObjects 2.0
Issues

Uses MapObjects 2.0, not web-based, performance with all
3180 counties not real-time
Dynamap – Web Based Solutions

Motivation in moving to Web-based solutions:


Example target minimum equipment:




Dynamap goes to Web with equal (or greater) functionality when
compared to the Visual Basic implementation.
Pentium II 400 Mhz
56k Modem
1024x768 screen resolution
Performance:


Smooth interactive filtering
Minimum network transfer and delay
Dynamap – Dynamic HTML

Technology We Used



GIFs with transparent backgrounds
HTML tables with colored cells
Dynamic HTML (Cascading Style Sheets, JScript)
Dynamap – Dynamic HTML Screenshot
Dynamap – Dynamic HTML Screenshot
Dynamap – Dynamic HTML

Technology We Used




GIFs with transparent backgrounds
HTML tables with colored cells
Dynamic HTML (Cascading Style Sheets, JScript)
Issues



current version only works in IE5+ due to browser conflicts on
DHTML standards (short-term issue)
performance can decrease noticeably with large number of layers
(i.e.: though it is possible to have as many as 5000 layers
displayed in Internet Explorer, if there are more than around 150,
response time becomes noticeable)
laborious to introduce chloropleth coloring (one-time cost)
Dynamap – Java Solutions

Technology We Used in Solution 1

Base map GIF with up to 124 (5*5*5 - 1) regions
Dynamap – Java Solution 1 Screenshot
Dynamap – Java Solutions

Technology We Used in Solution 1


Base map GIF with up to 124 (5*5*5 - 1) regions
Issues with Solution 1

Number of regions: for more regions, need to either use
different base image type (e.g.: BMP) which would increase
download time or use multiple base maps to increase
number of regions which will increase image processing time
Dynamap – Java Solutions

Technology We Used in Solution 1


Issues with Solution 1


Base map GIF with up to 124 (5*5*5 - 1) regions
Number of regions: for more regions, need to either use
different base image type (e.g.: BMP) which would increase
download time or use multiple base maps to increase
number of regions which will increase image processing time
Technology We Used in Solution 2

GeoTools open-source Java toolkit to construct image
Dynamap – Java Solution 2 Screenshots
Dynamap – Java Solution 2 Screenshots
Dynamap – Java Solutions

Technology We Used in Solution 1


Issues with Solution 1


Number of regions: for more regions, need to either use
different base image type (e.g.: BMP) which would increase
download time or use multiple base maps to increase
number of regions which will increase image processing time
Technology We Used in Solution 2


Base map GIF with up to 124 (5*5*5 - 1) regions
GeoTools open-source Java toolkit to construct image
Issues with Solution 2


Greater download time
Response time suffers with higher number of regions
Conclusion



Dynamic queries with choropleth maps are an attractive,
responsive way to present summary information
Dynamic queries can be implemented for the Web!
There are trade-offs…


Low bandwidth – might not want to have to load GeoTools or
might want to reduce number of images to transfer
Slow processor – might not want to have high number of regions
or might want to reduce number of sliders
Human-Computer Interaction Laboratory
www.cs.umd.edu/hcil/census