Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
1131 lines (899 sloc) 60.7 KB

NACIS 2015 (Minneapolis, Minn.)

NACIS is an annual conference facilitating communication in the map information community. There were a variety of talks focusing on the theme of Mapping Interactions.

Practical Cartography Day

Wednesday, October 14, 2015

Keynote Speaker

Wednesday, October 14, 2015

Concurrent Sessions

Thursday, October 15, 2015

Friday, October 16, 2015

Pecha Kucha

Friday, October 16, 2015

Post-Conference Workshop

Saturday, October 17, 2015

Practical Cartography Day

Taking Terrain to New Heights with ArcGIS, Kenneth Field

  • 13 different tools available [e.g. Sky modeled hillshade (sun, lowercast), shadow lines, different strokes, etc.]
  • Takes some time to run, but is worth the wait.
  • Works with 10.3+ (usually 10.2 as well). Although, choropleth has issues with older versions
  • Samples are located in the download.


Redesigning Atlas Maps for Social Media, Alethea Steingisser and James Meacham

  • Check out atlas work by Oregon, in particular the Atlas of Wildlife Migration
  • Real time engangement on social media using a "time series" highlighting particular areas of interest on-the-fly (esp. graphics, maps in HD). Bright colors, bold text, thicker outlines.
  • Tell a story, what are you trying to tell? People will follow! Give data a face!
  • Show the obstacles.
  • Go bold - larger (and heavier) labels, heavier text, vibrant colors, and increased contrast.
  • Simplify without 'dumbing down'.
  • Use higher resolution than recommended (doubled in their work).

MAPPublisher at National Geographic, Matthew Chwatstyk

  • Import, manipulate, analyze, edit, save vector data.
  • Track data sources with a quick reference
  • Plugin for Illustrator that can create themes depending on the use.

A Quick Guide to US Dept. of Transportation Datasets, Justyna Goworowska

TLDR; Lots of spatial data

Photo Credit: Kitty Hurley

  • (e.g. NTAD 2015, also an atlas)
  • WMS: (download also available).
  • Coordination with many other agencies to get other datasets.
  • Web mapping/map tools available that includes data from multiple Federal agencies [Cyclist/pedestrian crash maps (?)].
  • Contact e-mail address

Manual Shaded Relief of the World and the Patterson Projection, Tom Patterson

