visualization – Albert S. Fu, PhD

Visualizing the 100 Largest Cities in the U.S. (1840-2010)

Albert S. Fu — Mon, 08 Jun 2015 06:12:12 +0000

In a previous post, I discussed how I like making visualizations for my classes using Google products. It’s a good exercise for me, and hopefully it leads to something useful in fall. My weekend project was this map of the 100 Largest Cities in the U.S. (1840-2010) using Google Charts’ GeoChart. It was largely based on this code. However, I had to make a number of changes to have it do what I wanted it to do. I also had to organize the data in way that was useful. The dots on the map mark cities that are amongst the top 100 urban centers in the United States in a census. The slider is a date filter that allows one to either move decade-by-decade to see the rise of cities in the Sunbelt, or see the persistence of a city in the top 100 depending on how you move the sliders.

The neat thing about the GeoChart API is that it rendered within the browser using SVG. While the GeoChart API will recognize place-names, it loads much faster if you use latitude/longitude coordinates instead of place-names. There are 269 cities in the map above, with data drawn from 18 census years.

This was meant to be a fun weekend project playing with the GeoChart API. I’ll probably play around with this a bit more, so that I can make use it in my urban sociology course in the fall.

Teaching and Visualizing School Segregation: Google Docs

Albert S. Fu — Fri, 03 Oct 2014 16:07:11 +0000

As I’ve discussed in an earlier post, education and race is a topic that I discuss in my classes. I’m also a big fan of providing visualized data for my students when I cover the material. So, I was very happy to see Reed Jordan at the The Urban Institute’s great post (with maps) on segregation in America’s public school system. Maps and other visual material support my lectures and PowerPoints in making the case that we are still very much a segregated country. Specifically, that this segregation is despite the country’s increased diversity. However, this post is not going to focus on segregation. Rather, I want to share the way I present information to my students via tables and charts in PowerPoint as well as Google Docs/Drive. Google Docs is not just a web-based replacement for Office. Part of Google Drive, it allows you to make Fusion tables to map and chart data. Its spreadsheet (and presentation program) can be embedded into webpages and other HTML files for easy online sharing (such as in your CMS). You can, of course, also share the spreadsheet if you wish.

Why do I want to share this material? If you’re a social scientist, you likely want to present data to your students. However, the charts included in publisher provided PowerPoints are ugly and often out-of-date. I’m hoping that sharing my spreadsheets will help you to embedded figures, tables and charts into presentations and other course materials.

Source: http://nces.ed.gov/programs/digest/d13/tables/dt13_203.50.asp

As mentioned above, the segregation we see in American public schools is despite the country’s increased racial and ethnic diversity. For most kids in the United States, they are more likely to attend schools where other students look like them than otherwise. For instance, Orfield and Frankenberg’s report has notes that we are in an unprecedented era of diversity, but there has been a long retreat from integration. The question for me as an instructor is: how do I convincingly present evidence that contradicts students’ notions of societal progress – the idea that the present (and future) is better than that of the past.

I like to show my students several years of data (within their lifetimes) to suggest that the problem of segregation is long-standing and enduring. This is also when I remind my students that their parents were likely born in the 1960s (amidst the Civil Rights Movement). This means that the history of Jim Crow is not ancient history. In Figures 2 & 3, we see that there has not been a lot of change in the new millennium. 60 years after Brown v. Board, most White kids go to schools that are predominantly white, just as most African-American kids go to schools that are predominantly black, and Hispanic/Latino students go to schools with other Hispanic/Latino kids.

Embedded charts and figures from Google Docs are nice because they are somewhat interactive with mouse overs revealing numbers and other information. The option to export charts and figures as images is available as well. However, I like embedding the HTML. I also prefer inserting or creating charts and figures via Excel. This allows for easier updating and having the visualized data fit the theme of your website or PowerPoint (which I haven’t done here).

Source: http://nces.ed.gov/ccd/pubschuniv.asp

