Skip to content
A prototype to visualise data from the World Bank, this time using an Arduino and WebSockets .
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Interactive Africa Map D3 Arduino

This is a prototype which was built for a university assignment. The task was to build a prototype that makes use of data from the World Bank and concepts of embodied interaction.

I'm using an Arduino, a Sinatra Ruby app with WebSockets to connect to the Arduino, and D3.js to visualise the map. Instead of using normal inputs like mouse and keyboard, the slider in this application reacts to movements from an Arduino potentiometer.

See Youtube for a very simple video demonstration. And a live version (without Arduino support). (Optimised for Google Chrome only)

Initially based on eventmachine-websockets-demo and Web Interfacing with Arduino.


  • Set up a single potentiometer input on your breadboard. Like so: Potentiometer setup
  • Connect your Arduino via USB (no Ethernet Shield needed)
  • Load potentiometer code on your Arduino.
  • You might have to change the address of the serial port in app.rb. Have a look at your port in the Arduino environment to see which one you're using (Tools -> Port).
  • Start the Sinatra app:
> ruby app.rb
You can’t perform that action at this time.