Manual Shaded Relief:

  • Better, small-scale manual relief shading.
  • Check the data, verify its in the right location (older map topographies aren't so accurate).
  • Use relief as a backdrop to your maps.
  • Digital vs. Manual Relief comparisons.
  • Digital: Light can make it difficult (e.g. Alaskan Arc and Pacific Northwest area in particular), mountain ranges, and gorges.
  • Terrain data: Natural Earth website (1:50m), can use higher/lower scales (GeoTIFF format).

Patterson Projection:

  • Equal Area: Antartica is smooshed
  • Geographic: "Stubby" South America
  • Mercator: Small-scale = good, large-scale = not so much
  • Miller: Antartica is a beast! (14x larger than Greenland)
  • Patterson: Right in the middle**!**
    • Miller Projection was used as a template (Compact Miller).
    • Polar Compression to condense space around the poles.
    • Formula allows you to plug it into other sources (implemented in ArcGIS future release, and others). Made using Flex Projector.

World Political Map:

  • World political map (e.g. Natural Earth, Natural Earth 2)


Designer as a Cartographer, Amy Lee Walton

Cartographer's Checklist:

  • What is the purpose of the map?
  • Who is the audience?
  • What are the format and scale?
  • How will the map be produced and reproduced?

Graphic Design:

Giving visual form to an action, intention, or material object.

Beauty and Usability form = function

Elements of Good Design

  • Heirarchy
  • Color/Texture
  • Typograpy
  • Narrative: Give visual form to an action, intention, material object, or narrative. (Data and inspiration). data == narrative.


  • AllTrails: MapBox vector tiles for terrain using Mapbox Studio Classic. Filter to height, and zoom level.
  • USS Enterprise Blueprint tiles mapbox-tiles-uss-enterprise
    Photo Credit: Kitty Hurley
  • Digital vs. Print - Make it for both! (super difficult).
    • Download tiles as a PNG from Mapbox to print/play with.
    • Design for (m)any outcomes
  • Don't let software limit you, re-created in Mapbox Studio for WebGL.
    • Simplify the process.

Collecting Data from the Crowd - A Leaflet and CartoDB-based Stack, Mike Foster

How do you teach geography and design to non-geographers?

  • Concepts and fundamentals manifest themselves through tools.
  • DUSPviz: Skills and tools for better planning.

Web Map Workshop

  • 7-week course:
    • HTML/CSS
    • Bootstrap
    • Basic Web Map
    • JavaScript
    • Styling
    • PostGIS/CartoDB
    • Data Collection
  • Base level = 0!
  • End goal: Create a lightweight web map/data collection application in which visitors can input information using LeafletJS, Leaflet.draw, CartoDB, jQuery/jQueryUI, and PHP. Attendees only needed A CartoDB Account, PHP-enabled Webhosting, and a Text Editor (e.g. Sublime Text).


  1. Backend
  • Spatial database - used CartoDB SQL API
  • Security matters: API key, username, table (security matters!)
  • PHP for security (hide credential information on the server)
    Photo Credit: Mike Foster
  1. FrontEnd
  • Leaflet
  • JavaScript and jQuery
  • Create an empty dataset in CartoDB, with a few test points (e.g. Data Collector)
  • Set up HTML document structure
  • Add data to Leaflet (and Leaflet draw)
  • Modal for data collection
  • Proxy to send collected data to CartoDB
  • View data! :-P
  1. Security

Dropchop, Sam Matthews

Goal: Make a simple modular tool


  1. GIS doesn't always require a server.
  2. GIS can be data-first, not operation-first.
  3. GIS is open (created and used by the community).

Query the OSM database (Query the overpass).
Note: Refresh currently loses all work

Practical and Impractical Uses of Terrain Data (National Geographic Climate Change 'The Human Impact' example), Seth Fitzsimmons


National Geographic Climate Change

Project Goals:

  1. Re-purpose art, research, editorial, maps.
  2. Make them interactive.
  3. Make them multilingual.

Tell a story!!

It doesn't have to be in map form, think graphics that support your text. You don't need to make a web map to write your story everytime. Content is the most critical piece, get good content together.
nat-geo-map Photo Credit: Kitty Hurley

Anatomy of a Web Map Multi-resolution image:

  • 256 x 256 pixels tile
    • Scale up the images by 2 (512 x 512 pixels), to scale down.
  • Tools: TileMill and After Effects (React and Leaflet) map-tiles
    Photo Credit: Kitty Hurley

Mapping the Future Patagonia National Park, Ross Donihue

  • Connect people with place!!
  • We save the places we love. We love the places we know. Know and feel connected to places.
  • Stories of a landscape, that gives places meaning.
  • Mapping the invisible information, takes time but it adds richness and meaning! People will feel more connected!
  • Unexpected things occur when you spend 30 seconds talking about your work outside of your comfort zone.

1. Colors

  • Extract colors from a palette derived from photos adds realism to maps (bring it into Photoshop to get the colors).
  • To extract, smudge/blur and get an eye dropper to get the natural landscape color.

2. Talk about your work!

  • Watch the magic unfold.
  • New connections are formed.
  • Unexpected, unforgettable experience by talking!

3. Audio Recordings

  • As you do fieldwork record audio of your local collaborators.
  • Record something you might miss if you were in the office.

4. Skeleton Maps

  • Geographic structure for storing local stories and meaningful information.
  • Mark on the maps specific information they know, but we may not being outsiders.
  • Incorporate the information into field notes, and maps.

Photo credit: Ross Donihue

ArcMap-to-Illustrator Workflows, Nicole Samu

ArcMap → Illustrator process

Export Notes:

  • When exporting from ArcMap, ungroup layers that are checked in the TOC.
  • Remove transparencies
  • Choose 'Vectorize layers with bitmap markers/fills' in the export settings.

Illustrator Notes:

  • Open AI File
  • Delete clipping masks (ObjectClipping MasksDelete)
  • Ungroup layers in layer panel as-needed
  • Delete layer called 'other'
  • Rename and organize layers in a functional matter
  • "Save as" Illustrator Template file (FileSave asAi Template) or copy/paste in place of existing file.
  • Clipping masks
  • Legend customization (align panel)
  • Colors (stroke/fill, custom color library, color guide panel)
  • Improve text
  • Adding style (Appearance panel/graphic styles panel/symbols panel)
  • Improve performance (simplify paths/"place" graphics instead of embedding them)
  • Pro-tip: When designing maps with Illustrator, you can switch into 'color blindness mode’ to double check accessibility. -Katie Kowalsky

FixWikiMaps Project: Maplift, Brian Davidson

Maps need a lift!

Photo Credit: Kitty Hurley

What can I do?

  1. Find a map, add it to the MapLift database
  2. Claim a map
  3. Create a map

After Example (Louisiana Purchase):

Map Credit: Bill Morris, Wikipedia

Restyling Old and Cluttered Maps, Vanessa Knoppke-Wetzel

Anyone can make anything nicer with time! But... we need maps fast! We can still do better on a short time frame!

Program Map Restyling (an iterative process):

1. Before map

Photo Credit: Kitty Hurley

2. After map

Photo Credit: Kitty Hurley


  • Smaller map, only the map there, by itself! This allows the viewer to focus on the content.
  • Color-coded table.
  • Words to symbols.
  • Colors, shapes, and distinctive objects were added in.
  • Font hierarchy was established to show less contrast for busy maps.
  • Color palettes in Adobe Illustrator.
    Photo Credit: Vanessa Knoppke-Wetzel

Reference Restyling:

1. Inner Glow:

In Illustrator, StylizeInner Glow

Photo credit: Vanessa Knoppke-Wetzel

2. Blur size:

Set the blur based on size (small, medium, large). Make sure they are matching throughout your work.

Photo credit: Vanessa Knoppke-Wetzel

3. Eyedropper Options:

Lastly, double-click the Eyedropper → OptionsAppearance

Photo credit: Vanessa Knoppke-Wetzel

Before and After Blur:


Photo credit: Vanessa Knoppke-Wetzel


Photo credit: Vanessa Knoppke-Wetzel

Terrain Data Sources Online, Paulo Raposo

Uses SAGA for GIS. Also works with QGIS tools.

A Matter of Perspective, Daniel P. Huffman

Take familiar things and show them in a new, and different way. Daniel's map will be located in the map gallery throughout the conference.


Make a map your personal story. Lake Michigan as a straight line, to show its importance.


  • A linear View (not new, just different. e.g. Minneapolis LRT lines)
  • ArcMap → Illustrator
  • Census data (choropleth)
  • Break segments into rectangles, and stack them (using ridiculous math equations). Process of transforming coordinates into rectangles.
    stats Photo Credit: Bojan Šavrič
  • Once everything is shown vertically, work on the styling.
  • Vertical vs. Horizontal (web vs. print) final-map Photo Credit: Daniel P. Huffman

CartoCSS Essentials, Katie Kowalsky

Goal: Create tileset using CartCSS based off of art.

Why teach a class:

  • Teach an unfamiliar medium (the web!)
  • Introduce Mapbox Studio and CartoDB
  • Get students familiar with programming (HTML/CSS/JS)
  • Challenge students
  • See Katie's Blog post for more info!

Tips and Tricks for Designing Tiles:

1. It's dangerous to go alone. Plan ahead on your design and make a game plan.

2. Mise en Place: Organization first!

mise-en-place Photo Credit: Alan McConchie

  • Multiple stylesheets
  • Use globals!
  • Hack Project.yml for custom layers

3. Attachments (a.k.a. sublayer)

4. Attributes are awesome!

5. Never forget where you came from...

  • Use common operators, and labels

6. Have fun!

Vector Cartography in ArcGIS, Craig Williams

ArcGIS vector tile service will come with the new release.

Keynote Speaker

Personal Story as a Map, Brenda Laurel


  • A story is an artifact.
  • Storytelling is a relationship.
  • Stories and maps are meaning containers.

Narractive vs. Drama

Narrative Drama
Extensification Intensification
Duration: Days Duration: Single day/sitting
Episodic Single dominant plot
Told/read Enacted

Other notes

  • Other traverses create different interactions.
  • When a map is interactive it becomes an actor in itself, a collaborator.
  • Maps have attitudes!

Concurrent Sessions

Examining the Terminology of Modern Cartography, Michael P. Peterson, Rex G. Cammack

Words and Maps:

  • Conceptually cartography is based on words.
  • Words influence our mapping.
  • Words form communication with others, and ourselves.
  • Development of words done without much thought (expressions/words used for same concept).
  • We're at a great age of cartography with ideas, concepts, and theory.
  • Words define cartography. Cartographic language is not a dead language.
  • We as a community can change and help it evolve.
  • We need to find new words for other maps, and find a better term than "static map"!


  • Discipline-specific words (e.g. Doctors use shorthand to separate themselves from patients).
  • Jargon separates out from individuals/groups.

Slippy map:

  • A term referring to modern web maps that let you zoom and pan around. The term originates from how the map 'slips' around when you drag the mouse.
  • AJAX component where JavaScript runs in the browser and puts in a request from the server without downloading the whole HTML on the page → "Slippy zoom" map experience :-)
  • A "cute" term, but not very professional sounding, and the term isn't taken very seriously.
  • MOMM (Me On My Map): Track the entity "holding" the map. Similar to slippy map term (e.g. FitBit).

