CS171 Visualization Alexander Lex alex@seas.harvard.edu Maps - - PowerPoint PPT Presentation

▶
cs171 visualization
SMART_READER_LITE
LIVE PREVIEW

CS171 Visualization Alexander Lex alex@seas.harvard.edu Maps - - PowerPoint PPT Presentation

Mar 02, 2024 221 likes •1.3k views

CS171 Visualization Alexander Lex alex@seas.harvard.edu Maps [xkcd] Homework 2 Review Grade Distribution Average Grade: 7.74 P1: 9.06 P2: 8.30 P3: 8.18 P4: 6.81 Average Time Spent: 35h

slide-1
SLIDE 1

CS171 Visualization

Alexander Lex alex@seas.harvard.edu

[xkcd]

Maps

slide-2
SLIDE 2

Homework 2 Review

slide-3
SLIDE 3

Grade Distribution

Average Grade: 7.74 P1: ¡9.06 ¡ P2: ¡8.30 ¡ P3: ¡8.18 ¡ P4: ¡6.81 ¡ Average ¡Time ¡Spent: ¡35h ¡

slide-4
SLIDE 4

Difficulty

slide-5
SLIDE 5

Time

slide-6
SLIDE 6

Difficulty

slide-7
SLIDE 7

Maps

slide-8
SLIDE 8

Principles

Special type of Spatial Data Use maps when spatial relationships are paramount Map Tasks:

Find Location / Feature (county, country, city, street) Find Route Identify attribute associated with location (elevation, land/water, GDP) Compare attributes between Locations/Features

slide-9
SLIDE 9

Map Projections

slide-10
SLIDE 10

Why projections?

Earth is a (flattened) Sphere Need to project or “unfold” the hull

  • f the sphere to fit onto paper/

screens Relevant attributes:

Area, Shape, Direction, 
 Bearing, Distance, Scale

slide-11
SLIDE 11

Mercartor Projection

Gerardus Mercator, 1569 Projection onto a cylinder wrapped around the globe conformal map projection; that is, angles are preserved. All lines of constant bearing are straight lines. Constant bearing means constant compass heading - developed for sailors

slide-12
SLIDE 12

D3 / M. Bostock

Mercator Projection

slide-13
SLIDE 13

Mercator Projection of Mars

Based on slide from Hanrahan

Circular craters map to circles

slide-14
SLIDE 14

Why Mercator is Problematic

Traditional map, used to teach geography Massive distortion of area distant from equator “unfair to the Global South, making places that are mostly trees, snow, and better-off white people look huge, and the places where most of the world’s population lives look puny"

http://giscollective.org/slippy-map-projections-explained/

slide-15
SLIDE 15

Mercartor Projection

Mercator works really great if you’re, say, Ferdinand Magellan looking for a compass bearing that will take you around Cape Horn, because all of the latitude and longitude lines and angles in between lay out nice and straight on the map like we experience them in real life. It also works well if you’re Google and you want a map image that you can neatly slice up into little squares that your server sends to a customer’s browser. North is always up, your hometown doesn’t look squished or slanted when you zoom in to it, and everybody’s happy.

http://giscollective.org/slippy-map-projections-explained/

slide-16
SLIDE 16

Mercartor Puzzle

slide-17
SLIDE 17

Latitude-Longitude

Does not preserve angles Does not preserve areas Things are squashed 
 at the top and bottom

Snyder, “Flattening the Earth” Based on slide from Hanrahan

slide-18
SLIDE 18

Azimuthal Projections

Projection onto a plane tangent to the Earth angles are correct around the center point Great circles through the center are straight lines Radii correspond to true distances Sometimes see this in airline magazine centered around the hub

Radical Cartography

slide-19
SLIDE 19

D3 / M. Bostock

Azimuthal Equidistant

slide-20
SLIDE 20
slide-21
SLIDE 21

Winkel Tripel Projection

