Sometimes the options don't load

[Martin Edwards]

I stripped the code down to what you see below, and 10% of the time the options don't load on page load. Any ideas?

import React from "react";
import ReactGlobe from "react-globe";

function Globe() {

  return (
    
      <ReactGlobe
        height={"100vh"}
        options={{
          globeGlowColor: "#0A69FB",
          globeCloudsOpacity: 1.0,
        }}
        width={"100vw"}
      />
  );
}

export default Globe;

[Martin Edwards]

My workaround to this was to use useEffect when the globe object was available, and also use a kinda yucky setTimeout.

// Only run once the globe object exists
  useEffect(() => {
    if (!globe) {
      return;
    }

    // Wait a second and re-add the same options
    setTimeout(() => {
      globe.updateOptions(options);
    }, 1000);
  }, [globe]);