English by non-native speakers:

  • The world's most spoken language is bad english.
  • Europeans use English as a common language, but words are made up (e.g. "Handy" in Germany, for cell phone).

Boundaries of Classes:

  • Map Types (General/Thematic)
  • Hybrids? (e.g. When does a "Labordoodle" become a "breed", do we use mashup names)?

A Visual Search Task Comparing Zooming Metaphors, Ryan Mullins


  • The interaction between human and physical components.
  • How does context shape decisions and actions?


1. Slippy map style

  • Pinch-to-zoom basemap
  • Layer toggles in title bar

2. Zoom window with toggles (the worst rated)

  • No zoom on basemap
  • Pinch-to-zoom in windows
  • Layer toggles in zoom window

3. Side-by-side zoom window

  • No zoom on basemap
  • Pinch-to-zoom in windows
  • 1 window per layer, same footprint.

Balance benefits:

The best modality depends on the display size (slippy for smaller, side-by-side for larger screens), and the number of collaborating analysts. However, the results of the study were as follows:

1. Slippy map

  • Best performance (shortest time/most accurate)
  • Most familiar interaction
  • Zoom means different context

2. Side-by-side zoom windows

  • Second best performance (lowest varience)

A New Atlas of American History, Alan McConchie

Showing things over time is just as important as showing what is happening in space.

  • Its hard to do, but its an important story to tell.
  • Discuss!