While differences remain, there is some good news. The number of high school dropouts has decreased, with the steepest decline being amongst Hispanic students. The mouse over effect is particularly useful in the line chart above and below.

Source: http://www.census.gov/hhes/school/data/cps/historical/index.html

The steep decline in dropouts parallels a record high of students aged 18- to 24-year-olds being enrolled in college. In fact, a greater percentage of Hispanic high school graduates were enrolled in college than Whites in 2012. However, differences remain. Including links to the data sources is important. When I teach my Sociology of Visual Culture class, I require students to get data from the U.S. Census bureau to use in their charts, figures, and tables.

Source: http://www.census.gov/hhes/school/data/cps/historical/index.html

If this was a lecture, this is likely the point where I’d make a joke about information overload. I’ll wrap up by saying that I hope that my Google spreadsheet is useful (I hope to update it when I have more time). Also don’t forget, Reed Jordan’s post & maps on this issue. The maps are also embeddable.

Prepping for Fall 2014: Visualizing School Closures

Albert S. Fu — Tue, 10 Jun 2014 01:00:30 +0000

In my previous post, I mentioned that I spend a lot of time during the summer prepping for academic year. This fall requires extra work because I’m changing textbooks, and re-organizing a lot of material. I’m not doing this just to improve the content or my teaching, but I do this to “exercise” my other skills – things like playing with Google Fusion Tables, Photoshop, HTML, etc.

This fall I’ll be teaching urban sociology again and I’m currently updating material for the course. New on the syllabus for this year is Robert Sampson’s book on Great American City: Chicago and the Enduring Neighborhood Effect. Reading the book the past few weeks inspired me to think of examples to help students make comparisons/connections between Chicago and Philadelphia.

Perhaps the most obvious example is that were both hit bad with school closures in 2013 affected whole communities.

	Chicago	Philadelphia
School Closings 2013	47	23
Students Displaced	12,700	10,000
Layoffs	2,000	3,700
Charter Schools opened	15	9

The Chicago Tribune has an excellent map that illustrates some of social and economic dimensions of neighborhoods affected by the closures. Since, I’m very much in favor of visualizing data for my statistics-adverse students, I’ve decided to make my own map in Google Fusion Tables to help me with my lesson plan in the fall. I can always use Social Explorer, but it’s also useful and fun for me go through the effort of downloading U.S. Census data and making my own map.

The below is a color coded map of census tracts based on the percent of those with high school diplomas or higher based. The purple flags are where the schools closed in 2013 are located.

[Click for Map w/ Race & Income]

In particular, the consequences for school closures have dramatically affected communities of color. The Root reports that while African-American Students represent 58% of the students in Philadelphia, they made up 81% of the students affected by the closures. In Chicago, black students account for 43% of all students, but 87 of those affected. In this map, I’ve set it up so that you can toggle layers to look at race, income, and education attainment, so that you can see the connection between race and school closures. Setting up the toggle was fun it required playing around with JavaScript. For more simple layered maps, I use the Fusion Tables Layer Wizard. However, I wanted to create something that was more interactive that students could play around with. This required trying to find a color scheme for the maps so that when you toggle layers, they interact with one another in a way that is visually informative.

I’ll continue to work on this throughout the summer, but I wanted to blog on how summer “prep” work isn’t just revising lectures and reading. It can be an opportunity to develop other skills.

Adding Visualization to Your Course

Albert S. Fu — Sun, 02 Mar 2014 02:07:54 +0000

Visualization, or more specifically data visualization, is currently a major trend in communicating information in business, news media, and increasingly academic research and teaching. A 2013 white paper produced by the Intel IT Center, notes how visualization-based data discovery tools can aid businesses analyze, interpret and present data. In 2014, Wired Magazine noted the relationship between data and visualization for a variety of different purposes from policy research to augmenting news articles on NASA programs and projects. An article in the journal Visual Studies (associated with the International Visual Sociology Association) discusses the different applications of data/information visualization for humanities and social science research.

