Airbnb visualisation; explanation

Door Kor Dwarshuis op 2017-08-11

I made some visualisations of Airbnb in different cities through the years.

Animations are here.

I took the data from Inside Airbnb, file: listings.csv.gz, columns: host_name, host_since, latitude, longitude, About the data

The concept is very simple: You'll see a timeline, starting in 2008, when Airbnb was founded.

Every dot is the date since when an apartment is hosted (“host_since” column in the data), with the name of the owner. That is basically it. The dots are not removed.

Inside Airbnb states:

Location information for listings are anonymized by Airbnb.

  • In practice, this means the location for a listing on the map, or in the data will be from 0-450 feet (150 metres) of the actual address.

  • Listings in the same building are anonymized by Airbnb individually, and therefore may appear "scattered" in the area surrounding the actual address.

In some cases the date of the first listing of a particular airbnb host differs from the registration date Airbnb this host. Therefore timing of the appearance of these listings may not be 100% accurate. (thank you @Hemmik)

There is sound. I have done my best to make this app accessible, although I am afraid that it will be a total mess on a screenreader. I hope that the bleeps give an impression for people with visial impairment.

The higher the beep, the more appartments are rented out for the first time on that day.

There is no further interpretation, I'll leave that to the “reader”.

I am planning on improving the User Experience (dragging the map, etc) in the future.

Animations are here.

The animation is build with HTML5/JS/CSS3. I use the following libraries/polyfills/frameworks:

  • Animate.css (“Just-add-water CSS animations”);
  • the classList JavaScript polyfill;
  • CreateJS (“A suite of modular libraries and tools which work together or independently to enable rich interactive content on open web technologies via HTML5”);
  • Tippy.js (“A lightweight, vanilla JavaScript tooltip library”);
  • Fasclick (“Polyfill to remove click delays on browsers with touch UIs”);
  • Google Maps API;
  • Moment.js (“Parse, validate, manipulate, and display dates and times in
  • JavaScriptÆ);
  • prefixfree (“Break free from CSS prefix hell!”)

Animations are here.

© 2024 Kor Dwarshuis – gesponsord door Combell