American Panorama: An Atlas of U.S. History:

Don't build components (originally asked for by the client). Instead, let's design from what the user will want, stay true to the data, and show a story. Over time, a toolkit can be added. Use modern tools that support for many years.

Forced Migration of Enslaved People in the US (1810-1860):


Photo Credit: Kitty Hurley


  • For a map of the past, you need a custom basemap.
  • Let the user explore the story as they choose to.
  • As you interact with the map, the URL changes appropriately so it can be shared as you are looking at it. THIS IS AMAZING!


Photo Credit: Kitty Hurley

  • Custom basemap: Natural Earth data (CartoCSS/CartoDB), own map projection, transform using CartoCSS, OpenTerrain tile (mostly transparent).
  • Data: Convert counties to hexbins that creates a smooth look (since counties change over time).

Other interactive maps:

  • Overland trails (1840-1860) - this includes historical trails (e.g. Oregon Trail)
  • Foreign born ("current age" map)
  • Canals (1820-1890)

Beyond Paper: Ideas for Interactive Maps, Peter Liu

Interactive means we don't have to anticipate, only react when the user asks for information.

Breadth vs. Granularity

  • Respond to user input
  • Make it dynamic: show change over time
    Photo Credit: Kitty Hurley

Stories over time

Maps as an interface to discover information.

Amazing Examples

Contact Information

E-mail Peter

Open Web Mapping Technologies: How do we Teach this Stuff?, Carl Sack

Lots of great projects emerged, but so did the LARGE struggles, especially with D3.

"The more you know, the more you know you need to know."

Desired outcomes:

  1. Ability to create [animated] thematic slippy maps using Leaflet.
  2. Ability to created linked geovisualizations using D3.
  3. Independent completion of web map from start to finish in collaboration with colleagues.
  4. Demonstration of computational thinking, adaptability, self-direction, and problem solving.
  5. Integration of theoretical concepts presented in lecture into outcomes 1-3. (e.g. Human-map interaction, usability engineering, data visualizing, etc.)
  • This outcome was the hardest to meet.

