The use of color in maps

The use of color in maps and data visualizations has a long tradition. Color, along with position, size, shape, value, orientation, and texture is one of the primary means to encode data graphically.

Since William Playfair‘s revolutionary introduction of statistical graphs in the 1786 “Commercial and Political Atlas“, color has been used as a tool to convey categorical and quantitative differences in data visualization. Playfair used color coding to emphasize variations in economic trends and to differentiate variables in his graphs, which were hand-colored and distributed in limited editions.

Imports of cotton in Europe for the years 1858, 1864 and 1865. Charles Joseph Minard (1866). Source: Library of Congress Geography and Map Division Washington, D.C.

Charles Joseph Minard is another pioneer of information graphics who used color to visualize flows of goods and people across countries in his thematic maps. The main purpose of his graphic explorations was to make ordinal relationships immediately visible to the eye and the use of color was a central aspect of this process. Minard is widely known for the invention of the flow map. He also authored the famous “Figurative Map of the successive losses in men of the French Army in the Russian campaign 1812-1813” – a map that, according to E. J. Marey, defied the pen of the historian with its brutal eloquence.

Although color has been present for centuries in handcrafted maps, it was not until the mid-nineteenth century, that the adaptation of lithographic techniques to printing allowed its wider use in graphic works. At that time, color became an important perceptual feature in the design of thematic maps and statistical diagrams (Friendly, 2009).

Wage and nationality maps, “Hull House Maps and Papers ” (1895) – a groundbreaking study, led by Jane Addams and Florence Kelley. The study was influenced by Charles Booth’s poverty maps of London.

Color as a visual variable

Color, along with position, size, shape, value, orientation, and texture is what Jacques Bertin calls a visual variable:
a set of symbols that can be applied to data in order to convey the underlying information. In that sense the wise and often conservative use of color is a prerequisite for accuracy in the graphic interpretation of data. When not used properly, color in maps can obscure the data and mislead the reader by concealing the actual state of the observed problem.

Movement of Iron Ore on the Great Lakes, 1897 and 1907. Map detail illustrating the use of color and texture as visual variables.

In order to apply color to maps effectively, a designer needs to manipulate properly the three perceptual dimensions that characterize it: Hue, Saturation and Lightness. Hue is what we associate with color names – red, green, blue etc. Saturation is the vividness of a color and is also known as Chroma or Intensity. Lightness is a relative measure describing how much light appears to reflect from an object compared to what looks white in the scene (Brewer, 1999). Lightness is perhaps the most important of the three perceptual dimensions when it comes to data representation and is used to show ordered differences.

1958 map of New York City by Eduard Imhof.

Color is applied to maps to encode or highlight data, but it also has an aesthetic dimension, perhaps best illustrated in the works of swiss mapmaker Eduard Imhof whose school maps and atlases are world famous examples of excellence in the domain of cartography. In his classic book on relief representation, Imhof dedicates a whole chapter to the use of color, providing invaluable guidance with a set of rules for color compositions. Although the chapter concerns mostly the use of hypsometric tints and the selection of colors for elements of the landscape, Imhof’s rules are timeless and applicable in other cases as well. Imhof insisted that strong, heavy rich and solid colors should be limited to the small areas of extremes in order to avoid the unbearable effects of placing them next to each other over large areas. He also suggested that base-colors are equally important since they allowed for the smaller, brighter areas to stand out: a principle that puts up the lighter shades of gray among the most versatile colors.

Generalized geologic map of the moon showing major geologic units grouped by age. Detail from I-1162 Geologic Map of the South Side of the Moon. USRA Lunar and Planetary Institute.

Types of color schemes

There are three main types of color schemes applied to maps: Qualitative, Sequential and Diverging. Binary schemes are also used to visualize nominal differences between two categories. Variation in all three perceptual dimensions of color – Hue, Saturation and Lightness – are applied to show differences in the data. The basic principle is that variations in hue visualize nominal/categorical differences while variations in lightness visualize ordinal differences. But the strict application of this rule varies from one case to another: qualitative schemes may apply plenty of variations in lightness, especially when there is a large number of categories to display and sequential scales can benefit from hue variations when they are first and foremost ordered by lightness.

 

Qualitative schemes are applied to discrete unordered classes of nominal data such as race or ethnicity. They are not appropriate for mapping ordered numerical data. The distinction between classes becomes visible through variations in hue, ideally with no or slight lightness differences between colors. If a class needs to be highlighted it is possible to use a darker or more saturated color to visualize it. Qualitative schemes may also consist of paired hues with lighter and darker shades of the same color, applied to related categories (ex: related land use categories such as single and multifamily residential buildings).

