Highcharts now prefers TopoJSON maps

Highcharts map displays the map of the world

With Highcharts v10, we have built TopoJSON support and client-side projection into the core product. This means smaller map files, faster loading, and more flexible map layouts.

TopoJSON

TopoJSON is an extension of GeoJSON that identifies shared polygon or line segments, typically a border between two countries, and refers it instead of repeating it. This, together with data compression of coordinates, greatly reduces file size compared to GeoJSON, and makes it highly suitable for use on the web. With the Highcharts Map Collection v2 we provide TopoJSON versions of our maps. Most of our map demo charts are rewritten to use the new map sources.

Built-in projection

Our legacy GeoJSON map sources were pre-projected, and information about the projection was encoded in the file. With use of a third party projection library it could be handled and longitude/latitude could be used in the map. With Highcharts v10 this is no longer necessary, as projection is built right into the product. This allows some features that were not previously possible:

  • Projection can be updated dynamically and by preference like in the Projection Explorer
  • Multiple map sources can be combined in the same map
  • Setting and getting the map view (center and zoom) is more intuitive and always based on longitude/latitude
  • In the future, we will start implementing support for web map tiling services (WMTS)

Map insets

Another feature of the legacy GeoJSON maps was to project offshore areas next to the mainland. Think Alaska and Hawaii next to mainland USA. When we removed projection from the source files we no longer had control over that, so instead we created the MapView Insets feature. It allows rendering features within a certain geographic area into a frame in the map, all defined in the chart configuration. But to make it more useable, we added a recommended map view node to some of the TopoJSON map sources, which will include recommended inset definitions. Furthermore, this is completely extendable and can be replaced, removed or modified by the chart configuration.

A better world map

As projection was removed from the source files, we needed to make sure maps look good by default. For small parts of the globe we chose the Lambert Conformal Conic projection, which is already recommended by many countries. 

For world maps, the most common map projection on the web is the WebMercator, but that is mainly because it works good with tiled map services. All in all it is not the best representation of the world map because it extremely exaggerates the size of polar areas. Another popular projection is Robinson, but it has also been criticized for emphasizing regions like Europe and North America. 

Therefore, we chose the Equal Earth as the default world projection. It was created as a response to the criticism. It retains the relative areas of countries, is visually pleasing like the Robinson, and also renders fast. It has been taken up by NASA among others.