Making the world move

Zooming into and rotating a globe projection is a truly joyous pastime, I find. Apart from being such fun, it’s also extremely useful when dealing with globe projections, as the user needs to be able to view the world from different angles.

In this section, we will add our first bit of Canvas interactivity to the globe. We will equip the users with the ability to zoom into and rotate the globe. Apart from setting up two additional global variables, we will exclusively do work in the ready() function–our central function tasked to prepare the data. From now onward, it will also deal with interactivity, right here:

function ready(world) {
  var countries = topojson.feature(world, 
  world.objects.ne_110m_admin_0_countries);
  requestAnimationFrame(function() {
    renderScene(countries);
  });

  /* Interactivity goes here */
}

Also, note that we wrapped...