Sequential schemes are applied to ordered, often numerical data such as floor area ratio per lot or population density per square mile. Changes in color lightness correspond to the progression from low to high: light colors are used for lower values and the dark colors are used for higher values. Sequential schemes can derive from both single and multi-hue combinations. The higher the number of data classes – the more difficult the distinction between each step.

Diverging schemes are often described as a combination of two sequential schemes with a critical break point in the middle. The two sequences “diverge” from a shared light color that stresses important mid-ranges in the data. The two extremes are visualized by contrasting dark hues while changes in lightness are used to display intermediate values. Diverging schemes are usually symmetrical but specific data distribution may require shifting the break point towards either one of the extremes. Common examples of data suitable for diverging color scales are temperature variations and stock exchange dynamics.

color in maps: qualitative color scheme

Using a qualitative color scheme with both hue and lightness variations to map twelve categories of land use in New York City. Map by Morphocode

color in maps: sequential color scheme

Using a sequential color scheme to map floor area ratios in New York City. Map by Morphocode

color in maps: binary color scheme

An example of a binary color scheme. The map shows buildings that are currently part of the cultural heritage in Sofia in yellow and buildings that are no longer listed as such in blue. Map by Morphocode.

 

 

 

Design for the color-blind

Making a map accessible for people with color vision deficiency is another important thing to consider while designing color scales. Approximately 4.5 percent of the population worldwide is color blind with the red–green color blindness being the most common type. This decreased ability to recognize color affects more often men than women: around 8 percent of the male population is color blind while only 0.5 percent of women have some sort of color vision impairment.

color in maps: visual impairmentPeople who are color-blind can still see lightness differences and a fairly wide range of hue differences (Brewer, 1999). However qualitative schemes remain particularly difficult to read by color-blind users; sequential schemes, on the other hand, are much more accessible due to the lightness variation between each step. In order to make a categorical map readable by an audience with color vision impairment it is necessary to add variations in both hue and lightness between each step. Even then, if the categories are more than “the magical number 7” it would be almost impossible to make the map accessible. A possible solution to that problem is to add texture to make the steps more distinguishable from one another.

color in maps: accessibility

 

Mapping Urban Data: Online Course

In our upcoming online course Mapping Urban Data we will discuss in further detail the use of color to represent data on maps. You will learn how to design and apply sequential and categorical schemes through a series of practical examples. The course takes a hands-on approach to data visualization through a range of New York City–based case studies covering topics such as built density, land use and sidewalk cafés.

Mapping Urban Data: The Workflow
Choosing the right color scheme is part of the process of creating an interactive urban data visualization. The entire workflow will guide you through the process of spatial data exploration, map design, web mapping and map tiles generation, user interaction design, along with the coding skills required to finish the project. The course will be available soon offering special discounts to Morphocode Academy subscribers.

 

 

 


 

Image sources:

1. Imports of cotton in Europe for the years 1858, 1864 and 1865. Charles Joseph Minard (1866) is courtesy of Library of Congress Geography and Map Division Washington, D.C.
2. Wage and nationality maps, “Hull House Maps and Papers ” (1895) – a groundbreaking study, led by Jane Addams and Florence Kelley. The study was influenced by Charles Booth’s poverty maps of London.
3. Movement of Iron Ore on the Great Lakes, 1897 and 1907. The Newberry Digital Collection
4. 1958 map of New York City by Eduard Imhof. Source: wonderful Codex99 blog
5. Generalized geologic map of the moon. Detail from I-1162 Geologic Map of the South Side of the Moon. USRA Lunar and Planetary Institute.

All other images are courtesy of Morphocode

 

Readings:

1. Bertin, J. (1967). “Sémiologie Graphique: Les diagrammes, les réseaux, les cartes”. Gauthier-Villars, Paris.
2. Brewer, C. A. (1999). “Color Use Guidelines For Data Representation”. Proceedings Of The Section On Statistical Graphics, American Statistical Association.
3. Friendly, M. (2008). “The Golden Age of Statistical Graphics“. Statistical Science 2008, Vol. 23, No. 4, 502–535
4. Imhof, E. (2007). “Cartographic Relief Presentations” , English ed. ESRI Press, Redlands, CA
5. Marey, E.]. (1885). “La Méthode graphique dans les sciences expérimentales et principalement en physiologie et en médecine“, G. Masson, Paris, p.73: “Toujours il arrive a des effets saisissants, mais nulle part la representation graphique de la marche des armees n’atteint ce degre de brutale eloquence qui semble defier la plume de l’historien.”
6. Playfair, W. (2005). The Commercial and Political Atlas and Statistical Breviary, Edited and Introduced by Howard Wainer and Ian Spence, Cambridge University Press, New York, NY.

 