While data has always been visual, perhaps the most significant software package that made visualization “easy” at work and in school is the release of Microsoft Office in 1990. For almost a quarter century, PowerPoint has dominated how we think about visually presenting information. A fantastic thing that PowerPoint does, which too few people make use of, is importing or create from scratch charts and tables from Excel. This allows for a more visually appealing (and more legitimate) presentation, than if you were to download an image from online, or use a scanned image from your textbook.

However, PowerPoint is not without challenges. While PowerPoint and its integration with Word and Excel makes for excellent in-class presentations of visual information, it is not particularly good online without the help of Adobe Presenter or Camtasia to turn the PowerPoint into a “screencast.” There are cloud based solutions such Google Docs, Office 365 and Prezi that can make presentations animated and clickable in an online environment.

In the world of the Internet, concise and visually appealing graphics are king. This is why infographics are very popular online. As the name suggests, they graphically represent information, data or knowledge quickly and clearly. There is no single type of infographic. It could be a chart, map or timeline. It could be a word cloud. Sometimes a well-designed infographic is better than a PowerPoint. There are a number of online tools that can help you create an infographic.

Infographic Tools

The above links allow to create either static images or embeddable infographics that summarizes a lot of information. It can contain a combination of text, charts, maps, and other images that communicate a point or idea with (hopefully) hard data.

It is important to recognize that web-based infographic need not be the only way in which you visualize information. There are a number of useful tools, applications, and scripts that can make the way in which you present information online aesthetically appealing, dynamic, and interactive. Moreover, this can be just as useful in person or online. It can also be an additional resource that is posted on D2L.

Timelines

Timelines can help you organize information chronologically. Dipity is an easy tool for creating a timeline. If you are building a webpage or site outside of Desire2Learn, I personally like TimelineJS. Specifically, I like it because of how it uses Google Docs. Because it uses JavaScript, it will not work on D2L. However, if you are using WordPress on your own site, there are TimelineJS plugins that allow you to easily embed it into pages and posts.

Maps

In addition to organizing information temporally, there’s also the spatial aspect of information. I’m a big fan of Google Fusion Tables. It allows you to upload an Excel file with addresses or other geographic information to create different maps. If you don’t have a Google Docs account or want to simplify the process, then I recommend BatchGeo.

Words

For those of you interested in content analysis, you can create a word cloud to visualize word frequency in a website or document, or chart the historical usage of a phrase through history. These word clouds can be dynamic and visually interesting. For instance Tagxedoand Wordle can highlight popular or commonly used words in a website or document. Google has their Ngrams viewer for Google Books. This allows you to see how often various words or phrases appear in books throughout time. In addition to content analysis, there are a number of tools that allow you to see what is “trending” right on the Internet or how various idea are interconnected. Google Trends lets you see what is being searched. While,TwitterSpectrum allows you to look at relationships between trending tweets. Finally, Wiki Mind Map lets you look at how various terms, ideas, or concepts are connected on Wikipedia.

Advanced Charts

For those of you who are more ambitious, you may want to create your own dynamic webpage or content file from scratch. Probably, the easiest way to include interactive charts and data tools for is Google Docs and the many products from Google Labs/Developers.

However, if you have space and time, there are some really neat things that you can do. For instance, you can upload an Excel spreadsheet to Google Docs and use Google Charts to create an aesthetically appealing and interactive chart for your website. For pre-existing charts, you can browse Google’s Public Data Explorer.

If you do not want to use Google Docs, IBM’s Many Eyes does essentially the same thing without requiring an account. In addition to the material on Many Eyes, Better World Fluxhas beautiful and socially relevant data for social scientists.

For those of you with a bit more web development experience, here are two jQuery Chart Libraries to make an interactive chart for your website.

Conclusion

This is by no means an exhaustive description or listing of resources for visualizing information. However, I do believe the existence of different types of infographics and visualizations reveal the ever changing relationship between visual culture and knowledge. This is a change that I believe educators need to be sensitive of as we engage 21st century learners.

Originally published on KU Converge: A Journal of Faculty Collaboration for Distance Education