Modified azimuthal map projection averaged to cylindrical projection Minimizing three kinds of distortion:

area direction distance

Considered good projection for world maps, endorsed by National Geographic Society, used in Textbooks

slide-22
SLIDE 22
slide-23
SLIDE 23
slide-24
SLIDE 24

Conic Projections

Projection onto a cone that slices through the globe, intersecting the Earth twice

Wikipedia

slide-25
SLIDE 25

Albers Equal-Area

Shows areas correctly Distorts distances and shapes

D3 / M. Bostock

slide-26
SLIDE 26

http://strangemaps.wordpress.com/2006/11/20/35-the-size-

  • f-africa/
slide-27
SLIDE 27

Composite Projections

Bernhard Jenny

slide-28
SLIDE 28

Projections in D3

Many projections included:

https://github.com/mbostock/d3/wiki/ Geo-Projections https://github.com/d3/d3-geo-projection/

slide-29
SLIDE 29

Unfolding The Earth

Idea: use small patches flatten them out Jarke van Wijk

http://www.win.tue.nl/~vanwijk/ myriahedral/

slide-30
SLIDE 30

Map Software / Navigation

slide-31
SLIDE 31

Mapping Software

Open StreetMap Google Maps

slide-32
SLIDE 32

Mashups

http://ucrime.com/ma/harvard+university

slide-33
SLIDE 33

D3 Maps

1) get TopoJSON / GeoJSON file

https://github.com/mbostock/topojson/wiki

2) Map Values to Geolocations contained in JSON file 3) Map Values to Channel

slide-34
SLIDE 34

Navigation

Abstract Specific

slide-35
SLIDE 35

Landmarks & Paths

Based on slide from B. Tversky

slide-36
SLIDE 36

LineDrive, 2001

Straighten wiggly lines Turn directions to right angles Expand regions with turns Contract long straight roads Label carefully to avoid clutter Maintain overall orientation

[Agrawala & Stolte, 2001] Based on slide from Hanrahan

slide-37
SLIDE 37
slide-38
SLIDE 38

Design Critique

slide-39
SLIDE 39

atrubetskoy on Reddit

slide-40
SLIDE 40
slide-41
SLIDE 41
slide-42
SLIDE 42
slide-43
SLIDE 43

http://www.visualisingdata.com/index.php/2014/02/defending-the-incredible-gdp-map/

http://www.thefunctionalart.com/2014/02/the-incredible-gdp-map-that-shows-that.html

slide-44
SLIDE 44

http://junkcharts.typepad.com/numbersruleyourworld/2014/02/numbersense-and-true-lies.html

slide-45
SLIDE 45

Choropleth Maps

slide-46
SLIDE 46

Principle

Area are shaded or patterned in proportion to measurement Each spatial unit is filled with a uniform color or pattern

slide-47
SLIDE 47

Charles Dupin, 1826

Early Choropleth Map

Illiteracy in France

slide-48
SLIDE 48

Kerry vs. Bush, 2004

Matthew Ericson, NY Times

slide-49
SLIDE 49

Matthew Ericson, NY Times

slide-50
SLIDE 50

Matthew Ericson, NY Times

slide-51
SLIDE 51

Matthew Ericson, NY Times

slide-52
SLIDE 52

In 3D!

Matthew Ericson, NY Times

slide-53
SLIDE 53
slide-54
SLIDE 54

Baseball Territories

slide-55
SLIDE 55

Lakers Dominate Baskeball

slide-56
SLIDE 56

NYT

slide-57
SLIDE 57

Contour (Isopleth) Maps

slide-58
SLIDE 58

Early Contour Map

Halley’s lines of equal magnetic declination, 1701

slide-59
SLIDE 59

Early Weather Map

Halley’s wind map, 1686

slide-60
SLIDE 60

Wind Map

slide-61
SLIDE 61

wikipedia.org