Data Urbanism

 

Context

In 2007, the global urban population reached the 50% threshold and for the first time in history exceeded the global rural population. The same year, the first iPhone was released and set the tone for a smartphone revolution that changed the way we experience, navigate and interact with our immediate urban environment. We are now living in increasingly data-rich environments where open data platforms allow us to access, collect and analyse information about the city. As urban sensors become more and more ubiquitous and spatial information even more abundant, data vizualisation allows a critical evaluation of active policies and city services by transforming otherwise hidden patterns into visual arguments.

The amount of data generated by our daily activities and interactions will increase persistently, as digital devices continue to permeate our lives. And while we use those devices as a central access point to information, the data we generate on a daily basis — either directly or as a by-product of our social activities — is often associated with contextual meta-information about location, usage and people. In other words, data gives a valuable insight into both our social interactions and the environment that staged those interactions. Furthermore there is a strong tendency to open data repositories that were once locked within government agencies. Open access to information, as well as the emergence of low-cost or free analysis web tools, allows citizens to look for patterns in government activity or to use data analysis to advocate for change.

We refer to the process of making urban data visible, accessible and actionable as Data Urbanism.
Data Urbanism suggests an iterative approach to urban planning that starts with harnessing the potential of open spatial data by enabling hands-on interaction with it and transfoming the invisible bits into a coherent exploratory mechanism.

 

 

Cities: The Global Urban Transition

The trends of urbanization differ across the globe. In 2014, Latin America and the Caribbean and Northern America had the highest levels of urbanization, at or above 80%. Europe remains in third place with 73% of its population currently living in urban areas and is expected to reach 80% urban by 2050. Between now and 2050, 90% of the expected increase in the world’s urban population will take place in the urban areas of Africa and Asia [1]. In other words, the projected urban growth will be concentrated in cities in the developing world where the correlation of the rate of urbanization with economic growth has been weaker. Expansion of urban areas is also on average twice as fast as urban population with significant consequences for greenhouse gas emissions and climate change [2].

 

Global-Urban-Expansion

Above: Global urban population growth. Data Source: United Nations, World Urbanization Prospects: The 2014 Revision. Image by Morphocode.

Cities were once defined by Jane Jacobs as “problems in organized complexity”. Today, they are seen as engines of innovation and growth on a global scale which explains the general shift in urban planning thought from problems of equity to problems of efficiency [3]. But the problems of cities go beyond mere benchmarking of sustainability indicators. Social and economic issues in cities are what planners call “wicked problems”. Due to their complexity, they remain computationally intractable and cannot be solved in a top-down fashion by a central planner regardless the amount of data available [4].

Cities-smaller-2
Above: Global urban population growth is propelled by the growth of cities of all sizes. Data Source: United Nations, World Urbanization Prospects: The 2014 Revision. Image by Morphocode.

As rapid urbanization and advances in ICT are shaping the course of contemporary culture and society, the “Smart City” agenda is also gaining momentum. Focused mainly on issues of efficiency and optimal performance, this vision of the city suggests that every human action is quantifiable and therefore predictable. A technocratic take on urban governance that often fails to acknowledge the wider social effects of culture and politics shaping the complexities of urban life. Aside from transforming our cities into optimal systems and turning data into a huge commodity market, the smart tech sector has fewer things to say about the importance of civic engagement.

 

Making Data Visible, Accessible and Actionable

Data science can be understood in terms of seven stages: acquire, parse, filter, mine, represent, refine, and interact [5]. The first step, acquire, is associated with an open data release. This is a critical stage allowing civic hackers and data journalists to harness the revelatory power of data repositories. The other six steps, however, remain an impossible leap for the average citizen.  These steps are strongly associated with the practice of citizen-centered design.[6]

