Learning D3.js 5 Mapping - Second Edition

Highlighting the country on mouse over

Whenever a country is picked, we just pass the selected variable through to our drawScene() function that draws the world at each mouseover:

  // ...  selected = inGlobe && pickedColor[3] === 255 ? pickedColor[0] : false;  requestAnimationFrame(function() {    renderScene(countries, selected);  });} // highlightPicking()

At the end of our highlight handler, we didn’t only pass the countries to our render function, we also sent our newly created selected on the way. The renderScene() function just passes it through to drawScene(), which draws the world to the buffer Canvas. Remember that renderScene() just calls drawScene(), then clears the main Canvas and copies the buffer image over to the main Canvas.

In ...