Web Mapping Workflow (Donahue, 2014)

The workflow gets more, and more, integrated over time.

  1. Idea (Design)
  2. Development environment
  3. Data
  4. Markup (representation space)
  5. Script (interaction space)
  6. Fine-tuning (usability)
  7. Deployment

Photo Credit: Kitty Hurley


  • Two different sections (each has its own learning speed).
  • Difficulties: the DOM, identifying source of methods, data formatting and conversion.
  • D3 lessons were successful and exciting.
  • Student understanding: "I'm learning and know I'll get beyond this rather than helplessness or giving up."
  • Student enlightenment: "I needed to break it down and solve things one at a time, not all at once."
  • Expertise with tools after were still low/moderate, but they had the basic knowledge and wanted to learn more!

The most useful tools first were:

  • Using browser developer tools.
  • Tools on GitHub (mostly using GitHub GUI due to familiarity with command line. This can always come later).

Student Projects

University of Wisconsin Course

How to Teach an Old(ish) Cartography Professor New Tricks, Sally Hermansen

Course Information

Research in Cartography, blog


  • With 5 lines of code, we can make a map!
  • But, what about a more refined map?
    • Joey Lee
    • Ben Fry: Data Visualization Pipeline
  • Teaching Adobe Illustrator and ArcGIS is a dis-service, they need to understand other tools/options in the open source community (Q, R, Leaflet, OSM, etc.). We need to be teaching more open source, I'm really into exposing students to QGIS, R, ...

How it works:

  • Take students out of computer labs, bring their own laptops.
  • GitHub tutorials
  • Assignments outside of class, bring questions to class
  • Videos during class, and work time

Type on Maps: All the Little Things that Actually Matter, Elaine Guidero

"Maybe Comic Sans isn't the best font for mapping a sex God."

Photo Credit: Elaine Guidero


  • Typefaces have different tones based on the semantic effects.
  • Different semantic effects.

Font Anatomy:

1. Differences

  • Why do fonts look different?
  • Examples included: terminal, spur, serif, stroke contrast, ear, and story.

Photo Credit: Elaine Guidero

2. Look for Microaesthetics

  • Cartographic research on type aesthetics is inaccurate.
  • Why? Because Label properties != typeface attributes.

Photo Credit: Elaine Guidero
Photo Credit: Elaine Guidero

3. Macroaesthetics (aka. Label properties):

Photo Credit: Elaine Guidero


Letterform elements, not label properties, contribute to typeface tone.

Choosing a Typeface:

  • Use Microaesthetics, not Macroaesthetics, to identify semantic effect and determine tone.
  • Inductive research to establish guidelines.

Identify letters and earmarks

Photo Credit: Elaine Guidero

8 Semantic Effects

  1. Bland
  2. Cheap
  3. Corporate
  4. Friendly
  5. Modern
  6. Neutral
  7. Serious
  8. Whimsical

Typefaces and Colors Used in Slides

color-palette Photo Credit: Elaine Guidero

Every Pixel Counts: Web Map Symbols for the National Park Service, Jake Coolidge

Design Considerations:

  1. Recognizability (of symbols)
  2. Legibility
  3. Complexity (not too simplistic, but not too complex)
  1. Style, or look and feel


  • NPS print map symbols originate from the Ultimate Symbol Collection.
  • The shapes are then simplified, and line widths and internal distances increased.
  • Shapes and lines are intentionally made bold for high contrast with map background.

Adapting Symbols

  1. Design a framework with slim profiles.
  2. Design black, off-white, and white versions that support multiple backgrounds.
    Photo Credit: Jake Coolidge
  3. Design multiple sizes for greater cartographic flexibility.
  4. Use shadow effects to provide visual dimensionality.

Learn more

Visualizing Ten Years of Quantitative Color Schemes, Travis White

opening-slide Photo Credit: Alan McConchie

Qc: Quantitative color schemes

Color that represents quantitative data)


2004: 11% vs 2013: 71% used Qualitative color schemes

Natural-Color Maps via Automated Coloring of Bivariate Grid Data, Jane Darbyshire

Goal: Automate color technique for deployment to the web.

Spooky Map Stories, Patrick Hammons

Photo Credit: Kitty Hurley


  • Maps are one of the most effective and evocative ways to make an argument.
  • Maps continue to be made by relatively few people.