slide-62
SLIDE 62
  • M. Ericson, NY Times
slide-63
SLIDE 63

Cartograms

slide-64
SLIDE 64

Scale Distance by Data

Dent, “Cartography” Based on slide from Hanrahan

slide-65
SLIDE 65

Scale Area by Data

Dent, “Cartography” Based on slide from Hanrahan

slide-66
SLIDE 66

The World

Mark Newman, Univ. Michigan

slide-67
SLIDE 67

Population

Mark Newman, Univ. Michigan

slide-68
SLIDE 68

GDP

Mark Newman, Univ. Michigan

slide-69
SLIDE 69

Child Mortality

Mark Newman, Univ. Michigan

slide-70
SLIDE 70

Greenhouse Emissions

Mark Newman, Univ. Michigan

slide-71
SLIDE 71

Kerry vs. Bush 2004

Matthew Ericson, NY Times

slide-72
SLIDE 72

Rectangular Cartograms

World Population Cartogram Poster Drawn by Hand

slide-73
SLIDE 73

Bush vs. Kerry, 2004

Heilman, Keim, Panse, Sips, “RecMap: Rectangular Map Approximations” Based on image from Keim

slide-74
SLIDE 74

Heilman, Keim, Panse, Sips, “RecMap: Rectangular Map Approximations” Based on image from Keim

slide-75
SLIDE 75

NY Times

slide-76
SLIDE 76

Necklace Maps

Internet Users in Africa

slide-77
SLIDE 77

Illegal Immigrants in the US

slide-78
SLIDE 78

Proportional Symbol Maps

slide-79
SLIDE 79

Matthew Ericson, NY Times

slide-80
SLIDE 80
  • M. Ericson, NY Times
slide-81
SLIDE 81
  • M. Ericson, NY Times
slide-82
SLIDE 82
slide-83
SLIDE 83

National Geographic, Jan 2011

slide-84
SLIDE 84

FatFonts

http://fatfonts.org/

slide-85
SLIDE 85

NYT, 2010

slide-86
SLIDE 86

Visualizing Addresses of Gun Owners

Published after Connecticut school killings What are the ethics of visualization? Data is public: is making it accessible problematic?

http://learning.blogs.nytimes.com/2013/01/08/did-a-newspaper-act-irresponsibly-by-publishing-the-addresses-of-gun-owners/

slide-87
SLIDE 87

Flow Maps

slide-88
SLIDE 88

Early Flow Map

Transportation of Passengers in Ireland Henry Drury Harness, 1837

slide-89
SLIDE 89
  • C. Minard, 1869
slide-90
SLIDE 90

Effect of US Civil War

  • n Cotton Trade

Milestones Project

slide-91
SLIDE 91
slide-92
SLIDE 92

Non-spatial Representation

slide-93
SLIDE 93
slide-94
SLIDE 94

Data Driven Maps

slide-95
SLIDE 95

Data Driven Maps

Idea: don’t use a map to render on top Let the data make up the map

slide-96
SLIDE 96

ZipDecode

slide-97
SLIDE 97

Brandon Martin-Anderson, 2012

slide-98
SLIDE 98

ZipScribble

slide-99
SLIDE 99

Amsterdam RealTime

slide-100
SLIDE 100

SandDance

Arrange Particles
 to create visualizations

http://research.microsoft.com/en-us/projects/sanddance/

slide-101
SLIDE 101

Thematic Maps

slide-102
SLIDE 102

Strange Maps http://strangemaps.wordpress.com/

slide-103
SLIDE 103

http://xkcd.com/256/

2007

slide-104
SLIDE 104

http://xkcd.com/802/

2010

slide-105
SLIDE 105

One hour in front of the TV

Map by The Bumblebee http://www.flickr.com/photos/the_bumblebee/2229041742

slide-106
SLIDE 106

From Memory (was: Maps from Memory) http://www.flickr.com/groups/46079190@N00/