In the best case scenario open data is first released in machine readable format, say a .csv file or a .json file. Even then it is rarely usable by the majority of citizens as making sense of it requires a certain amount of technical skills. Few people, even within the city administration, are capable of transforming data repositories into visual elements of spatio-temporal order. This is where the open data movement is still in its infacy. And as we fail to reveal the full potential of open data, more people fail to recognize it as an integral part of their rights as citizens. In order to bridge the gap between open data and civic society data should be made visible, accessible and actionable for a variety of audiences.

Sofia-Building-Permits-2
Above: Mapping building permits in Sofia. Image by Morphocode

Public data is often locked behind proprietary web interfaces. This prevents the re-use of data and stops citizens from exploring, interacting with and making sense of available datasets. This is the case of the Building Permits in Sofia – a public register that keeps track of all recent building permits issued by the municipality of Sofia. While the data is publicly accessible, it is impossible to download or export it in a machine readable format. The raw data is essentially locked behind a single access point – the clunky interface of the web application. This prevents the re-use of data to create maps and visualizations; to ask questionts and search for answers in the data. As we mapped and visualized this single dataset a variety of questions, concerning the built environment emerged: How is the urban landscape changing and what trends are expected in the years to come?;  What are the dynamics of local businessesHow often does public space renovation happen around the city? How is public money spent? etc. (More updates on this project soon).

 

Data Visualization: Revealing Urban Insights

When Scottish engineer and economist William Playfair invented graphical statistics in the end of the 18th century, no one assumed the impact they would have on modern information design. His early attempts to analyse data from England’s import-export statistics at that time are exemplary for their visual literacy and simplicity. The foundations of graphic representation: line graphs; bar charts of economic data; pie charts and circle graphs – all originated at that time and still remain some of the basic elements of data visualization. More recently the rise of data journalism has brought a new light to the importance of information graphics in contemporary culture, where reading habits are shaped by the ubiquity of digital devices. Collecting data is important, but what’s even more important is connecting them to a specific context and revealing networks of interdependencies. And the best way to convey this type of information is through means of visual communication.

 

Pollution

Above: Visualizing pollution patterns. The data is collected from various sensors deployed in 7 cities around the globe and is part of the Data Canvas initiative. Visit project

Visualizing urban data is a critical task as cities continue to dominate global concerns about climate change, economic prosperity and social equity. Interactive visualizations reveal how cities perform and how people interact with the urban environment by exposing the underlying logic of demographic processes, mobility patterns and digitalized daily transactions. In that sense they are the key to maximizing data efficiency and upgrading urban governance to a more open and agile model. As we strive for more compact, connected and coordinated urban growth, visualizing the dynamics of urban processes becomes both an integral part of city governance and an instrument for civic engagement. Urban data has been explored widely across the globe and the resulting outcomes differ in scale and type: from large scale projects for real-time observation such as the IBM Intelligent Operation Center in Rio de Janeiro, to interactive urban dashboards, mobile applications and hackathons.

In all cases the main challenges for generating dialogue through urban data visualizations consist of choosing the right type of visual strategy and achieving high standarts for data accuracy.

 

 

 


 

References:

1. United Nations, Department of Economic and Social Affairs, Population Division (2014). World Urbanization Prospects: The 2014 Revision, Highlights (ST/ESA/SER.A/352).
2. IPCC, 2014: Climate Change 2014: Mitigation of Climate Change. Contribution of Working Group III to the Fifth Assessment Report of the Intergovernmental Panel on Climate Change [Edenhofer, O., R. Pichs-Madruga, Y. Sokona, E. Farahani, S. Kadner, K. Seyboth, A. Adler, I. Baum, S. Brunner, P. Eickemeier, B. Kriemann, J. Savolainen, S. Schlömer, C. von Stechow, T.Zwickel and J.C. Minx (eds.)]. Cambridge University Press, Cambridge, United Kingdom and New York, NY, USA.
3. Batty, M. (2012). Lecture: Smart Cities & Big Data How We Can Make Cities More Resilient[PDF]. University University College College Dublin
4. Bettencourt, L.M.A. (2013) The Kind of Problem a City is. Santa Fe institute Working Paper. Paper #: 2013-03-008.
5. Fry, B. (2004). Computational Information Design. PhD Thesis, Massachusetts Institute of Technology.
6. Harrel, C.(2013). The Beginning of a Beautiful Friendship: Data and Design in Innovative Citizen Experiences. In Goldstein, B. and Dyson, L.(Eds.). Beyond Transparency: Open Data and the Future of Civic Innovation. San Francisco, CA. Code for America Press.