Teach them:

  • Instead of providing maps to clients, teach the Journalists learn how to use CartoDB and make maps to augment their stories using an in-person training session.
  • As a result, there were some awesome maps made, they learned to import/edit data using CartoCSS, and SQL queries!
  • Same process for a small non-profit, to manage data in CartoDB so maps stay current!

The great news:

  • There was little-to-no confusion about the interface!
  • CartoDB is pretty easy to use, and the interface is amazing!
  • Users made basic updates.
  • Learned how georeferencing works.

The not-so-great news:

  • No further maps were made after the training...
  • Sent a spreadsheet with updates a month later...


  • Top-down directive isn’t a great place to start.
  • Learning new things takes persistence and regular practice.
  • Personal passion/interest is the best place to start.
  • One-off trainings are not the best...
  • Confidence with new technical tasks takes time.

Future Use Cases:

  • Learn how and when to say no to projects.
  • Sometimes making a map isn’t the answer.
  • User research is usually a better first step.
  • Encourage interested clients to get plugged in.
  • Clients can become Maptime members!


Maps are hard, but community building is harder (and often more important).

GIS for the people by the people, Sam Matthews

Photo Credit: Kitty Hurley


The ability to do GIS in the browser. Drag-and-drop a feature and perform basic GIS functions without having to open a bulky program. Filereader and TurfJS made this work!

How it works:

Drop (files into the browser) + Chop (files using Turf.js) = DropChop (browser-based spatial operation).


"From an early stage we had to think about how to bring in a large number of contributors across a broad range of skillsets. It was about how people can contribute in a way that was meaningful to them." -Andrew Powers

Photo Credit: Kitty Hurley

  • Contributions != Code.
  • Welcome small & large contributions!
  • Build entrances & exits for contributors.
  • Test and prioritize user input early & often!
  • People get scared when they hear the word "GitHub", try to refrain from using the words "code" and "GitHub". Start using the words "documentation", "issues", and "no experience needed".

Photo Credit: Sam Matthews

Big History, Little History: Cartography in the Twentieth Century, Mark Monmonier

The History of Cartography:

  • J.B. Harley (1932-91)
  • David Woodward (1994-2004)

Modes of Cartographic Practice:

  • Overhead imaging
  • Dynamic cartography
  • Multi-mode institutions (academic cartography)

Six themes:

  1. Diverse impacts of mapping on a society
  2. Overhead imaging
  3. The electronic transition
  4. Maps and Warfare
  5. The Paradox of Globalized Practices and Customized Content
  6. Maps as tools of Public Administration

Further Reading:

  • Computational geography as a new modality by Suane Marble
  • Cartogaphy in the Twentieth century edited by Mark Monmonier

Of Crocodiles and Tea Garden Managers: Mapping Interactions of an Earlier Era, Leo Dillon


Lots of detail, and text describing the area as its explored.

  • 1779 map (beavers on a map - where you can make money)
  • 1800's St. Anthony's Falls (582 rabbits?)
  • 1900: Number for each parcel
  • Crocodiles
  • Grave sites
  • Tristan de Cunha (original)
  • Evasion chart (EVC)

Improving ArcGIS mapping workflows with Adobe’s Creative Cloud Applications, Sarah Bell & Clint Loveman

  • Existing product, Esri MapStudio is designed for print media/journalists.
  • The examples are a prototype, a proof-of-concept.

Workflows (Proof-of-Concept):

  1. Export from ArcMap and import to AI
  2. Compile map from web-hosted data

Workflow 1:

  • Layers shown as sublayers (nested within one layer)
  • Each point is grouped within a group in an area
  • Using Esri converter

