When setting initial coordinates, globe disappears

[haveamission]

I have a globe as such:

                            <ReactGlobe
                                markers={markers}
                                globeBackgroundTexture={null}
                                height="70vh"
                                options={{
                                    cameraAutoRotateSpeed: 0,
                                    enableGlobeGlow: false,
                                    pointLightColor: 'white',
                                    pointLightIntensity: 1,
                                    pointLightPositionRadiusScales: [2, 0, -1],
                                    enableMarkerTooltip: true,
                                    markerEnterAnimationDuration: 3000,
                                    markerEnterEasingFunction: ['Bounce', 'InOut'],
                                    markerExitAnimationDuration: 3000,
                                    markerExitEasingFunction: ['Cubic', 'Out'],
                                    markerTooltipRenderer: marker =>
                                        `${marker.city} ${calculatePop(marker.value)}`,
                                    markerType: 'bar',
                                    markerRadiusScaleRange: [0.03, 1],
                                }}
                            />

When adding the following prop:

initialCoordinates={[29.7604, -95.3698]}

The globe disappears after a brief flash.

I tried to setup a code sandbox, but got an infinite loop when adding react-globe and three.js

[chrisrzhou]

Hey @haveamission, sorry for the late reply. I've been really busy the past few weeks.

This issue sounds related to not memoizing the initialCoordinates (or defining it outside of the component that is rerendering and causing the array prop assignment to be recreated, which triggers re-rendering). A note that react-globe doesn't handle this layer since it's a React-specific behavior. In the future, we might consider auto-memoizing these internally, but I want to see if this becomes a more common issue that the library should handle it.

https://react-globe.netlify.app/faq#why-is-my-globe-infinitely-rendering

Let me know if this resolves the issue!

[jon-slva]

Hey I am also having this issue! If someone found a solution, please let me know. It would be a tremendous help!