UPDATE: As of Matomo (Piwik) 1.11 in March 2013, we have released new Maps that are now written in SVG and are fully open source.
The maps also include Country, Region and City views, leveraging Matomo Geo Location capabilities.
Learn more in: Visitors World Map, and in the Real Time Visitors Map.
Content below this line is out of date.
Matomo is now happy to present to our fans the ‘map view’ feature, allowing you to visually see the countries in which your visitors come from on a world map.
The new plugin made its way into Matomo core since version 0.8 and is activated by default since version 0.9. Here is a brief list of the currently supported features:
- The widget displays a zoomable world map in which the countries are colored according to the selected metric, e.g. the number of visitors.
- It is possible to change the displayed metric using a Select box in the footer bar of the widget.
- A resizable legend improves the usablity as it helps to understand the color scale.
- Users are able look at the map in fullscreen mode for better viewing experience on smaller displays.
- Like the other flash-based visualization widgets the map supports image export (PNG).
Implementation details
The map is built from scratch using the Open Source Adobe Flex SDK and the free FlashDevelop IDE. It basically consists of two parts: a preprocessor for the map data (AIR) and a fast map renderer (Flash). The following figure illustrates the different functions:
The map source is taken from GeoCommons (an open community for geographic data) and was initially created by Emily Sciarillo, who released it under the Creative Commons license. The source contains a complete set of raw country boundary data which is linked to the corresponding iso codes. The map projection is done using the free as3proj library. Out of the many possible projection formulas we chose the Robinson projection, which shows a very beautiful world map. After projecting the map, the country outlines were simplified, which reduced the data filesize about 90% (from 2mb to 212kb) and results in faster rendering. In order to reduce the clients CPU load these complex calculations were rolled out into a separate application. The results are then packed in the Action Message Format (AMF) which produces a compact and fast to read binary files. The rendering is done using Flash, which is (yet) the only technology that provides fast vector drawing on nearly any major browser and platform. You can find more details on flash-based map rendering at the map author Gregor Aisch personal blog.
Use of the new Metadata API
The map rendering SWF requests the available metrics using the getProcessedReport function of the new Metadata API. The Metadata API is truly a great move forward in the Matomo plugin development as it eleminates the need for manual processing of raw Matomo metrics (like calculating the bounce rate or average time on site from several raw metrics) and also simplifies translations as all values are presented in localized format.
Possible Future Developments
Right now the map is in a very basic state, but we want to present some of our ideas for future versions of the map:
- Display of a detailed country view with the ability to compare sub-regions (like states in USA) and visitors cities. These features depend on the GeoIP plugin, which will is a high priority feature right after the 1.0 release. You are invited to participate in the design phase over here.
- Support for different client-side rendering technologies like SVG or HTML5 canvas.
- Support for server-side rendering for adding maps into PDF reports.
- Add a map view to the Live! plugin.
If you have any further ideas on what you’d like to see, feel free to tell us in the comment section or just open a new feature request in the Matomo Developer Zone.
Open Source
The map is released under GPLv3. You find the source of both the map preprocessor and the map renderer in Matomo SVN.
