We need a small chunk of logic to tell our app when to show and when to hide the tooltip. With SVG, this logic is usually straightforward, as we can leverage mouseover and mouseout. With Canvas, we only really have mousemove on the entire Canvas. So, we build our own mouseover and mouseout logic. We start in the mousemove handler called highlightPicking():
function highlightPicking() { // Here, you find the country index and store it in pickedColor // and you check if the user’s mouse is in the globe or not with inGlobe selected = inGlobe && pickedColor[3] === 255 ? pickedColor[0] : false; requestAnimationFrame(function() { renderScene(countries, selected); }); var country = countries.features[selected]; if ...