Workflow 2 (Similar to MAPPublisher's process):

  • Pull data from the cloud (ArcGIS Online) and straight into Illustrator without leaving Illustrator
  • Run same script highlighted in workflow 1 in Illustrator.

Improve (Including potentially helping with a private beta):


Drupalized Web Maps, Tim Stallmann

Drupal benefits:

  • User management
  • Security
  • Permissions
  • Revision tracking
  • Integrate with RSS feeds
  • Photo/media content editing
  • Ecommerce


  1. Leaflet (Recommended: Leaflet, Leaflet more maps, Leaflet views)
  1. OpenLayers (see also
  1. GeoJSON + Custom Leaflet Code ("headless Drupal" approach)


  • Drush spins up a live site using command line. Prereq: MAPM/LAMP/WAMP stack
  • Also, download Leaflet library as well (doesn't manually do this).

Planning for Automated Labeling of U.S. Routes with Multiple Shields and Names, Cynthia A. Brewer

Photo Credit: Kitty Hurley

Popular Group Vote:

F. Grouped Along Line
Photo Credit: ColorBrewer

Cartography Tip:

Put 0% alpha symbol on road junction to "push/collide" road shield placements away from a road junction.

Cartography Driven Data Collection, Mamata Akella

But.. all web maps look the same!

With common data, tools, and technologies.

Basemaps and Thematic Maps:

  • NPMap
  • National Park Service Centennial (100-year anniversary in 2016)

Photo Credit: Kitty Hurley


Park tiles:

  • Data from OSM.
  • Difficult to make one map for 400+ parks
  • Different layers of the basemap layer

Photo Credit: Kitty Hurley

Photo Credit: Kitty Hurley


Future direction: Is there a better solution that is on the data side?

Park Tiles 3 (2016 Centennial):

Goal: A web map on every park's page with NPS data inside of park boundaries.

How To Use CartoDB Guide

Geographic Education in a Modern World, Panel Discussion

Panel members

  1. Ryan Cooper
  2. Lyzi Diamond
  3. Mike Foster
  4. Katie Kowalsky
  5. Mōno Simeone
  6. Matt Wilson

1. What is the relationship between cartography and geography?

  • Cartography and geography is a spectrum.
  • Geography - science/data, Cartography - subset/tool of communicating.
  • You can't have one without the other.
  • Interdisciplinary
  • To showcase data geographers need cartography.
  • Cartography is the communication we have with one another.
  • It starts with geography - a deep seeded need to understand spatial relationships.
  • Mapping/cartography is not easy.

2. What mapping technologies and approaches do you advocate, use, and/or teach?

  • Mashup of data, art, and communication. Split it up - design is a component. Start learning new technologies where you feel comfortable (e.g. design → Mapbox Studio).
  • Teach technology and spatial principles, not the tools (e.g. Google, Leaflet, OpenLayers) with the ability to adapt.
  • No one solution, many solutions are available.
  • "Failure is okay. Sometimes the best way to learn what works by learning what doesn't work. It teaches you along the way." -Mike Foster
  • Dependent on the student/learner. Meet people where they are on the spectrum.
  • Mapping is not a method! Mapping is a phenomenon, not a vehicle.
  • Use what they know and extend on their knowledge.
  • Give them an assignment, like making a web application, and put a design twist on it (e.g. map tiles).
  • Start from the bottom and go to the top.

3. What kinds of courses or opportunities should higher education be supporting?

  • Traditional and non-traditional experiences/curriculum. Outlets are needed, but make it fun/exploratory.
  • Hold multiple internships as a student, and learn.
  • Volunteer/internships/cold call and find projects.
  • Foster relationships and communication with government entities.
  • Facilitate learning together in a common space. Test it out, and open it if its successful to other educators/students. Exposure is critical!
  • Its easier to teach something if you learn it. Celebrate it, and get excited about it! Learn from someone who is just getting started with it. Not expert → beginner, but a collaborative learning environment.
  • Being open/software agnostic. Focus on the creation of the buttons, not pushing the buttons. How do we create buttons?
  • Learning to code is hard. You shouldn't feel dumb when you are learning! No one knows how to code. Programmers are really good at Googling. Learn the vocabulary to answer the question.
  • If you make something, write it down, put it online! Experts take for granted some of the things that are super hard when you first start out!
  • Teach critical thinking and problem solving.
  • Animosity of students that just want to solve a problem.

4. How can higher education adapt?

Not answered

5. How should industry help with higher education to make the changes?

  • Support older versions/backward compatibility to make it easy on professors in their curriculum design.
  • Offer non-subscription based software to educators.
  • Documentation thats easy to get to, with examples!! And easy to comprehend no matter on beginner or advanced knowledge bases.
  • Make a presence in the educational realm/community.
  • "GitHub for the classroom" for the mapping community.
  • Relationship between educators and industry leaders.
  • Question, "Teach someone how to buffer without a tool?"

From The Twitters, The Interwebs

  • Add Vertex – Script for Adobe Illustrator
  • Open Geoportal: An easy way to find open geodata all over the world.
  • Project Faces (video): Create a font using this tool! "Project Faces" is a whole new way to think about tweaking, adapting, and creating fonts that perfectly reflect your message. This technology preview isn't in the Creative Cloud yet, but making your own font face in minutes may be reality sooner than later.

Maps as a Visual Copy, Ian Muehlenhaus

Maybe we're talking about these maps all wrong, maybe they are better thought of as copy.


The art and science of writing words that sell your product, belief, or service and pursue potential customers to take action.

Visual Copy

Visuals are used to enhance, reinforce, or replace copywriting. Combined, the two further encourage one to take action. The visual is so powerful, that the viewer doesn't need words to understand.

Maps as Copy?

Persusive maps are typically examples of visual copy.

Photo Credit: Ian Muehlenhaus

Copy maps

Maps created and used, either alone, or with another copy, for the purpose of getting someone to do or believe something. The effectiveness is measured by how well they "convert" an audience.

Design choices will impact effect

  • Concentric circles are a very effective technique.
  • Octopus maps - if you don't like somebody you should put them on a map as an Octopus!

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Photo Credit: Ian Muehlenhaus

Further Reading

  1. Scientific Advertising, Claude Hopkins
  2. Words that Sell: More than 6000 Entries to Help You Promote Your Products, Services, and Ideas, Richard Bayan

Post-Conference Workshop

Mapping in the Cloud, Michael P. Peterson

Cloud Resources:

  • PodServer is a web hosting service in the cloud.
  • FireZilla is good for storing data files in the cloud.
  • Amazon Web Services, while costly, is reliable, as it is never 'down'.
  • Webuzo is another good private cloud resource.
  • MapTiler is a resource to host Google map tiles in the cloud.


  • WYSIWYG: What You See Is What You Get

Getting Started Resources:

Course Setup

Set up WebHosting Services and Upload Files

  1. Set up an account with Podserver.
  2. Copy an index.html file from the course website.
  • From the Podserver cPanel click FilesOnline File Managerhtdocs.
  1. Add in your own photo to your index.html website.
  2. Upload ZIP files.
  3. Link to all students webpages.

Chapter 8: HTML and JavaScript

  • JavaScript is the most used language.
  • Interpreted language, not compiled (.exe).
  • JavaScript is interpreted by the browser as it is opened.
  • Understand variables (x = 1), loops, function calls.

Chapter 10: Map Mashups

var mapStyle = [{
  'featureType': 'all',
  'elementType': 'all',
  'stylers': [{'visibility': 'off'}]
}, {
  'featureType': 'landscape',
  'elementType': 'geometry',
  'stylers': [{'visibility': 'on'}, {'color': '#fcfcfc'}]
}, {
  'featureType': 'water',
  'elementType': 'labels',
  'stylers': [{'visibility': 'off'}]
}, {
  'featureType': 'water',
  'elementType': 'geometry',
  'stylers': [{'visibility': 'on'}, {'hue': '#5f94ff'}, {'lightness': 40}]
  • Google fusion tables

Chapter 12: Point Mashups

Chapter 14: Line and Polygon Mashups

Chapter 16: Layer Mashups

Chapter 18: php and MySQL Mashups

  • Programming language that resides on the server
  • Random number generator example (uses resources on the server):
$a = rand(0,10);
if ($a >= 5) {
echo "The random number $a which is greater than 5";
echo "The random number $a which is less than 5";};
for ($i=0; $i <= 1000; $i++) { //start a loop that executes 1000 times
$total = $total + rand(0,10); }
echo "The average of 1000 random numbers between 0 and 10 is: ", $total/1000;
  • Behind Facebook, Twitter, GitHub, etc. that makes content unique to you so your pages show differently from others.
  • Work with a spatial database example (e.g. input points into a map with an attribute):
$mysql_host = "";
$mysql_database = "podi_14231477_points";
$mysql_user = "podi_14231477";
$mysql_password = "asdfasdf";
$conn = mysql_connect($mysql_host, $mysql_user, $mysql_password) or die ('Error connecting to mysql');

Chapter 20: Local Mapping

Chapter 22: Animated Maps

  • Animation is a result of JavaScript!
  • Rushing/List-based animation