But what about the Radio Stations audience around the world? Well, this is what it looks like when the Listeners in Streema’s Platform (Streema.com & Simple Radio App for iOS):

You can zoom in and out, and see a detail about what radio station is listening each user in real time:

How we built it?

In order to develop this map, we've employed a few tools and services. In first place, we used Mapbox, whose Javascript Open Source Library allows you to create beautiful interactive maps and data visualizations and integrate them to your website in minutes. Mapbox also has a customizable map layer of streets, buildings and places around the World, known as Mapbox Streets, powered by open data from OpenStreetMap.

In addition, Mapbox also provides an easy way to add some really useful Leaflet plugins to add some awesome features and interactions. By instance, markers clustering is done using Leaflet.markercluster, and the zoom slider widget it's here thanks to Leaflet.zoomslider.

Behind the scenes

So far, this is what you see. But how do we make everything work behind the scenes? Here at Streema, we have a set of services and applications, and between them we have Streema’s website and Simple Radio App for iOS.

Both applications keep track of several user actions and general metrics using an internal tracking tool which sends that information to a central service. By instance, we track every radio station played by every user. This central service also provides an interface to all our applications for listening to a subset of that actions and metrics. This way, we've been able to build a pretty simple application (using Tornado, a python framework and asynchronous networking library), that listens to every radio-played event and sends that information (using a websocket connection) to each visitor who’s seeing this map.

The simplicity of the application wouldn’t have been possible without the help from Maxmind whose geoip2 library gives us the power to localize each user; without the help from Heroku to get up and running quickly a production website; and NewRelic for keeping it constantly monitored and trace all the errors.