react-globe.gl icon indicating copy to clipboard operation
react-globe.gl copied to clipboard

How to set Globe's initial position?

Open Igal-Kleiner opened this issue 1 year ago • 4 comments

Is your feature request related to a problem? Please describe. When the Globe initiates, it's always centered somewhere above Africa.

Describe the solution you'd like It would be great if it'll be possible to provide some initial points prop, and the globe will be centered to these points. Something like:

<Globe initialPosition={{lat: 41.89193, lng: 12.51133}} />

Describe alternatives you've considered Perhaps provide a callback to onGlobeReady prop that will rotate the Globe to desired position. I couldn't find a way to do that programmatically so far though.

Igal-Kleiner avatar Apr 07 '23 10:04 Igal-Kleiner

OK, I found a way to do that with useEffect, globeRef and pointOfView(), but it looks cumbersome, and having a prop would be so much easier...

Igal-Kleiner avatar Apr 07 '23 13:04 Igal-Kleiner

@Igal-Kleiner mind sharing an example of how you managed to implement this?

MichaelBonnet avatar Sep 02 '23 21:09 MichaelBonnet

Something like this worked for me:

const ExampleComponent: React.FC = () => {
  const globeMethods = useRef<GlobeMethods | undefined>(undefined);
  return <Globe
              ref={globeMethods}
              onGlobeReady={() => globeMethods.current?.pointOfView({lng: -90, lat: 30})}

 />;

Sweater-Baron avatar Sep 19 '23 20:09 Sweater-Baron

Above post worked for me!

abhandaru avatar Aug 14 '24 02:08 abhandaru