Globe animation zoom on country name click

Hi everyone,
click on any country i want to zoom earth to that clicked country direction. how i can achieve this any idea? this is my code on country click i am calling this function.

unction onMouseClick() {
if (isected) {
var infoDiv = document.getElementsByClassName(‘infoDiv’)[0];
infoDiv.style.display = ‘block’;
var countryInfo = countries.filter(country => country.name === isected.name)[0];
infoDiv.querySelector(‘h1’).textContent = countryInfo.name;
controls.enableRotate = false;
// gsap.to(camera.position, {
// duration: 1,
// x: 0,
// y: 0,
// z: 11,
// onUpdate: function () {
// camera.lookAt(globe.position);
// controls.enableRotate = false;
// }
// });
// Hide all markers and labels
for (let marker of alvos) {
marker.visible = false;
elements.markerLabel[alvos.indexOf(marker)].visible = false;
}
// Show the selected marker and label
isected.visible = true;
elements.markerLabel[alvos.indexOf(isected)].visible = true;
earthRotationEnabled = false;
}
}

Check below link you will know what is my requirement - Global scale-up of NEXT GEN: results and projections

This thread may be what you’re looking for? :eyes:

1 Like