Total Cost of Major Natural Disasters
This visualization is from the New York Times article The Places in the U.S. Where Disaster Strikes Again and Again. This visualization is a static, annotated bar chart that adapts the visualization size and annotations to different device contexts. To better understand the responsive techniques used, we performed an open-coding process of the changes between the desktop and mobile versions of the visualization. To view the mobile version of the visualization, we used the Device Mode provided by Chrome DevTools to simulated an iPhone X device in both a portrait and landscape orientation. Take a look at the article yourself, and the codes we generated here:
Desktop vs. Mobile (Portrait)
| Code |
Action |
Component |
| reposition title text |
reposition |
title |
| shorten annotations |
modify |
labels |
| remove annotation details |
modify |
labels |
| shorten axis year labels |
modify |
axis labels |
| reduce bar width |
resize |
marks |
| width compressed |
resize |
view |
| align axis labels |
reposition |
axis labels |
| remove wrap title text |
reposition |
title |
| y axis gridline changes |
resize |
gridlines |
| remove y axis ticks |
remove |
axis ticks |
Desktop vs. Mobile (Landscape)
| Code |
Action |
Component |
| no changes |
no changes |
view |